javascript中的this
s中的this总是让人,是js众所周知的坑之一。
总结一下,this的坑分为5种。
1.全局代码中的this。
alert(this);//window
全局范围内this将会全局,在浏览器window
2.作为单纯函数调用
function foo(x){this.x = x; } foo(99); alert(x);//全局变量x值为99
这里this指向全局对象,就是window。在严格模式中,则undefiend。
3.作为对象的方法调用
var name = "xiaoming"; var person = {name:"xiaohong",hello:function(sth){console.log(this.name + "says" + sth);} } person.hello("hello world");
输出 xiaohong says hello world。this指向person对象,即当前对象。
4.作为构造函数
new Foo();
function Foo(){
this.name = “fooname”;
}
构造函数内部的this指向新创建的对象
5.内部函数
var name = "xiaoming"; var person = {name:"xiaohong",hello:function(sth){var sayhello = function(sth){console.log(this.name + "says" + sth);}sayhello(sth);} } person.hello("hello world");
在内部函数中,this没有按预想的绑定到外层函数对象上,而是绑定到了全局对象。这里普 遍被认为是 JavaScript语言的设计错误,因为没有人想让内部函数中的 this指向全局对象。 一般的处理方式是将 this作为变量保存下来,一般约定为 that或者 self
var name = "xiaoming"; var person = {name:"xiaohong",hello:function(sth){var that = this;var sayhello = function(sth){console.log(that.name + "says" + sth);}sayhello(sth);} } person.hello("hello world");
6.使用call和apply设置this
person.hello.call(person, “world”);
apply和 call类似,只是后面的参数是通过一个数组传入,而不是分开传入。两者的方法定义:
call(thisArg[,arg1,arg2,…]); // 参数列表,arg1,arg2,…
apply(thisArg [,argArray] ); // 参数数组,argArray
两者都是将某个函数绑定到某个具体对象上使用,自然此时的 this会被显式的设置为第一 个参数。
我们可能经常会写这样的代码:
$(“#ele”).click=obj.handler;
如果在 handler中用了 this,this会绑定在 obj上么?显然不是,赋值以后,函数是在回调中执行的,this会绑定到$(“#ele”)元素上。
这边介绍一个bind方法
var name = "xiaoming";var person = {name:"xiaohong",hello:function(sth){var that = this;var sayhello = function(sth){console.log(that.name + "says" + sth);}sayhello(sth);}}var odiv = document.getElementById("odiv"); odiv.onclick=person.hello.bind(person,"hello world");//xiaohong says hello world
bind方法和call/apply方法一样,不同的就是bind方法不执行,只是拷贝代码。用这个方法可以改变this指向,this指向的不再是odiv而是person。
转载于:https://www.cnblogs.com/gongyue/p/7954644.html
javascript中的this相关推荐
- 浅析 JavaScript 中的 函数 uncurrying 反柯里化
柯里化 柯里化又称部分求值,其含义是给函数分步传递参数,每次传递参数后部分应用参数,并返回一个更具体的函数接受剩下的参数,这中间可嵌套多层这样的接受部分参数函数,直至返回最后结果. 因此柯里化的过程是 ...
- JavaScript中,this的绑定规则
对于 JavaScript 新手来说,this 是非常基础同时也难以理解的知识点. 比如下面的代码,this 指向就有三种方式. 在<你不知道的 JavaScript>一书中,我总算比较清 ...
- Javascript中undefined,NaN等特殊比较
以下内容转自: http://blog.csdn.net/hongweigg/article/details/38090093 1.问题:在Javascript中,typeof(undefined) ...
- Javascript中二进制数据处理方法
Javascript中二进制数据处理方法 转载于:https://www.cnblogs.com/motadou/archive/2012/02/19/2358514.html
- JavaScript 中的有限状态机
http://www.ibm.com/developerworks/cn/web/wa-finitemach/ JavaScript 中的有限状态机 Page navigation 系列文章 有限状态 ...
- 在Javascript中使用面向对象的编程
by Mike Koss March 26th, 2003 这是一篇,我个人认为最好的,Javascript面向对象编程的文章.翻译不好的地方,还望大家指正,谢谢. 如果您需要,可以访问下面的地址取得 ...
- 取出url中的字符_如何在JavaScript中解析URL:例如主机名,路径名,查询,哈希?...
统一资源定位符(缩写URL)是对Web资源(网页,图像,文件)的引用.URL指定资源位置和检索资源的机制(http,ftp,mailto). 例如,这是此博客文章的URL: 通常,您需要访问URL的特 ...
- 在javascript中判断类型
String 一个字符串始终是一个字符串,所以这一块是很容易.除非使用new(new String)调用,否则typeof将返回"object".所以也要包含那些可以使用的字符串i ...
- JavaScript中几个重要的知识点(1) ---- 面向对象
JavaScript中几个最重要的大知识点 面向对象 DOM事件 异步交互ajax 面向对象 在JS中可以把任意的引用和变量都看成是一个对象.面向对象的主要三个表现形式: 封装 继承 多态 1. 封装 ...
- javascript中实例方法与类方法的区别
在javascript中,类有静态属性和实例属性之分,也有静态方法和实例方法之分 类属性(静态属性):通过类直接访问,不需要声明类的实例来访问 类方法(静态方法):通过类直接访问,不需要声明类的实例来 ...
最新文章
- Spark2.1.0之内置RPC框架
- win7 重启 IIS.
- 加密(Asp.Net配置文件的)配置节
- 产品运行所需的信息检索失败_为服务业注入新活力,华北工控推出服务机器人专用计算机产品方案...
- 《Unit Testing》2.1 经典学派如何做测试隔离
- .NET的一点历史故事:误入歧途,越陷越深
- 分而治之_编写干净的测试–分而治之
- Docker笔记1 基础概念和镜像
- 文献检索是利用计算机对文献,计算机文献检索方向论文选题 计算机文献检索论文标题怎么定...
- 【爬虫】微博数据采集
- 在openSUSE-Leap-15.4-DVD-x86_64中使用佳能喷墨打印机ip2780
- Mixly-数位计及1602屏亮度显示
- /项目3-分数类中的运算符重载
- java腰间盘终结者_大枣加大葱竟是腰椎间盘突出的终结者,一用一个好,腰不好不要错过...
- Unity 投掷物体的实现
- 利用python进行体重指数计算
- rv1126 usb转以太网(RTL8152)
- 相机图像镜像翻转与旋转的关系
- excel的日期和时间
- 一分钟复习完CSS基础知识