this의 타입 this의 값은 함수를 어떻게 호출했는지에 따라 달라지는데 이는 JAvaScript 코드를 이해하기 어렵게 만드는 고질적인 문제 중 하나입니다. (따라서 많은 개발팀에선 클래스 메서드를 제외한 다른 모든 곳에서 this 사용을 금한다고 합니다.) this가 자주 문제를 일으키는 원인은 할당 방법에 있습니다. 메서드를 호출할 때 this는 점 왼쪽의 값을 갖는다는 것이 일반적인 원칙입니다. let x = { a() { return this } } x.a() // a()의 바디 안에서 this는 객체 x 하지만 호출이 일어나기 전 어느 시점에서 a를 다시 할당하면 결과가 달라집니다. let a = x.a a() // 이제 a의 바디 안에서 this는 정의되지 않은 상태 아래처럼 날짜의 타입을..
call, apply, bind 함수를 괄호 ()로 호출하는 방법도 있지만, JavaScript에선 두 가지 방법을 추가로 제공합니다. function add(a: number, b: number): number { return a + b } add(10, 20) // 30으로 평가 add.apply(null, [10, 20]) // 30으로 평가 add.call(null, 10, 20) // 30으로 평가 add.bind(null, 10, 20)() // 30으로 평가 apply는 함수 안에서 값을 this로 한정하며 두 번째 인수를 펼쳐서 함수에 매개변수로 전달합니다. call도 같은 기능을 수행하지만, 인수를 펼쳐서 전달하지 않고, 순서대로 전달한다는 점이 다릅니다. 비슷한 방식으로 bind도 th..
나머지 매개변수 인수를 여러 개 받는 함수라면 그 목록을 배열 형태로 건넬 수 있습니다. function sum(numbers: number[]): number { return numbers.reduce((total, n) => total + n, 0) } sum([2, 4, 6)] // 12로 평가 때로는 인수의 개수가 고정된 고정 인자 API가 아니라 인수의 개수가 달라질 수 있는 가변 인자 API가 필요할 때도 있습니다. 전통적으로 JavaScript는 마법 같은 arguments 객체를 통해 해당 기능을 제공했습니다. JavaScript 런타임이 함수에 자동으로 arguments를 정의해 개발자가 함수로 전달한 인수 목록을 할당한다는 점은 마법 같은 일입니다. arguments는 일종의 순수한 배..
선택적 매개변수와 기본 매개변수 객체와 튜플 타입에서처럼 함수에서도 ?를 이용해 선택적 매개변수를 지정할 수 있습니다. 함수의 매개변수를 선언할 때 필수 매개변수를 먼저 지정하고 선택적 매개변수를 뒤에 추가합니다. function log(message: string, userName?: string){ let time = new Date().toLocaleTimeString() console.log(time, message, userName || '뭐... 읎는데...') } log('페이지 로딩됨') // "17:07:22 PM 페이지 로딩됨 뭐... 읎는데..." 출력 log('유저 들어옴', 'cozyLinda') // "17:09:10 PM 유저 들어옴 cozyLind" 출력 JavaScript에..