javascript函數定義、呼叫模式及this的初始化實例詳解

函數定義

 函數包含一組語句，它們是javascript的基礎模組單元，用於程式碼重複使用、資訊隱藏和組合呼叫。函數用於指定物件的行為

函數的四種呼叫模式及this的初始化

第一種：方法呼叫模式
    下列事例證明透過方法呼叫模式調用時，this綁定到擁有該方法的物件。如：

var person = {
    name: "defaultName",
    setName : function(name){
        this.name = name;
    }
};
person.setName("zhangsan");
alert(person.name);

第二種：函數呼叫模式
    下列事例證明透過函數呼叫模式呼叫時，this綁定到全域物件上。如：

var test = add(value1, value2);
var name = "defaultName";
var person = {
    name: "zhangsan", // person中定义的name
    getName : function(){
        // 通过此方法可以将test函数的this改变为person的this对象
        var that = this;  // 解决方案
        // getName中定义的name
        var name = "lisi";
        var test = function(){
            // 通过that来访问person中的对象
            // this指向Global对象
            // this.name = defaultName
            // that.name = zhangsan
            alert([this.name, that.name]);
        };
        test(); // 函数调用模式
    }
}
person.getName();

第三種：建構器呼叫模式

// 定义一个Person的构造器，在调用时一定要用new调用
var Person = function(name){
    this.name = name;
}
// 添加一个方法到Person
Person.prototype.getName = function(){
    return this.name;
};
// 构造一个Person对象
var person = new Person("zhangsan");
alert(person.getName()); // 调用getName获取person对象中name属性的值

第四種：Apply呼叫模式

<script type="text/javascript">
    // 定一个累加方法。如sum(1,2,3,4...)
    // 该方法位于window执行环境中。
    var displayName = function(){
        alert("sum的执行环境: " + typeof(this));
        alert("Name: " + this.name); // 取出当前执行环境中name属性
    }
    // 定一个Person对象
    var Person = {
        name: "zhangsan"
    };
    displayName.apply(Person);
</script>

Apply和call的區別

// 定一个对象，包含一个add方法，返回a、b的和
var Person = {
    'add' : function(a, b){
        return a + b;
    }
};
// 显示a、b的和
function showInfo(a, b){
    alert(this.add(a, b));
}
// 通过apply方法改变showInfo方法的this指向
//showInfo(1, 3); // 对象不支持次对象
showInfo.apply(Person, [1, 3]);
showInfo.call(Person, 1, 3);
// 从上面可以看出，apply和call的区别是apply接受一个数组作为被调函数的参数，
// 而call是通过将被调函数的所有参数以逗号分隔的形式展开

以上是javascript函數定義、呼叫模式及this的初始化實例詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！