从函数调用的角度,探讨JavaScript中this的用法
js函数调用方式大概可分为:函数调用,构造器调用,call或apply,方法调用四种方式。下面结合一些基础概念和实测代码,从函数调用的角度,探讨JavaScript中this的用法。
1. new对函数调用的影响
先看JScript手册中对new和构造函数的解释:


实测:
function Fun1(){
console.log(this);
}
new Fun1();//构造器调用方式
Fun1();//函数调用方式
window.Fun1();

结论:构造器方式this指向函数本身;函数调用方式,this指向全局对象window。Fun1()是window.Fun1()的简写,Fun1()是window的方法。
2.使用call或apply
JScript手册的解释:


实测:
function Fun1(x){
console.log(x,this);
}
function Fun2(x){
console.log(x,this);
}
Fun1.call(window,0);
Fun1.call(Fun2(1),11);
Fun1.call(new Fun2(2),22);
Fun1.apply(window,[3]);

结论:
通过call或apply调用函数,被调用的函数的this指向第一个参数指向的this。
apply和call作用相同,但参数上有区别。apply的第二个参数可以传入一个函数的arguments对象。
3.方法调用模式
调用形式如:对象名.方法名()的函数调用模式。比如实例中的a.f(5)。
实测:(四种调用都在了)
function Fun1(x){
console.log(x,this);
}
function Fun2(x,y){
Fun3.apply(this, arguments);//apply和arguments结合使用
return{ f:Fun1 };
}
function Fun3(x,y){
console.log(x,y,this);
}
var a = Fun2(1,2);
var b = new Fun2(3,4);
a.f(5);
b.f(6);

此例中,函数Fun2返回了一个对象{f:Fun1},所以a,b都指向了该对象,进而Fun1中的this指向对象{f:Fun1}。
结论:方法调用模式下,this指向方法所属的对象。
总结:this指向的对象是在函数调用的时候决定的,通过函数调用方式,可以推断出this。
现在回过头来看一下,在JScript手册中,this语句的解析如下:

嗯,对上面的解释基本没有疑惑。附上手册
从函数调用的角度,探讨JavaScript中this的用法的更多相关文章
- 用自然语言的角度理解JavaScript中的this关键字
转自:http://blog.leapoahead.com/2015/08/31/understanding-js-this-keyword/ 在编写JavaScript应用的时候,我们经常会使用th ...
- JavaScript中return的用法详解
JavaScript中return的用法详解 最近,跟身边学前端的朋友了解,有很多人对函数中的this的用法和指向问题比较模糊,这里写一篇博客跟大家一起探讨一下this的用法和指向性问题. 1定义 t ...
- JavaScript中this的用法详解
JavaScript中this的用法详解 最近,跟身边学前端的朋友了解,有很多人对函数中的this的用法和指向问题比较模糊,这里写一篇博客跟大家一起探讨一下this的用法和指向性问题. 1定义 thi ...
- JavaScript中this的用法 及 如何改变this的指向
要懂得JavaScript中this的用法,首先需要知道,JavaScript中的作用域相关知识. var fun = function(){ var flag = 1; console.log(fl ...
- javascript中 try catch用法
javascript中 try catch用法 投稿:hebedich 字体:[增加 减小] 类型:转载 时间:2015-08-16我要评论 JS try catch语句一般在什么情况下使用?是必须使 ...
- 在HTML页面中实时获取新消息的方法 “JavaScript中的setInterval用法”
JavaScript中的setInterval用法(资料来源:博主---八神吻你 ) setInterval动作的作用是在播放动画的时,每隔一定时间就调用函数,方法或对象.可以使用本动作更新来自数 ...
- 小谈JavaScript中this的用法
"this"关键字是JavaScript中广泛应用的一种特性,但它经常也是这门语言中最容易混淆和误解的特性.那么"this"的实际意义是什么?它是如何求值的? ...
- JavaScript 中 this 的用法
在 JavaScript 中,this 是动态绑定,或称为运行期绑定的.一般而言,在Javascript中,this 指向函数执行时的当前对象. 由于其运行期绑定的特性,JavaScript 中的 t ...
- JavaScript中一些怪异用法的理解
引言 JavaScript这门语言有些场合的用法还是比较怪异的.这篇文章会尽量将这门语言特有的一些比较特殊的用法收集在一起.就当是平时开发时需要注意的地方吧. 特殊用法收集 1.!!用法 在JavaS ...
随机推荐
- 相机标定 和 单应性矩阵H
求解相机参数的过程就称之为相机标定. 1.相机模型中的四个平面坐标系: 1.1图像像素坐标系(u,v) 以像素为单位,是以图像的左上方为原点的图像坐标系: 1.2图像物理坐标系(也叫像平面坐标系)(x ...
- Adaboost 算法的原理与推导——转载及修改完善
<Adaboost算法的原理与推导>一文为他人所写,原文链接: http://blog.csdn.net/v_july_v/article/details/40718799 另外此文大部分 ...
- Codeforces Round #417 (Div. 2)A B C E 模拟 枚举 二分 阶梯博弈
A. Sagheer and Crossroads time limit per test 1 second memory limit per test 256 megabytes input sta ...
- [NOI2010] 能量采集 (数学)
[NOI2010] 能量采集 题目描述 栋栋有一块长方形的地,他在地上种了一种能量植物,这种植物可以采集太阳光的能量.在这些植物采集能量后,栋栋再使用一个能量汇集机器把这些植物采集到的能量汇集到一起. ...
- python基础6--目录结构
为什么要设计好目录结构? "设计项目目录结构",就和"代码编码风格"一样,属于个人风格问题.对于这种风格上的规范,一直都存在两种态度: 一类同学认为,这种个人风 ...
- 最短路+找规律 Samara University ACM ICPC 2016-2017 Quarterfinal Qualification Contest L. Right Build
题目链接:http://codeforces.com/gym/101149/problem/L 题目大意:有n个点(其实是n+1个点,因为编号是0~n),m条有向边.起点是0,到a和b两个节点,所经过 ...
- 816E. Karen and Supermarket 树形DP
LINK 题意:给出n个商品,除第一个商品外,所有商品可以选择使用优惠券,但要求其前驱商品已被购买,问消费k以下能买几个不同的商品 思路:题意很明显就是树形DP.对于一个商品有三种选择,买且使用优惠券 ...
- ZOJ 3964 NIM变形
LINK 题意:n堆石子,Alice 和 Bob 轮流取石子,谁不能再取或被对方取完为败.但是对于alice拥有限制:b=0此堆正常无限制:b=1此堆Alice只能取奇数个石子:b=2只能取偶数个石子 ...
- 拦截asp.net输出流做处理
本文标题是指对已经生成了HTML的页面做一些输出到客户端之前的处理. 方法的原理是:把Response的输出重定向到自定义的容器内,也就是我们的StringBuilder对象里,在HTML所有的向页面 ...
- vue登录/查看/结束端口号
下班时间到啦! --下班都是他们的,而我,还是什么都没有. vue登录(未登录情况下不允许进入) 在路由里加上登录的权限 meta: { requireAuth: true, title: 'Logi ...