JS 함수 및 화살표 함수
함수의 성명과 호출
함수 정의는 "function"키워드, 코드 함수 헤더와 함수체로 구성할 수 있으며, 함수 헤더는 함수 이름과 매개 변수 목록으로 구성할 수 있으며, 문법 형식: 함수 이름 (매개 변수 목록) {함수체}.... 와 같다
function name(arg){console.log(arg)}
호출
name(arg)
함수에 함수 이름이 없을 때 익명 함수라고 합니다.
function(arg){console.log(arg)}
보통 변수에 값을 부여해야 한다. 그렇지 않으면 오류를 보고해야 한다
var name=function(arg) {
console.log(arg)
}
호출
name(arg)
대상에 정의
var obj={
fn:function name() {
console.log(name.name+" "+name.length)
}
}
이렇게 호출할 수 있어요.
obj.fn()
또 하나는 정의가 끝나면 바로 호출되는 거예요.
(function name() {
console.log(name.name+" "+name.length)
})();
여기에는 자주 사용하는 함수 성명과 호출 방식만 열거되어 있다
화살표 함수
ES6 표준에는 Arrow Function(화살표 함수)이라는 새로운 함수가 추가되었습니다.
왜 Arrow Function이라고 해요?그것의 정의는 화살표를 사용하기 때문이다.
x => x * x
위의 화살표 함수는 다음과 같습니다.
function (x) {
return x * x;
}
화살표 함수는 익명 함수에 해당하고 함수 정의를 간소화했다.화살표 함수는 두 가지 형식이 있는데, 하나는 위와 같고, 하나의 표현식만 포함되며, {...}리턴이랑 다 생략했어.여러 개의 문장을 포함할 수 있는 또 다른 문장이 있는데, 이때 생략할 수 없다.및 return:
x => {
if (x > 0) {
return x * x;
}
else {
return - x * x;
}
}
, () :
// :
(x, y) => x * x + y * y
// :
() => 3.14
// :
(x, y, ...rest) => {
var i, sum = x + y;
for (i=0; i
객체를 반환하려면 단일 표현식일 경우 오류가 발생합니다.
// SyntaxError:
x => { foo: x }
{ ... } , :
// ok:
x => ({ foo: x })
this
화살표 함수는 익명 함수의 약자로 보이지만 실제로 화살표 함수와 익명 함수는 뚜렷한 차이가 있다. 화살표 함수 내부의this는 어법 작용역으로 상하문에서 확정된다.
앞의 예를 돌이켜 보면 자바스크립트 함수가this 귀속에 대한 오류 처리로 인해 다음 예는 예상한 결과를 얻을 수 없습니다.
var obj = {
birth: 1990,
getAge: function () {
var b = this.birth; // 1990
var fn = function () {
return new Date().getFullYear() - this.birth; // this window undefined
};
return fn();
}
};
현재, 화살표 함수는this의 지향을 완전히 복구했다.this는 항상 어법 작용역, 즉 외부 호출자obj를 가리킨다.
var obj = {
birth: 1990,
getAge: function () {
var b = this.birth; // 1990
var fn = () => new Date().getFullYear() - this.birth; // this obj
return fn();
}
};
obj.getAge(); // 25
화살표 함수를 사용하면 이전의 hack 쓰기:
var that = this;
더 이상 필요 없어요.
this는 화살표 함수에서 이미 어법 작용역에 따라 귀속되었기 때문에,call () 또는 apply () 로 화살표 함수를 호출할 때,this를 귀속할 수 없습니다. 즉, 전송된 첫 번째 인자는 무시됩니다.
var obj = {
birth: 1990,
getAge: function (year) {
var b = this.birth; // 1990
var fn = (y) => y - this.birth; // this.birth 1990
return fn.call({birth:2000}, year);
}
};
obj.getAge(2015); // 25
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSONJSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.