하얀 코딩

특징 얕은 복사 : 실제값 복사 (Number, String, Boolean, Null, Undefined) 깊은 복사 : 주소값 복사 (Object, Symbol) 등 원시값은 기본 자료형(단순한 데이터)을 의미합니다. Number, String, Boolean, Null, Undefined 등이 해당합니다. 변수에 원시값을 저장하면 변수의 메모리 공간에 실제 데이터 값이 저장됩니다. 할당된 변수를 조작하려고 하면 저장된 실제 값이 조작됩니다. 참조값은 여러 자료형으로 구성되는 메모리에 저장된 객체입니다. Object, Symbol 등이 해당합니다. 변수에 객체를 저장하면 독립적인 메모리 공간에 값을 저장하고, 변수에 저장된 메모리 공간의 참조(위치 값)를 저장하게 됩니다. 그래서 할당된 변수를 조작하..

정의 구조 분해 할당 구문은 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 JavaScript 표현식입니다. 구문 & 특징 var a, b, rest [a, b] = [10, 20] console.log(a); // 10 console.log(b); // 20 [a, b, ...rest] = [10, 20, 30, 40, 50] console.log(a); // 10 console.log(b); // 20 console.log(rest); // [30, 40, 50] { a, b } = { a: 10, b: 20 } console.log(a); // 10 console.log(b); // 20 // Stage 4(finished) proposal {a, b, ...rest} =..

정의 전개 구문을 사용하면 배열이나 문자열과 같이 반복 가능한 문자를 0개 이상의 인수 (함수로 호출할 경우) 또는 요소 (배열 리터럴의 경우)로 확장하여, 0개 이상의 키-값의 쌍으로 객체로 확장시킬 수 있습니다. 객체 앞에 ...을 붙여 사용합니다. 특징 1. 인자를 펼쳐서 넣는 개념입니다. const spread = [1, 2, 3]; const arr = [0, ...spread, 4]; // [0, [1,2,3], 4] (X) // [0, 1, 2, 3, 4] (O) 2. 빈 배열에 전개 문법을 사용할 경우, 아무것도 전달되지 않습니다. const spread = []; const arr = [0, ...spread, 1]; //[0,1] 3. 기존 배열을 변경하지 않습니다. 비파괴(immuta..

개념 JavaScript에서 호이스팅(hoisting)이란, 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미. var로 선언한 변수의 경우 호이스팅 시 undefined로 변수를 초기화합니다. 반면 let과 const로 선언한 변수의 경우 호이스팅 시 변수를 초기화하지 않습니다. 호이스팅을 설명할 땐 주로 "변수의 선언과 초기화를 분리한 후, 선언만 코드의 최상단으로 옮기는 것"으로 말하곤 합니다. 따라서 변수를 정의하는 코드보다 사용하는 코드가 앞서 등장할 수 있습니다. 다만 선언과 초기화를 함께 수행하는 경우, 선언 코드까지 실행해야 변수가 초기화된 상태가 됨을 주의할 것. // y만 호이스팅 대상 x = 1; // x 초기화. x를 선언하지 않은 경우 선언. 그러나 명령..

정의 함수와 함수가 선언된 어휘적(lexical) 환경의 조합을 말한다. 이 환경은 클로저가 생성된 시점의 유효 범위 내에 있는 모든 지역 변수로 구성된다. 위 정의에서 말하는 “함수”란 반환된 내부함수를 의미하고 “그 함수가 선언될 때의 렉시컬 환경(Lexical environment)”란 내부 함수가 선언됐을 때의 스코프를 의미한다. 즉, 클로저는 반환된 내부함수가 자신이 선언됐을 때의 환경(Lexical environment)인 스코프를 기억하여 자신이 선언됐을 때의 환경(스코프) 밖에서 호출되어도 그 환경(스코프)에 접근할 수 있는 함수를 말합니다. 이를 조금 더 간단히 말하면 클로저는 자신이 생성될 때의 환경(Lexical environment)을 기억하는 함수다라고 말할 수 있습니다. 특징 1..

스코프 1. 변수 접근 규칙에 따른 유효 범위 2. 안쪽 스코프에서 바깥쪽 스코프로는 접근할 수 있지만 반대는 불가능합니다. 3. 가장 바깥의 스코프는 전역 스코프(Global scope), 나머지는 지역 스코프(Local scope) 4. 지역 변수는 전역 변수보다 더 높은 우선 순위를 가짐. 5. 바깥쪽 변수가 안쪽 변수에 의해 가려지는(shadow) 이러한 현상을 쉐도잉(variable shadowing)이라고 부릅니다. 스코프의 종류 1. 블록 스코프(block scope) : 중괄호를 기준으로 범위가 구분됩니다. 2. 함수 스코프(function scope) : function 키워드가 등장하는 함수 선언식 및 함수 표현식을 만듭니다. 3. 화살표 함수는 블록 스코프로 취급됩니다. 함수 스코프가..

원시 자료형(primitive data types) 1. 객체가 아니면서 method를 가지지 않는다. 2. 원시 자료형은 모두 “하나”의 정보, 즉, 데이터를 담고 있다. 3. string, number, boolean, undefined, null, symbol, bigint가 있다. 참조 자료형(reference data type) 1. JavaScript에서 원시 자료형이 아닌 모든 것은 참조 자료형. 2. 주소를 할당 받으며 이 주소에 대한 내용은 힙(heap)에 저장이 된다. 3. 힙(heap)에는 주소에 대한 데이터들이 존재하고 동적으로 변화를 시킬 수 있다. 4. 배열([])과 객체({}), 함수(function(){})가 대표적입니다. 이해하기 console.log('Javascript'..

기본 개념 1. 구조는 {Key : value} 형태로 구성된다. let user = { firstName : 'white', // 왼쪽은 key 오른쪽은 value lastName : 'coding', country : 'Republic of korea' } 2. 객체의 값을 사용하는 방법 // 1. Dot notation user.firstName // 'white' user.country // 'Republic of korea' // 2. Bracket notation user['firstName'] // 'white' user[country] // 'Republic of korea' 3. 객체의 키와 값을 생성하기 user['url'] = 'https://white120.tistory.com/' ..