Create Date: 2022/12/30
Update Date: 2022/12/30
함수는 한 번 정의하면 몇 번이고 호출할 수 있는 자바스크립트 코드 블록입니다.
function sum(a, b) {
return a + b;
}
sum(2, 3);
- 위 코드에서 매개변수와 인자는 무엇일까요?
- 매개변수: a, b / 인자: 2, 3
const array = {
push: () => [].push('a'), // <= 객체의 ㅁㅁㅁ?
};
- 위의 push라는 함수는 객체의 ㅁㅁㅁ라고 부릅니다. ㅁ안에 들어갈 단어는 무엇일까요?
- 메서드
function 함수_선언문() {
return '함수 선언문';
}
const 함수_표현식 = function () {
console.log('함수 표현식');
};
이전에 이런 문제를 냈었습니다. 화살표 함수는 함수 표현식입니다.
ES6에서 =>
를 이용해 간결한 문법으로 함수를 정의할 수 있습니다.
const isGenius = () => true;
화살표 함수는 문법이 간결하므로 다른 함수에 전달할 때 이상적입니다. Array.method나 Object.method를 사용할 때 좋습니다.
// ES5
var selected = allJobs.filter(function (job) {
return job.isSelected();
});
// ES6
var selected = allJobs.filter((job) => job.isSelected());
화살표 함수는 다른 방법으로 정의된 함수와 차이점이 존재합니다. 바로 자신이 정의된 환경의 this 키워드 값을 상속한다는 것입니다.
// ES5
function Person() {
this.age = 0; // `this`를 자신의 인스턴스로 정의.
setInterval(function growUp() {
// 비엄격 모드에서, growUp() 함수는 `this`를 전역 객체로 정의
// 이는 Person() 생성자에 정의된 `this`와 다릅니다.
// 따라서 외부 age, 내부 age는 다른 Reference를 가지고 있습니다.
this.age++; // dynamic scope # this
console.log(this.age); // NaN
}, 1000);
}
var p = new Person();
// ES6
function Person() {
this.age = 0;
setInterval(() => {
this.age++; // lexical scope # this
console.log(this.age); // 1, 2, 3, 4, ...
}, 1000);
}
var p = new Person();