this的问题
javascript this可以绑定到:全局对象,自己定义的对象,用构造函数生成的对象,通过call或者apply更改绑定的对象
1.全局对象
|
1
2
3
4
5
|
function globalTest(name){ this.name=name; } globalTest('tree'); console.log(name);//tree,默认生成了全局属性name,并给name属性赋值了,这种写法一般是不允许的 |
2.自己定义的对象

var subway={
name:'1号线',
speed:0,
run:function(speed){
this.speed=speed;
}
};
subway.run(100);
console.log(subway.speed); //100,this绑定到对象subway

3.用构造函数生成的对象
构造函数约定第一个字母要大写,只有用new调用的时候才算构造函数,否则跟普通函数没有什么不同,用new调用构造函数,this会绑定到生成的对象。

function Subway(speed){
this.speed=speed;
}
var s=new Subway(100);
console.log(s.speed);//100;this绑定到新生成的对象

4.指定的对象,通过call或者apply绑定
call函数和apply函数的区别是参数不一样,两个方法都可以改变this绑定的对象,如下
call(obj,param1,param2……);
apply(obj,[]/*params[]参数数组*/);

function Subway(name){
this.name=name;
this.speed=0;
this.run=function(speed){
this.speed=speed;
};
}
var s=new Subway('1号线');
s.run(300);
console.log('一号线速度为:',s.speed);//300;this绑定到新生成的对象s
var s1=new Subway('2号线');
s.run.apply(s1,[100]);
console.log('二号线速度为:',s1.speed);//100;this绑定到对象s1
s.run.call(s1,200);
console.log('二号线速度为:',s1.speed);//200;this绑定到对象s1

最后:
javascript有一个设计缺陷,使得的this绑定混乱

var subway={
name:'1号线',
speed:0,
run:function(speed){
this.speed=speed; //绑定到对象本身
function test(speed){
this.speed=speed+50;//竟然绑定到全局变量了,真是匪夷所思啊
}
test(speed);
}
};
subway.run(100);
console.log(subway.speed);//100
console.log(speed);//150

解决方法约定用that代替this

var subway={
name:'1号线',
speed:0,
run:function(speed){
var that=this; //用that代替this
this.speed=speed;
function test(speed){
that.speed=speed+50;
}
test(speed);
}
};
subway.run(100);
console.log(subway.speed);//150
-----------------------------------------------------------------
var a=1;
function s(){
var a=2;
alert(a);
}
function s1(){
a=3;
alert(a);
}
function s2(){
var a=4;
alert(this.a);
}
function s3(){
a=5;
alert(this.a);
}
s();//2
s1();//3
s2();//undefined
s3();//5
随机推荐
- linux安装jdk和scala
安装jdk 1.下载jdk 2.在linux中创建一个文件夹java,我习惯放在user下 3.上传jdk安装包到java下,然后解压 4.ect/profile下修改文件,添加环境变量 JAVA_H ...
- 记一次【求n以内的素数个数】的优化记录
最近在leetCode上刷提,还是满锻炼人的,为以后面试打基础吧.不多说下面开始. 问题:求[2,n]之间的素数的个数. 来源:leetCode OJ 提示: Let's start with a i ...
- C++求一个十进制的二进制中1的个数
int oneNumInBinary(int n){ ; while(n){ n = n&(n-); cnt++; } return cnt; }
- 现在web前端这么火,钱景怎么样啊?
web前端开发工程师可以说是一个全新的职业,在IT整个行业中真正受到重视的时间没有超过5年,也正因为这样,大家越来越想了解web前端工程师的前景究竟怎么样? web前端培训就业前景如何?web前端工程 ...
- css初始化样式代码
为什么要初始化CSS? CSS初始化是指重设浏览器的样式.不同的浏览器默认的样式可能不尽相同,所以开发时的第一件事可能就是如何把它们统一.如果没对CSS初始化往往会出现浏览器之间的页面差异.每次新开发 ...
- VS工程添加资源文件
1. 添加资源文件: 2. 资源文件内写相应代码: <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006 ...
- layoutSubviews
- Sass与Web组件化相关的功能
Sass https://en.wikipedia.org/wiki/Sass_(stylesheet_language) Sass (Syntactically Awesome Stylesheet ...
- C语言第三次作业
#include<stdio.h>//1.三角形 int main() { printf("*\n"); printf("**\n"); print ...
- C#如何实现下载文件保存到本地上面去
public void btnTemplate_Click(object sender, EventArgs e) { string strResult = string.Empty; string ...