자바스크립트 객체, Scope, Closure에 관하여...
자바스크립트에서 너무너무 중요한 부분을 배우게 되었다...
일단 26일에 배운 객체를 다루는 새로운 방법을 나열해 보자.
객체 안의 배열만 골라낼 때 Array.isArray(obj[arr]) 이런식으로 사용하자.
객체 안에서 obj[odd] % 2 !== 0 && typeof obj[odd] === 'number' 과 같은 계산식 적용된다.
부등호를 사용할 때는 >=, <= 이런식으로 사용하자.
Primitive(원시) & Reference(주소or 참조) 자료형
원시 자료형이 할당될 때에는 변수에 값(value) 자체가 담기고, 1개의 정보만 담고 있다.
ex) let word = 'boolaboolla'
참조 자료형이 할당될 때는 보관함의 주소(reference)가 담긴다.
let x = {foo:3}
let x = {foo:3} 선언 후 let y = x; 할당하고 y.foo = 2 이런식으로 바꾸면 x값도 바뀐다.
같은 주소를 참조하고 있기 때문에...
재할당 할것만 let으로 선언한다. 기본적으로 const 키워드로 선언하면, 재할당은 불가능.
const는 값이 변하지 않는 변수, 즉 상수를 정의할 때 사용한다.
Scope = 변수의 유효범위
함수 안에 있는 변수는 밖에서 사용할 수 없다.
함수가 선언되면 함수 자신만의 Scope를 가진다.
※ JS는 기본적으로 function 단위로 자신만의 Scope를 가짐.
local에서 Global을 참조할 수 없음.
※ 만약 함수 안에서 같은 이름의 전역변수를 다시 선언하지 않고 가져와 쓴다면 그 전역변수의 값은 함수의 계산대로 바뀐다.
Block = {}중괄호로 시작하고, 끝나는 단위
function = 함수를 정의하는 단위
for 문에 쓰인 i의 경우 그 블럭 {}의 범위를 벗어나면 쓸 수 없다.
즉, console.log()를 밖에서 쓰면 i값을 확인해 볼 수 없다.
Global Scope에서 선언된 함수, var키워드를 이용해 선언된 변수는 window 객체와 연결됨
※ 선언 키워드 없이 변수를 초기화 또는 재지정 하면 전역 변수로 취급된다.
※ 실수를 방지하고 싶을 때 'use strict'; 를 사용하자. (파일을 저장한 상태에서만 사용 가능)
Closure = 외부 함수의 변수에 접근할 수 있는 내부 함수로 어떤 경우에 유용한지 알아두자.
function outerFn() {
let outerVar = 'outer';
console.log(outerVar);
function innerFn() { //여기서부터
let innerVar ='inner';
console.log(innerVar);
} //여기까지의 함수가 클로저 함수이다.
return innerFn;
}
클로저는 "함수와 함수가 선언된 어휘적(lexical) 환경의 조합"을 말한다.
tip. outerFn()() 이런식으로 함수를 연속으로 실행할 수 있다.
커링: 함수 하나가 n개의 인자를 받는 대신, n개의 함수를 만들어 각각 인자를 받게 한다.
function adder(x) { // X값이 100
return function(y) { // (2) 값이 y로
return x + y; // 100 + 2 리턴
}
}
adder(2)(3); //5
let add100 = adder(100); ※ X의 값을 고정해 놓고 재사용할 수 있다.
add100(2) = // 102
add100(10) = // 110
클로저 모듈 패턴: 변수를 스코프 안쪽에 가두어 함수 밖으로 노출 시키지 않는 방법
function makeCounter() {
let privateCounter = 0;
return {
increment: function() {
privateCounter++;
},
decrement: function() {
privateCounter--;
},
getValue: function() {
return privateCounter;
}
}
}
엄청나게 중요한 정보들이 내 머리로 쏟아져 내렸다. 급하게 생각하지 말고 천천히 확실하게 이해하고 넘어가자.
Author And Source
이 문제에 관하여(자바스크립트 객체, Scope, Closure에 관하여...), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@inusneo/자바스크립트-객체-Scope-Closure에-관하여저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)