javascript中this值的引用
2019独角兽企业重金招聘Python工程师标准>>>
严格模式下
1.全局作用域指向当前Window
2.函数内部的this,运行在全局作用域下,this值为undefined
3.立即执行函数的 this值为undefined
"use strict"var sb='sb';//全局作用下的thisconsole.log(this);//Windowfunction sayHello(){console.log('function');//console.log(this);//undefined}//运行在全局作用域下的函数sayHello();//匿名立即执行函数(function(){console.log('anonymous');console.log(this);//undefined})();
在非严格模式下
在该模式下**this** 引用总是指向一个值,该值总是指向持有**this**的 **Funtion或者Object **所运行的作用域
var firstName="Peter",lastName='Ally';function showFullName(){//持有this的Funtion showFullName运行在全局作用域下,所以this指向Window//输出PeterAllyconsole.log(this.firstName+""+this.lastName);} showFullName(); var person={firstName:"Penelope",lastName:'Barrymore',showFullName:function(){//持有this的Funtion showFullName运行在person作用域下,所以this指向person//输出PenelopeBarrymoreconsole.log(this.firstName+""+this.lastName);}}person.showFullName();
一些特殊情况
1.我们可以利用**Bind ()**, Apply (), **Call ()重新指定this**引用
var person={firstName:"Penelope",lastName:'Barrymore',showFullName:function(){//持有this的Funtion showFullName运行在person作用域下,所以this指向person//输出PenelopeBarrymoreconsole.log(this.firstName+""+this.lastName);}}//person.showFullName();var anotherPerson={firstName:'Rohit',lastName:'Khan'}//重新指定this为anotherPerson//输出为RohitKhanperson.showFullName.apply(anotherPerson);
2.回调函数中的**this**
var user={data:[{name:"T.Woods",age:37},{name:"P. Mickelson",age:43}],clickHandler:function(event){var randomNum = ((Math.random () * 2 | 0) + 1) - 1; // random number between 0 and 1console.log (this.data[randomNum].name + " " + this.data[randomNum].age);}}$ ("button").click (user.clickHandler);
**button的click事件击发的时候this并不能访问到 user的属性data,因为此时的this**引用的是 **$ ("button")**对象
修正如下:
$("button").click (user.clickHandler.bind (user));
3.闭包
var user={tournament:"The Masters",data:[{name:"T.Woods",age:37},{name:"P. Mickelson",age:43}],clickHandler:function(event){this.data.forEach(function(person){//这是一个内部函数this不再指向user//this只能被Function,Object自身访问console.log ("What is This referring to? " + this); //[objectWindow]console.log (person.name + " is playing at " + this.tournament);// T. Woods is playing at undefined// P. Mickelson is playing at undefined})}}user.clickHandler();
修正如下:
clickHandler:function(event){var theUserObj = this;this.data.forEach(function(person){//这是一个内部函数this不再指向user//this只能被Function,Object自身访问console.log ("What is This referring to? " + this); //[objectWindow]console.log (person.name + " is playing at " + theUserObj.tournament);// T. Woods is playing at undefined// P. Mickelson is playing at undefined})}
在外部函数中定义一个变量保存**this,在闭包中通过访问这个变量访问外部的this**
4.将方法赋值给变量
var data=[{name:"Samantha",age:12},{name:"Alexis",age:14}];var user={tournament:"The Masters",data:[{name:"T.Woods",age:37},{name:"P. Mickelson",age:43}],showData:function(event){var randomNum = ((Math.random () * 2 | 0) + 1) - 1;// random number between 0 and 1console.log (this.data[randomNum].name + " " + this.data[randomNum].age);}}var showUserData = user.showData;showUserData (); // Samantha 12 (from the global data array)
最终输出的数据为全局变量中**data**的数据
修正如下:
var showUserData = user.showData.bind (user);
转载于:https://my.oschina.net/u/3238650/blog/1533682
javascript中this值的引用相关推荐
- 你真的了解C#中的值和引用吗?(上)
术语解释 在阅读本文之前,你需要了解以下这几个术语是不同的:值.引用.值类型.引用类型. C#中有三种值(value),分别是值类型实例的值.引用类型实例的值和引用. 值类型表达式的值是数据本身. 引 ...
- java中是值传递引用传递_Java是按值传递而不是按引用传递
java中是值传递引用传递 One of the biggest confusion in Java programming language is whether java is Pass by V ...
- 回归本源:JavaScript 之中的值和引用
阅读花费时间:2分钟 这是一个非常简短的值和引用的解释. 首先,对于每一个JavaScript开发者来说,值(value)和引用(reference)的定义,一般是从一些bug被引出的,而且在面试中也 ...
- JavaScript检测原始值、引用值、属性
上周写过一篇读书笔记<编写可维护的JavaScript>之编程实践,其中 第8章 避免『空比较』是博主在工作中遇坑较多的雷区,所以特此把该章节重新整理分享,希望大家不再坑队友(>﹏& ...
- JavaScript中基本数据类型和引用数据类型的区别
1.基本数据类型和引用数据类型 ECMAScript包括两个不同类型的值:基本数据类型和引用数据类型. 基本数据类型指的是简单的数据段,引用数据类型指的是有多个值构成的对象. 当我们把变量赋值给一个变 ...
- python引用传递产生的问题_理解Python中传递值和引用时出现问题
我可以看到三个基本的Python概念,它们可以为这个问题提供一些启示: 1)首先,来自可变对象的赋值,如self.foo = arg1 就像复制指针(而不是所指向的值):self.foo和{}是相同的 ...
- JavaScript中变量的相互引用
http://www.jb51.net/article/23387.htm 转载于:https://www.cnblogs.com/chris-oil/p/3402072.html
- 原始值和引用值类型及区别
javascript中原始值和引用值类型及区别 首先原始值和引用值类型都是我们JS中的数据类型,为了充分利用存储空间,定义了不同的数据类型,而且我们JS是弱类型,动态语言,数据类型可变. 原始值(简单 ...
- java引用类型和值类型_[Java教程]JavaScript中值类型和引用类型的区别
[Java教程]JavaScript中值类型和引用类型的区别 0 2017-02-24 00:00:35 JavaScript的数据类型分为两类:原始类型和对象类型.其中,原始类型包括:数字.字符串和 ...
最新文章
- JavaScript语言基础3
- 在.NET中获取一台电脑名,IP地址及当前用户名
- 点一万个赞:商汤SiamRPN目标跟踪最强算法开源
- 牛津大学最新调研:AI面临基准危机,NLP集中“攻关”推理测试
- MySQL 连接报错:mysql access denied for user@ip
- 安装TFS2010实际体验
- 读《scikiit-learn机器学习》黄永昌第四章
- Layui动态修改列名
- BT种子文件(.torrent)的具体文件结构
- 均匀量化(Matlab)
- “Chart“ 图表控件基本操作
- 非模式物种ROSE超级增强子鉴定分析详解
- 机器学习实战-65:主成因分析降维算法(Principal Component Analysis)
- 清除新版Google Chrome浏览器中表单控件(input,button...)默认的黑色边框
- Mac地址多少位(48位的(6个字节)) IP多少位
- 详解HTML的相对路径写法
- 表单提交-form提交和ajax提交
- 逻辑运算是计算机实现计算器基础,第1章__计算机的发展与运算基础.ppt
- 阿里云 RAM 企业上云实战
- android 12 源码编译与虚拟机调试