자바스크립트 복습 -3

hodu·2023년 2월 25일
0

https://www.youtube.com/watch?v=4_WLS9Lj6n4&t=2411s

자바스크립트는 중요한 내용이 많다보니 적을 내용들이 많아진다.


구조 분해 할당(Destructuring assignment)

배열이나 객체를 분해해서 그 값을 담을 수 있게 하는 표현식




배열 구조 분해

ley num = [1,2];
let x = num[0];
let y = num[1];

이 3줄을 1줄로 줄일 수 있다.

let [x, y] = [1,2];

x //1
y //2

이런식으로도 가능하다

전화번호 만들 때 좋을 것 같다.

구조 분해 할당 시 값을 주지 않으면 undefined가 된다.
그래서 기본값 할당하면 그것을 막을 수 있다.


이럴 경우 값 백업 없이 값을 교환할 수 있다.



객체 구조 분해

배열 구조 분해랑 흡사하다

ley user = { name: "준호", age: 22};
let name = user.name;
let age = user.age;

이 3줄을 1줄로 줄일 수 있다.

let {name, age} = user;

name // "준호"
age // "22"

let {age, name} = user;
name // "준호"
age // "22"

순서를 바꿔도 키값에 맞춰서 들어온다

키값에 새로운 변수 이름으로 할당 했음

배열과 동일하게 할당가능


나머지 매개변수

(Rest parameters)

function showName(...names){
console.log(names);
}

showName(); //[];
showName('mike'); // ['mike'];
showName('mike', 'Tom')// ['mike', Tom];


전개 구문

(Spread syntax)

let arr1 = [1,2,3];
let arr2 = [4,5,6];

let result = [...arr1, ...arr2];

console.log(result); //[1,2,3,4,5,6];

let result = [0, ...arr1, ...arr2, 7, 8, 9];

console.log(result); //[0,1,2,3,4,5,6,7,8,9];

(reverse()는 배열을 뒤집어준다.)

스프레드 문법을 이용해서 푸쉬나 팝 같은 방법도 편하게 할 수 있다.


어휘적 환경

(Lexical Environment)


호이스팅이 일어나면 let으로 선언한 것은 초기화 안된상태에서 되어져서 사용할 수 없다.
함수는 초기화가 되어있어서 사용 가능하다.

let one을 만나면 undefined 사용가능 해짐
one = 1; 을 만나면 1을 할당

addOne(5); 를 만나면 새로운 Lexical 환경이 만들어진다.
그곳에는 매개변수와 지역변수들이 저장됨


내부 Lexical 환경에서 찾다가 없으면 전역 Lexical 환경에서 찾는다.
예로 console.log를 보면 num은 내부에서 찾을 수 있지만, one은 없어서 전역에서 찾고 바로 실행되어진다.


초기 선언시에는 const add3은 초기화가 되어지지 않았다.


const add3을 만나면서 makeAdder의 Lexical 환경이 만들어진다.


console.log를 만나면서 익명 함수의 Lexical 환경이 만들어진다.

setTimeout(fn, 0) 이라고 적어도 바로 실행되지 않는다.
현재 실행중인 스크립트가 먼저 실행된다.
그리고 실행되는데 4초정도의 대기시간이 있다.

헷갈렸던 것

http://taewan.kim/tip/argument_parameter/

profile
잘부탁드립니다.

0개의 댓글