Javascript使用函数apply扩展环境对象

页面导航:首页 > 网络编程 > JavaScript > Javascript使用函数apply扩展环境对象

Javascript使用函数apply扩展环境对象

来源:互联网 作者:脚本宝典 时间:2015-09-22 13:35 【

通过实例对象作为参数传入调用构造函数对象的apply方法,以使实例对象作为环境对象在作为一个普通函数的构造函数中执行,构造函数的属性会覆盖到实例对象上,从而实现实例对象
通过实例对象作为参数传入调用构造函数对象的apply方法,
以使实例对象作为环境对象在作为一个普通函数的构造函数中执行,
构造函数的属性会覆盖到实例对象上,从而实现实例对象的属性扩展。
 
1.函数对象的apply和call传入参数
    var tag = "global";    function say(){        for(var args = "", i = 0; i < arguments.length; ++i)
            args += arguments[i] + ",";
        console.log(this.tag + ": " + args);
    }    var obj = {
        tag: "obj",
        sayObj: function(){
            console.log(this.tag);
        }
    };    /**apply接受环境对象和数组参数;call接受环境对象和打散的数组参数*/
    say.apply(obj, [1, 3, 7, 11]);//obj: 1,3,7,11,
    say.call(obj, 2, 4, [8, 14]);//obj: 2,4,8,14,
    say();//global

    /**obj对象内部的this还是指向Global的,对象内部的函数的this才会指向这个对象*/
    //obj.say(); //Uncaught TypeError: obj.say is not a function
    obj.sayObj(); //obj
 
2.只有函数对象才有apply方法调用
  var x = {
        name: "x",
        sayX: function(){
            console.log("x:" + this.name);
        }
    };    var y = {
        name: "y"
    };    /**调用的x对象的的sayX打印出x:x*/
    x.sayX(); //x:x

    /**普通的对象x上并没有apply方法以供调用*/
    //x.apply(y); //error: x.apply is not a function

    /**函数x.sayX在y对象的环境中执行,打印出x:y*/
    x.sayX.apply(y); //x:y

    /**在y中扩展的是sayX函数下的属性,而不是sayX本身*/
    //y.sayX(); //error: y.sayX is not a function
 
3.在函数对象上使用apply扩展其对象属性
    function X(){        this.name = "x";        this.age = 11;        this.say = function(){
            console.log(this.name);
        }
    }    function Y(){        this.name = "y";        this.color = "black";
    }    /**调用构造函数X返回一个实例x*/
    var x = new X();
    x.say(); //x
    console.log(x); //X {name: "x", age: 11, say: function()}

    /**用函数对象X中的属性扩展对象y*/
    var y = new Y();
    console.log(y); //Y {name: "y", color: "black"}    X.apply(y);
    console.log(y); //Y {name: "x", color: "black", age: 11, say: function()}

    /**函数X在对象环境y中执行把name赋值为X中的值x*/
    y.say(); //x
    y.name = "y";
    y.say(); //y
 
4.原因是环境对象作为this执行了函数中的代码
    var name = "global";    var obj = {
        name: "obj",
        callName: function(){            this.foo = function(){
                console.log("欺骗了IDE");
            };
            console.log(this.name);
        }
    };

    obj.callName(); //obj
    /**当不传参数给apply时,默认全局环境作为第一个参数;同时全局也会获得原始环境中的属性*/
    obj.callName.apply();    /**在原来的obj环境中运行函数,搜索到最近的值还是obj的属性name的值obj*/
    obj.callName(); //obj
    /**
     * 当没有执行上面的apply时,是会报错的;当然也不建议这样做
     * Uncaught ReferenceError: foo is not defined
     * 在执行apply时,运行了this.foo=...,这里的this在运行时指的是全局环境
     * 所以在下面执行foo时,会打印出     */
    foo();//欺骗了IDE
 
5.函数表达式模仿块级作用域避免全局变量冲突
    /**
     * 在通过圆括号把函数声明转化为函数表达式并立刻执行它
     * 这个函数内部的环境就是这个函数的环境,从而避免了全局变量冲突     */
    (function(){        var person = {
            name: "Ameki",
            age: 18,
            sayHi: function(){
                alert("Hello, " + this.name);
            }
        };        for(var prop in person){
            console.log(prop + ", " + person[prop]);
        }
    })();    /*
     name, Ameki
     age, 18
     sayHi, function (){
             alert("Hello, " + this.name);
         }     */


Tags:

文章评论

最 近 更 新
热 点 排 行
Js与CSS工具
代码转换工具

<