js中this的深入研究
this对象是函数在运行时由调用函数的对象决定的:
1、在全局对象中运行函数时,this等于window
2、当函数被作为某个对象的方法调用时, this等于那个对象.
需要注意的几点:
声明函数里的this指向window(不论在哪里声明)
function ftn01(){
console.log(this);//window
function ftn02(){
console.log(this);//window
}
ftn02();
}
ftn01();
匿名函数里的this指向window(不论在哪里赋值)
var f3=function(){
console.log(this);//window
var f4=function(){
console.log(this);//window
};
f4();
};
f3();
属于对象的方法或者说被对象调用时,this属于这个对象
var obj = {
name:"sharpxiajun",
job:"Software",
show:function(){
console.log("Name:" + this.name + ";Job:" + this.job);
console.log(this);// Object { name="sharpxiajun", job="Software", show=function()}
}
};
var otherObj = new Object();
otherObj.name = "xtq";
otherObj.job = "good";
otherObj.show = function(){
console.log("Name:" + this.name + ";Job:" + this.job);
console.log(this);// Object { name="xtq", job="good", show=function()}
};
obj.show();//Name:sharpxiajun;Job:Software
otherObj.show();//Name:xtq;Job:good
如果通过new加构造函数(包括对象字面量定义)出来的对象,则对象里的this属于这个对象本身,如果通过这个对象再引用函数,则这个函数里的this属于这个对象
function Person(name,sex,age,job){
this.name = name;
this.sex = sex;
this.age = age;
this.job = job;
this.showPerson = function(){
console.log("姓名:" + this.name);
console.log("性别:" + this.sex);
console.log("年龄:" + this.age);
console.log("工作:" + this.job);
console.log(this);// Person { name="马云", sex="男", age=46, 更多...}
}
}
var person = new Person("马云", "男", 46, "董事长");
person.showPerson();
new操作符的解释
new操作符会让构造函数产生如下变化:
1. 创建一个新对象;
2. 将构造函数的作用域赋给新对象(因此this就指向了这个新对象);
3. 执行构造函数中的代码(为这个新对象添加属性);
4. 返回新对象
Call和apply是将this指针指向方法的第一个参数。
var name = "sharpxiajun";
function ftn(name){
console.log(name);
console.log(this.name);
console.log(this);
}
ftn("101");
var obj = {
name:"xtq"
};
ftn.call(obj,"102");
/*
* 结果如下所示:
*101
T002.html (第 73 行)
sharpxiajun
T002.html (第 74 行)
Window T002.html
T002.html (第 75 行)
102
T002.html (第 73 行)
xtq
T002.html (第 74 行)
Object { name="xtq"}
* */
以定义对象里的方法里传入函数为例:
情形一:传入的参数是函数的别名,那么函数的this就是指向window;
情形二:传入的参数是被new过的构造函数,那么this就是指向实例化的对象本身;
情形三:如果我们想把被传入的函数对象里this的指针指向外部字面量定义的对象,那么我们就是用apply和call
var obj={};
obj.f=function(){
console.log(this);
};
obj.f();
function f2(f){
f();
}
f2(obj.f);
setTimeout(obj.f,1000);
//obj
//window
//window
| 优先级 | 情景 | this 的值 | 备注 |
| 1 | new | new出来的空 object | |
| apply / call | 传入的参数 | 并列第一,apply / call不能和 new 同时出现 new arr1.show.apply(“1”); // 报错 |
|
| 2 | 定时器 | window | |
| 3 | 事件 | 发生事件的元素 | |
| 4 | 方法 | 所有者 | |
| 5 | 其他(嵌套等) | window || undefined | 看是否为严格模式 |
js中this的深入研究的更多相关文章
- js中for循环的研究
转自:http://blog.csdn.net/lushuaiyin/article/details/8541500 <html> <body> <b><ce ...
- js中new构造函数的研究
<javascript高级编程>里对new操作符的解释: new操作符会让构造函数产生如下变化: 1. 创建一个新对象: 2. 将构造函数的作用域赋给新对象(因此t ...
- 研究分析JS中的三种逻辑语句
JS中的三种逻辑语句:顺序.分支和循环语句. 一.顺序语句 代码规范如下:1. <script type="text/javascript"> var a = 10; ...
- 对Node.js 中的依赖管理的研究-----------------引用
nodejs依赖: dependencies devDependencies peerDependencies bundledDependencies optionalDependenc ...
- 深入研究js中的位运算及用法
什么是位运算? 位运算是在数字底层(即表示数字的 32 个数位)进行运算的.由于位运算是低级的运算操作,所以速度往往也是最快的(相对其它运算如加减乘除来说),并且借助位运算有时我们还能实现更简单的程序 ...
- js中几种实用的跨域方法原理详解(转)
今天研究js跨域问题的时候发现一篇好博,非常详细地讲解了js几种跨域方法的原理,特分享一下. 原博地址:http://www.cnblogs.com/2050/p/3191744.html 下面正文开 ...
- 由项目浅谈JS中MVVM模式
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1. 背景 最近项目原因使用了durandal.js和knock ...
- 三维空间旋转和Three.JS中的实现
三维空间中主要有两种几何变换,一种是位置的变换,位置变换和二维空间的是一样的.假设一点P(X1,Y1,Z1) 移动到Q(X2,Y2,Z2)只要简单的让P点的坐标值加上偏移值就可以了.但是三维空间的旋转 ...
- js中各种跨域问题实战小结(一)
什么是跨域?为什么要实现跨域呢? 这是因为JavaScript出于安全方面的考虑,不允许跨域调用其他页面的对象.也就是说只能访问同一个域中的资源.我觉得这就有必要了解下javascript中的同源策略 ...
随机推荐
- 1)phpmyadmin导入数据库大小限制修改
phpmyadmin默认导入数据库文件大小为2M,但一般网站的数据库导出的文件都会超出这个限制,要导入超过2M的数据库文件就需要手动修改php.ini配置文件!最近做项目遇到这个问题,顺便记录下了解决 ...
- js传参java接收乱码解决方案
js传参处理 encodeURI(encodeURI(name)); java接收处理 URLDecoder.decode(request.getParameter("name") ...
- poj 3270 置换
poj 置换的应用 黑书原题P248 /** 题意: 给定序列, 将其按升序排列, 每次交换的代价是两个数之和, 问代价最小是多少 思路:1.对于同一个循环节之内的,肯定是最小的与别的交换代价最小 2 ...
- TCP/IP笔记 三.运输层(2)——TCP 流量控制与拥塞控制
TCP 的流量控制与拥塞控制可以说是一体的.流量控制是通过滑动窗口实现的,拥塞避免主要包含以下2个内容: (1)慢开始,拥塞避免 (2)快重传,快恢复 1.流量控制——滑动窗口 TCP采用大小可变的滑 ...
- opencv-python 学习笔记1:简单的图片处理
一.主要函数 1. cv2.imread():读入图片,共两个参数,第一个参数为要读入的图片文件名,第二个参数为如何读取图片,包括cv2.IMREAD_COLOR:读入一副彩色图片:cv2.IMREA ...
- SQL存储过程动态查询数据区间
以前经常看到人查询数据库采用left join及case方式,一条一条的枚举查询整个数据的数据区间方法可行,但是数据一但很大,枚举就死悄悄,在网上查看,几乎全是照抄case ,left join枚举无 ...
- Cocos2d-x:环境配置小节
一.准备 须要下载下面内容. 1. vs2010 下载地址:http://download.microsoft.com/download/1/4/3/143B7583-6225-474F-88D5-5 ...
- js柯里化的一个应用
听到同学说面试一道题目 add(1)(2)(3)(4); 查询了下资料 这是一个js里面的柯里化 现象 add_curry防范返回的是一个 retVal,并不是执行结果.这里的代码很想递归,但是不是 ...
- SQL Server2012新特性概述
公司最近要升级数据库,SQL Server 2008R2-->2012.再开始升级之前先找了点资料分析一下2012的新特性和功能,提前预热一下. 2012中主要关注一下三个领域: 性能:改进的核 ...
- SSIS DB目录设置 (Integration Services Catalogs)
1.创建SSISDB目录 这里没什么好说的,点击Enable CLR Integration ,然后设置一个加密密码 2. SSIS Catalog设置 Retention Period (days) ...