JavaScript
-
MathJavaScript/자바스크립트 메서드 2023. 12. 13. 12:20
Math.abs() 숫자의 절대값을 반환한다. Math.abs(3-5); // 2 Math.abs(5-3); // 2 Math.abs(1.23456-7.89012); //6.6555599999999995 Math.abs(''); // 0 Math.abs([]); // 0 Math.abs(null); // 0 Math.abs(undefined);// NaN Math.max() 최대값을 반환한다. Math.max(1,2,3,4,5,6) //6 //배열의 최대값 구하기 const arr = [1,2,3,4,5,6,7,8,9]; const max = Math.max(...arr) // 9 Math.min() 최소값을 반환한다. Math.random() 0부터 1미만의 부동 소수점을 반환한다. Math.rando..
-
[객체]프로퍼티-기초JavaScript/자바스크립트 기본 2023. 12. 6. 20:45
1.프로퍼티 객체는 프로퍼티의 집합이다. 프로퍼티는 key와 value 쌍으로 이루어진 객체의 상태를 나타내는 값이다. const obj = { 프로퍼티 키 : 프로퍼티 값 } 프로퍼티 키 : 빈 문자열을 포함하는 모든 문자열 프로퍼티 값 : 모든 값 프로퍼티 키는 일반적으로 문자열이 온다. 문자열이므로 " "로 묶어야 한다. 하지만 식별자 네이밍 규칙을 준수한 이름이라면 따옴표를 생략하고 작성 가능하다. 하지만 네이밍 규칙을 준수하지 않은 이름이라면 따옴표를 사용해야한다. 식별자 규칙을 어긴 " - " 가 들어간 프로퍼티 키는 오류가 발생하지만, 프로퍼티 키를 따옴표를 붙여주면 에러가 발생하지 않는다. 따옴표를 생략하면 -를 연산자로 인식한다. 프로퍼티의 값은 자바스크립트에서 사용 가능한 모든 값을 사..
-
[객체]프로퍼티-심화JavaScript/자바스크립트 기본 2023. 12. 6. 18:14
요약 1.객체는 프로퍼티를 갖는다. 2.프로퍼티는 데이터 프로퍼티와 접근자 프로퍼티로 나뉜다. 3.각각의 프로퍼티는 프로퍼티 어트리뷰트라는 프로퍼티의 상태를 나타내는 내부 슬롯을 가진다. 1.내부 슬롯과 내부 메서드 프로퍼티 어트리뷰트를 알아보기 전에 이를 구성하는 내부 슬롯과 내부 메서드에 대해서 알아본다. 자바스크립트 엔진의 구현 알고리즘을 설명하기 위해 ECMAScript 사양에서 사용하는 이중 대괄호([[ ]])로 감싸져 있는 이름들이 내부 슬롯과 내부 메서드이다. 내부 슬롯과 내부 메서드는 외부로 공개된 객체 프로퍼티는 아니다. 하지만 일부 내부 슬롯은 간접적으로 접근할 수 있는 수단을 제공한다. 예를 들어 모든 객체는 [[Prototype]]이라는 내부 슬롯을 갖는데 원칙적으로는 접근할 수 없..
-
valueJavaScript/자바스크립트 기본 2023. 11. 16. 21:57
값(value)이란 무엇인가 값(value) = 표현식(expression)이 평가되어(evaluate) 생성된 결과이다. //10+20이 평가되어 값 30을 생성한다. 10+20 = 30 //변수에는 10+20이 평가되어 생성된 숫자 값 30이 할당된다. var sum = 10 + 20; 리터럴(literal) 이러한 표현식이 평가되어 생성되는 값(value)은 다양한 방법으로 생성할 수 있다. 가장 기본적인 방법은 리터럴(literal)을 사용하는 방법이다. *literal의 사전적 의미 : 문자 그대로의 리터럴 예시 정수 리터럴 100 문자열 리터럴 'hello' ,"hello" , `hello` 불리언 리터럴 true,false 객체 리터럴 {name:'kim'} .... .... 이렇게 리터럴은..
-
변수var,let,constJavaScript/자바스크립트 기본 2023. 11. 15. 21:08
1.메모리 1+2 컴퓨터는 위와 같은 연산이 있을 때 CPU를 사용해 연산하고, 메모리를 사용해 데이터를 기억한다. 메모리는 데이터를 저장할 수 있는 메모리 셀(memory cell)의 집합체이다. 각 셀은 메모리 주소를 갖는다. 이 메모리 주소는 메모리 공간의 위치를 나타낸다. 이 메모리 공간에는 2진수로 처리된 모든 데이터들(이미지,텍스트,동영상 등)이 저장된다. 예제 코드 1과 2는 메모리 상 임의의 주소에 저장되고 CPU는 이것을 읽어 연산을 수행한다. 또한 연산을 통해 생성된 값 3도 메모리 상의 임의의 위치에 저장된다. 하지만 연산 결과인 숫자 3은 현재 재사용할 수 없다.이 연산된 결과를 재사용 하고 싶다면 메모리 공간에 직접 접근하는 방법 외에는 없다. 하지만 이러한 방법은 치명적 오류를 ..
-
실행 컨텍스트(Execution Context)JavaScript/자바스크립트 기본 2023. 5. 21. 14:19
자바스크립트 코드가 실행되는 과정 var x; x = 1; 이런 자바스크립트 코드가 있다. 이 코드는 자바스크립트 엔진에 의해 컴파일 되는데 이 소스 코드를 두 개의 과정으로 처리한다. 1.소스코드의 평가 실행 컨텍스트를 생성하고 변수,함수 등의 선언문만 먼저 실행 후 스코프에 등록한다.(호이스팅이 발생) 2.소스코드의 실행 평가가 끝나면 코드가 순차적으로 실행되는 런타임이 시작된다. 이때 코드는 실행에 필요한 정보(변수,함수)를 실행컨텍스트가 관리하는 스코프에서 검색한다. 즉, 실행컨텍스트(Execution Context)는 식별자를 등록하고 관리하는 스코프와 실행 순서를 관리하는 자바스크립트 내부 메커니즘이다. 실행 컨텍스트는 렉시컬 환경과 실행 컨텍스트 스택을 통해서 수행된다. 👉🏻렉시컬 환경(le..
-
[객체 기초]3.구조 분해 할당(destructuring assignment)JavaScript/자바스크립트 기본 2023. 3. 23. 19:23
리액트를 공부하다보면 구조 분해 할당을 자주 마주칩니다. 정확한 사용법을 이해하고 쓰기 위해서 책과 자바스크립트 튜토리얼을 보며 공부한 내용을 정리하였습니다. 1.배열의 구조 분해 할당 1️⃣ES6 이전의 구조 분해 할당 구조 분해 할당은 배열 ,객체를 비구조화 하여 변수에 할당하는 것을 말한다. //ES5 var arr = [1,2,3]; var one = arr[0]; var two = arr[1]; var three = arr[2]; //ES6 const arr= [1,2,3]; const [one,two,three] = arr; 배열에 있는 요소를 변수에 저장하기 위해 ES6이전에는 각각의 요소를 추출하여 변수에 할당해 주었다. 그에 비해 ES6의 배열 구조 분해 할당은 간단하고 코드가 줄어든 것..
-
[JS]단축평가short-circuit evaluationJavaScript/자바스크립트 기본 2023. 3. 12. 14:56
1.단축평가 연산자(operator)는 하나 이상의 표현식을 대상으로 산술,할당,비교,논리,타입,지수 연산 등을 수행해 하나의 값을 만든다. 그 중 논리 연산자를 이용한 단축평가가 리액트를 공부하던 중 나왔는데, 이해가 부족해서 정리를 하려고 한다. || 논리합(OR)또는 && 논리곱(AND)의 평가 결과는 불리언 값이 아닐 수도 있다. 아래의 코드를 보자. '🙀' && '😻' --> 😻 AND연산자는 두개의 피연산자 모두 true일때 true이다. 첫 번째 값 '🙀'은 Truthy값이므로 true다. 하지만 아직까지는 위 표현식을 평가 할 수없다. 두 번째 '😻' 까지 평가해야지 위의 표현식을 평가할 수 있다. 두번째 피연산자가 위 논리곱 연산자 표현식의 평가 결과를 반환하는 것이다. 즉 AND연산자는..