javascript-Function 유형 정리

1. 함수 성명과 함수 표현식
먼저 어떤 것이 함수 성명인지 봅시다.
 

<script>
function() {
    alert("hello, world.");
};

function foo() {
    alert("hello, world.");
};
</script>

어떤 것이 함수 표현식인지 다시 한 번 봅시다.

<script>
var foo = function() {
    alert("hello, world.");
};
</script>

다음은 이 함수를 먼저 설명하고 실행하는 것입니다.

<script>
(function() {
    alert("hello, world.");
})();
</script>

 
함수 선언과 함수 표현식의 차이점:
함수 성명, 해석기가 함수 성명을 먼저 읽고 모든 코드를 실행하기 전에 사용할 수 있도록 합니다.함수 표현식에 대해서는 해석기가 있는 코드 줄에 실행될 때까지 기다려야 진정으로 해석될 수 있다.

console.log(typeof(fn)); // function
    fn('abc'); // abc


    console.log(typeof(fnx)); // undefined

    if(fnx)
        fnx('abc');  // will not execute
    else
        console.log('fnx is undefined'); // fnx is undefined

    //  
    function fn(str)
    {
        console.log(str);
    };

    //  
    var fnx=function(str)
    {
        console.log(str+ ' from fnx');
    };

 
2. 함수 내부 속성
1)arguments, 클래스 그룹 대상, 전입 함수의 매개 변수를 저장합니다.이 대상은callee의 속성을 가지고 있으며, 이것은 지침으로 이arguments 대상을 가진 함수를 가리킨다.

// 
var sum = function(n){
  if (n <= 0)                        
  return 1;
  else
    return n ＋arguments.callee(n - 1)
}

 
2)this,this는 함수가 조작하는 대상을 인용한다.
 

window.color = "red";
var 0 = {color : "blue"};
function sayColor(){
     alert(this.color);
}
sayColor();  //"red"
o.sayColor=sayColor;
o.sayColor(); // "blue"

 
3) caller, 이 속성은 현재 함수를 호출하는 함수 인용을 저장합니다. 전역 작용역에서 현재 함수를 호출하면 그 값은null입니다.

function callerDemo() {
    if ( arguments.caller) { 
        var a= callerDemo.caller.toString();
        alert(a); 
    } else { 
        alert("this is a top function"); 
    } 
} 
function handleCaller() { 
    callerDemo(); 
} 
handleCaller(); 
function calleeDemo() { 
    alert(arguments.callee); 
} 
calleeDemo(); 

 
3. 함수의 속성
1)length: 함수가 수신하고자 하는 명명 함수 개수
2)prototype
 
4. 함수 방법
apply () 와call ().
그들의 역할은 특정한 작용역에서 함수를 호출하는 것이다. apply () 는 두 개의 매개 변수를 수신한다. 하나는 함수가 운행하는 작용역 (this) 이고, 다른 하나는 매개 변수 그룹이다. 이것은 Array의 실례일 수도 있고arguments 대상이 될 수도 있다.call () 방법의 첫 번째 매개 변수는 apply () 방법과 같지만, 함수에 전달된 매개 변수는 반드시 열거해야 한다

window.firstName = "diz";
window.lastName = "song";
var myObject = { firstName: "my", lastName: "Object" };
function HelloName() {
　　console.log("Hello " + this.firstName + " " + this.lastName, " glad to meet you!");
}
HelloName.call(window); //huo .call(this); //Hello diz song glad to meet you!
HelloName.call(myObject);  //Hello my Object glad to meet you!

 

function sum(num1, num2) {
return num1 + num2;
}
console.log(sum.call(window, 10, 10)); //20
console.log(sum.apply(window,[10,20])); //30 

우리는 apply () 와call () 의 진정한 용무는 함수를 확장하여 실행할 수 있는 작용역을 확장하는 것이다. 만약에 우리가 전통적인 방법으로 실현하고 싶다면 아래의 코드를 보십시오.

window.firstName = "diz";
window.lastName = "song";
var myObject = { firstName: "my", lastName: "Object" };
function HelloName() {
console.log("Hello " + this.firstName + " " + this.lastName, " glad to meet you!");
}
HelloName(); //Hello diz song glad to meet you!
myObject.HelloName = HelloName;
myObject.HelloName(); //Hello my Object glad to meet you! 

bind () 방법은 함수 실례를 만들고,this 값은 bind () 함수에 전달되는 값으로 귀속됩니다.

window.color = "red";
var o = { color: "blue" };
function sayColor(){
alert(this.color);
}
var OSayColor = sayColor.bind(o);
OSayColor(); //blue 

sayColor () 는 bind () 방법을 호출하여 o 대상에 전송하고 OSayColor () 함수를 되돌려줍니다. OSayColor () 에서this의 값은 o 대상입니다.