从函数调用的角度,探讨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 ...
随机推荐
- bzoj 1053
代码: //本题要求不超过n的因子最多的最小的数,我们知道因子的个数可以有素因子的指数得出,题目限制n是2e9,我们可以排除掉一些情况然后暴力 //对于一个数必然是因子越小他的因子数越多,所以枚举最小 ...
- python基础--文件操作实现全文或单行替换
python修改文件时,使用w模式会将原本的文件清空/覆盖.可以先用读(r)的方式打开,写到内存中,然后再用写(w)的方式打开. 替换文本中的taste 为 tasting Yesterday whe ...
- 使用cron命令配置定时任务(cron jobs)
原文 http://www.cnblogs.com/end/archive/2012/02/21/2361741.html 开机就启动cron进程的设置命令:chkconfig --add crond ...
- c++数组遍历十种方式
int ia[3][4] = {1,2,3,4,5,6,7,8}; //下标 for (int i = 0; i < 3; i++) { for (int j = 0; j < 4 ...
- 分享一个数据库sql_mode 引起的坑
sql_mode坑 MySQL 5.7.x 默认值: ONLY_FULL_GROUP_BY,STRICT_TRANS_TABLES,NO_ZERO_IN_DATE,NO_ZERO_DATE,ERROR ...
- 【BZOJ】2243 [SDOI2011]染色
[算法]树链剖分+线段树 [题解] 树链剖分算法:http://www.cnblogs.com/onioncyc/p/6207462.html 定义线段树结构体有l,r,lc,rc,sum,data. ...
- 源自人脑的神奇算法 -- 读《How to make your own neural network》有感
最近读到了一本很好的关于机器学习-深度学习的书值得推荐下并特意做了这个学习总结. 为什么推荐 在我认为好书(计算机类)的评判有几个标准: 试图以通俗的语言阐述,并在引入任何新概念的时候都讲述来龙去脉, ...
- SDUT 3923
Description snow 是个热爱打字的家伙,每次敲出更快的速度都会让他很开心.现在,他拿到一篇新的打字文章,已知这篇文章只有 26 个小写英文字母,给出 snow 打出这 26 个英文字母分 ...
- 绿色的宠物店cms后台管理系统模板——后台
链接:http://pan.baidu.com/s/1c7qmsA 密码:2es8
- AUC画图与计算
利用sklearn画AUC曲线 from sklearn.metrics import roc_curve labels=[1,1,0,0,1] preds=[0.8,0.7,0.3,0.6,0.5] ...