Javascript中this关键字的一些小知识_javascript技巧-js教程-PHP中文网

Javascript中this关键字的一些小知识_javascript技巧

php中文网

发布： 2016-05-16 16:09:26

原创

1503人浏览过

javascript应该是现在最流行的跨平台语言之一，一直在玩前端的一些有意思的东西，发现竟然没有掌握好这门语言。有点舍本逐末，于是想趁着现在这有空的时候好好补充一点遗漏的东西。

this的隐性绑定

一开始这是我很迷惑的东西，刚开始看到的时候，不理解。而后，在相似的情况下，又能用类似的方法解决同样的问题。便试着理清这其中的知识，方便于查找。

这是一个Javascript语言上设计的错误，但是似乎这个错误是不可避免的，函数是对象，数组是对象等等。引用《Javascript: The Good Parts》中的例子

复制代码代码如下:

function add (a,b) {return a+b}

 var sum = add (3,4);

 console.log(sum); //sum = 7

此时sum的结果是7。

复制代码代码如下:

 > typeof add

 > 'number'

在这里可以看到，add的类型是数值。

以此模式调用函数时，this被绑定到全局变量。
也就是在现在的环境下，我们可以这样调用this

复制代码代码如下:

this.add(3,4)

这就是this的隐性绑定，而this会以不同的方式被绑定。

复制代码代码如下:

var hello = function (){

    return "Hello, " + this.name;

};

name = 'this';

console.log(hello());

这时我们就会得到Hello,this。而当

复制代码代码如下:

var hello = function (){
    return "Hello, " + this.name;
};
var user = {
    hello : hello,
    name : 'phodal'，

};
console.log(user.hello());

这时user中的hello便指向了hello函数，而这在我们的理解中，这怎么可能，所以是个Bug。

如果我们在这个方法中定义一个变量并给它赋值this,那么内部函数就可以通过那个变量访问到this。

var that = this

立即学习“Java免费学习笔记（深入）”；

于是当情况稍微复杂一点的时候我们就需要用到:

高级Bash脚本编程指南 chm版

这本书假定你没有任何关于脚本或一般程序的编程知识, 但是如果你具备相关的知识, 那么你将很容易就能够达到中高级的水平. . . 所有这些只是UNIX®浩瀚知识的一小部分. 你可以把本书作为教材, 自学手册, 或者是关于shell脚本技术的文档. 书中的练习和样例脚本中的注释将会与读者进行更好的互动, 但是最关键的前提是: 想真正学习脚本编程的唯一途径就是亲自动手编写脚本. 这本书也可作为教材来讲解一般的编程概念. 向伟大的中华民族的Linux用户致意! 我希望这本书能够帮助你们学习和理解L

查看详情

复制代码代码如下:

vat that = this;

tips:

1.this变量的作用域总是由其最近的封闭函数所确定。
2.使用一个局部变量(如me,self,that)让this绑定对于内部是可用的。

一个简单的例子:

复制代码代码如下:

var M = function(){
this.name = "M";
};

var MM = function(){
z = new M();
this.name = "MM";

    z.printName = function(){
        console.log(this.name);
    };
    return z.printName();
};

var mm = new MM;

这时的this指向的是M函数，而由MM自身。如果我们将M中的this去掉，那么返回的就是一个undefined。于是我们就创建一个当前this作用域的别名，如that或者self等等:

复制代码代码如下:

var MM = function(){

    z = new M();

    this.name = "MM";

    var self = this;

    z.printName = function(){

        console.log(self.name);

    };

    return z.printName();

};

这样就能返回一个MM了。除此之外，在ES5中可以用回调函数的bind方法。

复制代码代码如下:

var MM = function(){

    z = new M();

    this.name = "MM";

    z.printName = function(){

        console.log(this.name);

    }.bind(this);

    return z.printName();

};

bind可以将方法绑定到接收者。

其他

又一个hello,world

在一次偶然的机会中遇到print('Hello')('World'),然后输出了'Hello, World'。

所谓的高阶函数，看上去似乎很有用，有兴趣可以看看下一篇。