JavaScript-this理解
2024-08-22 16:08:18
javascript this可以绑定到:全局对象,自己定义的对象,用构造函数生成的对象,通过call或者apply更改绑定的对象
1.全局对象
function globalTest(name){
this.name=name;
}
globalTest('tree');
console.log(name);//tree,默认生成了全局对象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);//
console.log(speed);//
解决方法约定用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);//
最新文章
- Android图片资源
- 利用其它带文件防护功能的软件防止*.asp;*.jpg写入文件。
- 在 Xcode 6 中使用矢量图( iPhone 6 置配 UI)
- iOS开发之网络编程--小文件下载
- 在HTML中调用iOS
- AngularJs Test demo &;front end MVVM implementation conjecture and argue.
- Apache 中 .htaccess 文件设置技巧16则
- 《EnterLib PIAB深入剖析》系列博文汇总_转
- 自动化测试LoadRunner
- 自定义HBase的协处理器(Observer)
- [转载]async &; await 的前世今生
- 湖南多校对抗赛(2015.05.03)Problem A: Twenty-four point
- phpstrom 的一些常用设置
- BZOJ_1014_[JSOI2008]火星人prefix_splay+hash
- linux 清理缓存buff/cache
- C语言在宏定义中使用语句表达式和预处理器运算符
- 深入浅出Tomcat/4 - Tomcat容器
- 微信小程序-两个input叠加,多次点击字体变粗或闪动
- java中随机二维数组中寻找最大值并输出坐标
- C# 相对路径指定详解
热门文章
- 【转】Graphics.DrawCurve的算法
- qualcomm lk gpio
- SpringMVC小结
- linux系统下的缺失 libstdc++.so.6: version’GLIBCXX_3.4.20’的问题:
- Java如何从数组中查找公共的元素?
- unity----------------------四元数的概念
- Unity--------------------万向锁的概念
- php -- php模拟浏览器访问网址
- Python——thread
- Iso-seq 必备基础