JS匿名函数内部this指向问题详析


Posted in Javascript onMay 10, 2019

前言

网上看到一句话,匿名函数的执行是具有全局性的,那怎么具有的全局性呢?

this的指向在函数定义的时候是确定不了的,只有函数执行的时候才能确定this到底指向谁,实际上this的最终指向的是那个调用它的对象

1.案例中,第一个say打出来的是Alan,而第二个则是window

var name = 'window'
 var person = {
 name :'Alan',
 sayOne:function () {
  console.log(this.name)
 },
 sayTwo:function () {
  return function () {
  console.log(this.name)
  }
 }
 }
 person.sayOne()//Alan
 person.sayTwo()() // window

2.原因

  1. 函数内部的this指向调用者
  2. sayOne调用者是person对象,所以this指向person;
  3. sayTwo的调用者虽然也是person对象,但是区别在于这次调用并没有打出this而是在全局返回了一个匿名函数
  4. 而这个匿名函数不是作为某个对象的方法来调用执行,是在全局执行

3.我们也可以更改this指向,这里应用JS高级编程的案例

var name = "global";

var foo = {
 name: "foo",
 getName : function(){
 console.log(this.name);
 }
}

var bar = {
 name: "bar",
 getName : function(){
 return (function(){
  console.log(this.name);
 })();
 }
}

foo.getName(); //foo
foo.getName.call(bar); //bar
foo.getName.call(this); //global
foo.getName.call(window); //global

(function(){

 console.log(this.name)

}.bind(bar))(); //bar

(function(){

 console.log(this.name)

}.bind())(); //global

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
广告显示判断
Aug 31 Javascript
Jquery Ajax学习实例5 向WebService发出请求,返回泛型集合数据的异步调用
Mar 17 Javascript
计算新浪Weibo消息长度(还可以输入119字)
Jul 02 Javascript
php跨域调用json的例子
Nov 13 Javascript
上传图片预览JS脚本 Input file图片预览的实现示例
Oct 23 Javascript
JavaScript对象属性检查、增加、删除、访问操作实例
Jul 08 Javascript
javascript控制图片播放的实现代码
Jul 29 Javascript
Vue生命周期示例详解
Apr 12 Javascript
vue中使用axios post上传头像/图片并实时显示到页面的方法
Sep 27 Javascript
vue实现的双向数据绑定操作示例
Dec 04 Javascript
IE11下CKEditor在Bootstrap Modal中下拉问题的解决
Sep 25 Javascript
js实现单元格拖拽效果
Feb 10 Javascript
详解关于React-Router4.0跳转不置顶解决方案
May 10 #Javascript
Vue使用watch监听一个对象中的属性的实现方法
May 10 #Javascript
微信小程序获取用户信息并保存登录状态详解
May 10 #Javascript
jsonp实现百度下拉框功能的方法分析
May 10 #Javascript
微信小程序用户授权,以及判断登录是否过期的方法
May 10 #Javascript
利用es6 new.target来对模拟抽象类的方法
May 10 #Javascript
Angular4.0动画操作实例详解
May 10 #Javascript
You might like
PHP 巧用数组降低程序的时间复杂度
2010/01/01 PHP
php一些错误处理的方法与技巧总结
2013/08/10 PHP
PHP加密函数 Javascript/Js 解密函数
2013/09/23 PHP
php用户注册页面利用js进行表单验证具体实例
2013/10/17 PHP
Codeigniter检测表单post数据的方法
2015/03/21 PHP
php中使用websocket详解
2016/09/23 PHP
thinkPHP5.0框架简单配置作用域的方法
2017/03/17 PHP
jQuery之网页换肤实现代码
2011/04/30 Javascript
13 个JavaScript 性能提升技巧分享
2012/07/26 Javascript
百度地图api应用标注地理位置信息(js版)
2013/02/01 Javascript
小米公司JavaScript面试题
2014/12/29 Javascript
Javascript中数组方法汇总(推荐)
2015/04/01 Javascript
js中for in语句的用法讲解
2015/04/24 Javascript
jquery中关于bind()方法的使用技巧分享
2017/03/30 jQuery
Webpack常见静态资源处理-模块加载器(Loaders)+ExtractTextPlugin插件
2017/06/29 Javascript
nodejs图片处理工具gm用法小结
2018/12/12 NodeJs
vue组件库的在线主题编辑器的实现思路
2020/04/03 Javascript
js+cavans实现图片滑块验证
2020/09/29 Javascript
解决vue项目打包上服务器显示404错误,本地没出错的问题
2020/11/03 Javascript
Python实现大文件排序的方法
2015/07/10 Python
python中OrderedDict的使用方法详解
2017/05/05 Python
python 判断是否为正小数和正整数的实例
2017/07/23 Python
Diango + uwsgi + nginx项目部署的全过程(可外网访问)
2018/04/22 Python
用Python获取摄像头并实时控制人脸的实现示例
2019/07/11 Python
在django view中给form传入参数的例子
2019/07/19 Python
Django视图扩展类知识点详解
2019/10/25 Python
Pandas-Cookbook 时间戳处理方式
2019/12/07 Python
Python模块 _winreg操作注册表
2020/02/05 Python
英国受欢迎的运动鞋和街头服装商店:Footasylum
2018/06/12 全球购物
团员个人的自我评价
2013/12/02 职场文书
煤矿机修工岗位职责
2014/02/07 职场文书
优秀学生获奖感言
2014/02/15 职场文书
教你利用python实现企业微信发送消息
2021/05/23 Python
苹果电脑mac os中货币符号快捷输入
2022/02/17 杂记
Nginx虚拟主机的配置步骤过程全解
2022/03/31 Servers
TV动画《八十龟酱观察日记》第四季宣传PV公布
2022/04/06 日漫