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的深入研究的更多相关文章

  1. js中for循环的研究

    转自:http://blog.csdn.net/lushuaiyin/article/details/8541500 <html> <body> <b><ce ...

  2. js中new构造函数的研究

    <javascript高级编程>里对new操作符的解释: new操作符会让构造函数产生如下变化: 1.       创建一个新对象: 2.       将构造函数的作用域赋给新对象(因此t ...

  3. 研究分析JS中的三种逻辑语句

    JS中的三种逻辑语句:顺序.分支和循环语句. 一.顺序语句 代码规范如下:1. <script type="text/javascript"> var a = 10;  ...

  4. 对Node.js 中的依赖管理的研究-----------------引用

    nodejs依赖:  dependencies   devDependencies   peerDependencies  bundledDependencies  optionalDependenc ...

  5. 深入研究js中的位运算及用法

    什么是位运算? 位运算是在数字底层(即表示数字的 32 个数位)进行运算的.由于位运算是低级的运算操作,所以速度往往也是最快的(相对其它运算如加减乘除来说),并且借助位运算有时我们还能实现更简单的程序 ...

  6. js中几种实用的跨域方法原理详解(转)

    今天研究js跨域问题的时候发现一篇好博,非常详细地讲解了js几种跨域方法的原理,特分享一下. 原博地址:http://www.cnblogs.com/2050/p/3191744.html 下面正文开 ...

  7. 由项目浅谈JS中MVVM模式

    文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.    背景 最近项目原因使用了durandal.js和knock ...

  8. 三维空间旋转和Three.JS中的实现

    三维空间中主要有两种几何变换,一种是位置的变换,位置变换和二维空间的是一样的.假设一点P(X1,Y1,Z1) 移动到Q(X2,Y2,Z2)只要简单的让P点的坐标值加上偏移值就可以了.但是三维空间的旋转 ...

  9. js中各种跨域问题实战小结(一)

    什么是跨域?为什么要实现跨域呢? 这是因为JavaScript出于安全方面的考虑,不允许跨域调用其他页面的对象.也就是说只能访问同一个域中的资源.我觉得这就有必要了解下javascript中的同源策略 ...

随机推荐

  1. R与数据分析旧笔记(十八完结) 因子分析

    因子分析 因子分析 降维的一种方法,是主成分分析的推广和发展 是用于分析隐藏在表面现象背后的因子作用的统计模型.试图用最少的个数的不可测的公共因子的线性函数与特殊因子之和来描述原来观测的每一分量 因子 ...

  2. eclipse注解快捷键

    Search 功能:全局文件内容搜索快捷键: Ctrl + H -------------------------------------------------------------------- ...

  3. asp.net 多站点共享StateServer Session

    <sessionState mode="StateServer" stateConnectionString="tcpip=127.0.0.1:42424" ...

  4. mysql alter table

    准备: create table t(x int,y int); 用法 1: 修改列的数据类 alter table t modify column y nvarchar(32); 用法2: 给表加一 ...

  5. 理解angular中的module和injector,即依赖注入

    理解angular中的module和injector,即依赖注入 依赖注入(DI)的好处不再赘言,使用过spring框架的都知道.angularjs作为前台js框架,也提供了对DI的支持,这是java ...

  6. Eclipse启动后一直Initializing Java Tooling (1%)

    问题症状: 工作中eclipse崩溃,再次启动后cpu占用99%,状态栏一直显示Initializing Java Tooling: (1%). 解决方案: 删除\workspace\.metadat ...

  7. HDU 4417 Super Mario

    题解:函数式线段树求区间小于等于k的数有几个,离线做法,首先将所有询问和序列一起离散,然后用函数式线段树处理. #include <map> #include <cstdio> ...

  8. Struts2 学习笔记20 类型转换part2 写自己的转换器

    之前说的是调用Struts2的默认转换器,现在我们来说以下写自己的转换器,这个一般不常用,在访问不是自己写的类中可能用到.我们一点点来,因为写自己的转换器需要注意的东西还是很多的. 我们还是用之前的项 ...

  9. Python BeautifulSoup4 使用指南

    前言: 昨天把传说中的BeautifulSoup4装上了,还没有装好的童鞋,请看本人的上一篇博客: Python3 Win7安装 BeautifulSoup,依照里面简单的步骤就能够把Beautifu ...

  10. Jquery 遍历数组之$().each方法与$.each()方法介绍

    $().each() 对于这个方法,在dom处理上用的比较多,如果一个html页面上面有多个checkbox,这时用$().each来处理checkbox是比较不错的; $("input[t ...