JS 함수 및 화살표 함수

2976 단어

함수의 성명과 호출


함수 정의는 "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

좋은 웹페이지 즐겨찾기