熟练掌握js中this的用法,解析this在不同应用场景的作用
function makeNoSense(x) {
this.x = x;
}
makeNoSense();
console.log(x);// x 已经成为一个值为 5 的全局变量
function test(){
this.x = ;
alert(this.x);
}
test(); //
情况二:作为对象方法的调用
函数还可以作为某个对象的方法调用,这时this指代对象内部属性被调用。
var myObject = {
value :,
increment:function (inc){
this.value += typeof inc ==='number' ? inc:;
}
};
myObject.increment();
console.log(myObject.value); //
myObject.increment();
console.log(myObject.value); //
情况三 :作为构造函数调用
function Point(x, y){
this.x = x;
this.y = y;
}
var p1 = new Point(,);
console.log(p1.x+","+p1.y);//3,2
为了表明这时this不是全局对象,我对代码做一些改变:
var x = ;
function Point(x, y){
this.x = x;
this.y = y;
}
var p1 = new Point(,);
console.log(p1.x+","+p1.y);//3,2
情况四: apply或call调用
function Point(x, y){
this.x = x;
this.y = y;
this.moveTo = function(x, y){
this.x = x;
this.y = y;
console.log(this.x+","+this.y);
}
}
var p1 = new Point(, );
var p2 = {x: , y: };
p1.moveTo(, ); //1,1
p1.moveTo.apply(p2, [, ]);//10,10
在上面的例子中,我们使用构造函数生成了一个对象 p1,该对象同时具有 moveTo 方法;使用对象字面量创建了另一个对象 p2,我们看到使用 apply 可以将 p1 的方法应用到 p2 上,这时候 this 也被绑定到对象 p2 上。另一个方法 call 也具备同样功能,不同的是最后的参数不是作为一个数组统一传入,而是分开传入的。本文通过对JavaScript中经常容易混淆的this在四中应用场景中的使用方法进行了讲解,希望对您有所帮助,喜欢的话,请推荐一下哦。
熟练掌握js中this的用法,解析this在不同应用场景的作用的更多相关文章
- [转载]js中return的用法
一.返回控制与函数结果,语法为:return 表达式; 语句结束函数执行,返回调用函数,而且把表达式的值作为函数的结果 二.返回控制,无函数结果,语法为:return; 在大多数情况下,为事件处理函 ...
- js中this的用法
经过近几周的模拟面试题,我查询了一些资料,今天就来说说,在js中this的用法吧.方法有四:第一,用作全局变量,第二,用作表该对象,第三,用作构造函数,第四,用作call和applay
- [JavaScript] JS中对Base64的解析
JS中对Base64的解析 <script type="text/javascript"> /** * UTF16和UTF8转换对照表 * U+00000000 – U ...
- JQuery之append和appendTo的区别,还有js中的appendChild用法
JQuery之append和appendTo的区别 append()前面是要选择的对象,后面是要在对象内插入的元素内容 appendTo()前面是要插入的元素内容且为Jquery对象,而后面是要选择的 ...
- JS中event.keyCode用法及keyCode对…
js中event.keyCode用法及keyCode对照表 标签: javascriptJavaScriptJavascriptjavaScript 2012-12-11 15:11 HTML Jav ...
- 浅谈JS中 reduce() 的用法
过去有很长一段时间,我一直很难理解 reduce() 这个方法的具体用法,平时也很少用到它.事实上,如果你能真正了解它的话,其实在很多地方我们都可以用得上,那么今天我们就来简单聊聊JS中 reduce ...
- JS中 reduce() 的用法
过去有很长一段时间,我一直很难理解 reduce() 这个方法的具体用法,平时也很少用到它.事实上,如果你能真正了解它的话,其实在很多地方我们都可以用得上,那么今天我们就来简单聊聊JS中 reduce ...
- MATLAB中冒号的用法解析
MATLAB中冒号的用法解析 1.: 表示所有的意思. (1)如:a(1,:) 表示a的第1行,示例: 结果: 同样的如果a(2,:)表示a的第2行 (2)反过来,a(:,2) 表示a的第3列,示例: ...
- JS中的this用法详解
随着对js的深入学习和使用,你会发现它里面包含了很多令人困惑的机制,比如对象.闭包.原型链继承等等,而这其中肯定包含令你现在或者曾经费解的this,如果你不把心一横,花点时间还真不明白这个this的用 ...
随机推荐
- Hibernate框架之双向多对多关系映射
昨天跟大家分享了Hibernate中单向的一对多.单向多对一.双向一对多的映射关系,今天跟大家分享下在Hibernate中双向的多对多的映射关系 这次我们以项目和员工举个栗子,因为大家可以想象得到,在 ...
- 【C#进阶系列】15 枚举类型和位标志
实际上本章就只讲枚举类型,因为位标志本来就可以当做一个特殊的枚举类型. 关于枚举类型 枚举类型是一种消灭魔法数字的好方法,使程序更容易编写,阅读和维护. 枚举类型是值类型,然而有别于其它值类型,枚举类 ...
- HTTPResponse object — JSON object must be str, not 'bytes'
http://stackoverflow.com/questions/24069197/httpresponse-object-json-object-must-be-str-not-bytes HT ...
- 修正 ColorPanel 选色缓慢问题
问题:TColorPanel 在运行时,选取颜色都会重绘,造成选色缓慢. 适用:Delphi XE5 修正:找出 FMX.Colors.pas 档案,并复制到自己的 Project 路径里,找到 TC ...
- Android 添加桌面快捷方式操作
/** * 为程序创建桌面快捷方式 */ private void addShortcut(){ Intent shortcut = new Intent(“com.android.launcher. ...
- Get,Post请求中文乱码问题有效解决方法
本文主要介绍如何有效解决web请求中的乱码问题,其实解决方法有很多种,不同的请求类型解决方法也不相同. 本文只介绍最方便的一种: 1.先修改jsp中的编码方式 2.针对Post方式提交的请求如果出现乱 ...
- maven url
aliyun阿里云Maven仓库地址--加速你的maven构建 maven仓库用过的人都知道,国内有多么的悲催.还好有比较好用的镜像可以使用,尽快记录下来.速度提升100倍. http://mav ...
- 形象化的spring 依赖注入原理
转. IoC就是Inversion of Control,控制反转.在Java开发中,IoC意味着将你设计好的类交给系统去控制,而不是在你的类内部控制.这称为控制反转. 下面我们以几个例子来说明什 ...
- MySQL的常规操作
MySQL的常规知识 show 查看数据库 show databases; 查看表 存在的所有表 show tables; 创建表的命令 show create table table_name; 表 ...
- Window对象
Window对象: Window 对象表示浏览器中打开的窗口,如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框 ...