实例讲解JavaScript中的this指向错误解决方法


看如下对象定义:

'use strict'
var jane = {
  name : ‘Jane',
  display : function(){
    retrun 'Person named ' + this.name;
  }
};

这样能正常调用

jane.display();

下面的调用会出错:

var func = jane.display;
func()
TypeError: Cannot read property 'name' of undefined

因为,this指向已经改变,正确的方式如下:

var func2 = jane.display.bind(jane);
func2()
'Penson named Jane'

所有函数都有其特殊的this变量,如下面的forEach

var jane = {
  name : 'Jane',
  friends: ['Tarzan', 'Cheeta'],
  sayHiToFriends: function(){
    'use strict';
    this.friends.forEach(function(friend) {
      // 'this' is undefined here
      console.log(this.name + ' says hi to '+ friend);
    });
  }
}  

调用sayHiToFriends会产生一个错误:

jane.sayHiToFriends()
TypeError: Cannot read property 'name' of undefined

解决方案一:将this保存在不同的变量中

var jane = {
  name : 'Jane',
  friends: ['Tarzan', 'Cheeta'],
  sayHiToFriends: function(){
    'use strict';
    var that = this;
    this.friends.forEach(function(friend) {
      console.log(that.name + ' says hi to '+ friend);
    });
  }
} 

解决方案二:利用forEach的第二个参数,它可以给this指定一个值

var jane = {
  name : 'Jane',
  friends: ['Tarzan', 'Cheeta'],
  sayHiToFriends: function(){
    'use strict';
    this.friends.forEach(function(friend) {
      console.log(this.name + ' says hi to '+ friend);
    }, this);
  }
} 

JS不用正则验证输入的字符串是否为空(包含空格)的实现代码
在项目中需要验证输入的字符串是否为空,包括空格,不太喜欢使用正则,所以就想到了js的indexOf函数,indexOf()方法可返回某个指定的字符串值在字符

Javascript基础_嵌入图像的简单实现
img元素允许我们在HTML文档里嵌入图像。要嵌入一张图像需要使用src和alt属性,代码如下:imgsrc="../img/example/img-map.jpg"alt="ProductsImage"width="580"height="266"/显

Javascript基础_简单比较undefined和null 值
JavaScript中有两个特数值:undefined和null,在比较它们的时候需要留心。在读取未赋值的变量或试图读取对象没有的属性时得到的就是undefined值。!DOCTYPEhtml