关于JS 函数this的用法

在js中写函数时,很多用到this. this究竟是什么,this是个关键字,是个指针,指向执行环境作用域,也称之为上下文。

先说下函数吧,个人理解是函数是在语言中重复调用的代码块.

在JS里,

把函数赋值给对象的属性时,称之为方法

如   

var m={};

m.title='title';

m.show=function(){

alert(this.title)

}

m.show()

就是把函数作为对象m的方法来调用

这样的话,this指向的就是m这个对象.


直接调函数名的叫函数

var a=1212;

function show(){

alert(a)//1212

}

 

show()//  1212

在全局环境里,可以把全局变量理解为window的属性,全局函数为window的方法

看下面的例子:
        var m ={};
        m.id='mmm';
        m.show=function(){
            alert(this.id);
        }
        var a={};

       a.id='aaa';
        a.show=m.show;
        a.show(); //aaa



  a.show=m.show;   先理解这句话,因为函数是个对象,

        m.show=function(){
            alert(this.id)
        }

这表达式相当于a.show 与m.show同时引用指向function(){
            alert(this.id)
        }

其实相当于a.show=function(){
            alert(this.id)
        }

所以调用a.show()时,this指向的是a对象,

再看以下一个栗子

        var m ={};
        m.id='mmm'
        m.show=function(){
            alert(this.id)
        }
        var a={}

       a.id='aaa'
        a.show=function(){

      m.show()

};
        a.show(); //mmm

所以调用a.show()时,相当于调用了m.show()的方法,所以this.指向的是m对象。


再看以下一个例子,一开始还是不很懂



    var color='red';
    var app = {};
    app.color="green";
    app.paint=function(node){
        node.style.color=this.color;
        alert(this.color);
    }
    function findNode(callback){
        var btn =document.querySelector('.btn');
        callback(btn);//传进来,

    }
    findNode(app.paint);


alert(this.color);  //red 而不是green

函数传参时,是按值传参的,而不是引用

  所以findNode(app.paint);传进来时,其实是function(node){
        node.style.color=this.color;
        alert(this.color);
    }的引用,又因为findNode是全局定义的,所以this指向WINDOW OR UNDEFINED;


关于传参,按值传递过去的


function show(a){

alert(a)

}

参数为基本数据类型时好理解

var b=10;

show(b)//alert(10);


至于对象

var c ={};

c.prop=true;

var showProp=function(obj){

obj.prop=false

}

showProp(c);  //c.prop = false

有些人觉得是上面例子是按引用传参

其实上面还是按值传参,showProp(c)把c传进函数里时,c其实相当于一个引用, 函数里对obj.prop=false,相当于对引用的对象 改成{prop:false}



再看下面一例子

var c ={};

c.prop=true;

var showProp=function(obj){

obj = new Object();

obj.prop=false

return obj;

}

showProp(c);

alert(c.prop);  //true

这里明明把传入obj修改了,如果按照函数按引用传参,函数里面的修改肯定会反映到外部

































评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值