학습일지(23.03.06.월)

FAST FOX·2023년 3월 8일

Arrow_Function Spread/Rest scope

학습일지

목록 보기

15/39

expect()

테스트 하는 값과 기대값을 비교하기 위해서 expect 함수를 사용한다.

expect(테스트하는 값).to.be.true //테스트 하는 값이 true여야 한다.
expect(테스트하는 값).to.equal(조건) //테스트하는 값이 조건과 같아야한다.

호이스팅

JavaScript에서 호이스팅(hoisting)이란, 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미한다.

console.log(x); // undefined
var x = 'good'

console.log(x); // error
let/const x = 'good'

js 엔진은 소스코드를 평가하는 과정과 실행하는 과정으로 나뉘는데 우선은 모든 변수에 undefined를 할당하고, 실행하는 과정에서 그 변수에 값을 재할당 하는 방식을 사용한다.

let과 const로 선언한 변수도 호이스팅 대상이지만, var와 달리 호이스팅 시 undefined로 변수를 초기화하지는 않습니다. 따라서 변수의 초기화를 수행하기 전에 읽는 코드가 먼저 나타나면 예외가 발생합니다.

Lexical scope

Lexical scope는 함수를 어디서 선언하였는지에 따라 상위 스코프를 결정하는 것이다. 중요한 점은 함수의 호출이 아니라 함수의 선언에 따라 결정된다는 점이다.

let message = "Outer"

function shadowParameter (message) {
  message = "Inner";
  return message'
}

shadowParameter("Parameter") // Inner

Default parameter

default parameter가 없는 상태에서 parameter에 주어지는 값이 없다면 undefined가 되지만 default parameter가 있다면 다음과 같다.

function pushNum(num, arr = []) {
  arr.push(num)
  return arr;
}

pushNum(20) // [20]
pushNum(4,[1,2,3]) // [1,2,3,4]

Arrow Function

화살표 함수를 이요해서 클로저를 표현하면 다음과 같이 표현할 수 있다.

const adder = x => {
  return y => {
    return x + y;
  }
}

const adder = x => y => {
  return x - y;
}

this

메소드는 어떤 객체의 속성으로 정의된 함수를 말한다. 가장 흔하게 쓰이는 코드인 console.log()에서 .log()도 메소드이다. 이런 메소드는 호출될 때마다 어떠한 객체의 메소드일텐데, 그 '어떠한 객체'를 묻는 것이 this이다.
예를들어 let obj = {foo: function() {return this}}라는 코드가 있다면 이때 obj.foo() === obj는 true가 나올 것이다.

하지만 arrow function에서의 this는 자신을 감싼 적적 범위(lexical context)이다. 일반 변수 조회 규칙을 따르기 때문에 현재 범위에서 존재하지 않는 this를 찾을 때, arrow function 바깥 범위에서 this를 찾는다.