this、apply、call的指向
1、关于this
this它总是返回一个对象,是指调用当前函数的对象,由于对象的属性可以赋给另一个对象,所以属性所在的当前对象是可变的,即this
的指向是可变的。
- var person={
- name:"张三",
- getName:function () {
- return "姓名"+this.name
- }
- }
- var person2={
- name:"李四"
- };
- person2.getName=person.getName;
- console.log(person.getName()) //姓名张三
- console.log(person2.getName()) //姓名李四
在上面代码中person中的getName属性被赋给person2对象,此时person2.getName()指向的就是person2对象,所以this.name指向的就是person2的name属性。
this的实质
JavaScript 语言之所以有 this 的设计,跟内存里面的数据结构有关系。
- var person2={
- name:"李四"
- };
上面代码将一个对象赋值给一个变量,首先JavaScript 引擎会先在内存里面,生成一个对象{ name: "李四" }
,然后把这个对象的内存地址赋值给变量person2,也就是说,变量person2是一个地址(reference)。后面如果要读取person2.name
,引擎先从person2拿到内存地址,然后再从该地址读出原始的对象,返回它的name
属性。
原始的对象以字典结构保存,每一个属性名都对应一个属性描述对象。举例来说,上面例子的foo
属性,实际上是以下面的形式保存的。
- {
- foo: {
- [[value]]: '李四'
- [[writable]]: true
- [[enumerable]]: true
- [[configurable]]: true
- }
- }
name的值保存在属性描述对象的value
属性里面。
如果属性值是一个函数会是什么样子
- var obj={
- f:function () {
- }
- }
引擎会将函数单独保存在内存中,然后再将函数的地址赋值给f属性的value
属性。
- {
- f: {
- [[value]]: 函数的地址
- ...
- }
- }
重点就是这个,因为函数是单独保存的,所以不同的执行环境会有不同的上下文。由于函数可以在不同的运行环境执行,所以需要有一种机制,能够在函数体内部获得当前的运行环境(context)。所以,this
就出现了,它的设计目的就是在函数体内部,指代函数当前的运行环境。
this使用场景
- 全局环境,全局环境游览器环境下使用
this
,它指的就是顶层对象window,node环境下就是global了
。
- function test() {
- console.log(this==window) //true
- }
- test()
2、构造函数
构造函数内this指向的是生成的实例对象
- function test(name) {
- this.name=name;
- }
- var test2=new test("张三");
- console.log(test2.name) //张三
通过new命令生成的test2实例对象,由于this
指向实例对象,所以在构造函数内部定义this.name
,就相当于定义实例对象有一个name属性。
3、对象的方法
· 如果对象里面方法包括this,this指向的就是该方法运行时所处的对象,该方法赋值给另一个对象,就会改变this
的指向。具体代码见第一个实例代码。
绑定this
this
的动态切换,固然为 JavaScript 创造了巨大的灵活性,但也使得编程变得困难和模糊。有时,需要把this
固定下来,避免出现意想不到的情况。JavaScript 提供了call
、apply
、bind
这三个方法,来切换/固定this
的指向。
Function.prototype.call()
函数实例的call
方法,可以指定函数内部this
的指向(即函数执行时所在的作用域),然后在所指定的作用域中,调用该函数。
var test="tony";
function doSomething(){
alert(this.test);//tony
alert(window.test);//tony
}
doSomething();
doSomething在全局调用,相当于window.doSomething();所以里面的this指向window对象,this.test=window.test="tony";
this、apply、call的指向的更多相关文章
- this的指向问题、bind/call/apply改变this指向
this的指向问题 全局作用域下的this指向 无论是否是严格模式,全局作用域下的this始终指向window 函数内部的this 严格模式下: function test() { 'use stri ...
- call()与apply() 改变this指向
p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 15.0px Consolas; color: #a5b2b9 } span.Apple-tab-span ...
- call/apply以及this指向的理解
javascript是面向对象的语言,Function也是一种对象,有自己的属性和方法.call和apply就是js函数自带方法,挂在Fucntion.prototype上. 一般调用某函数时,直接“ ...
- call , apply的this指向实现原理并自己实现封装
实现this指向原理 var value = 'value' var obj = { value: 'obj' } function func() { console.log(this.value) ...
- JS中this的指向问题&使用call或apply模拟new
this的指向由调用时决定而不是定义时决定,定义的方式: //直接定义在函数里 var a="window中的a"; var name="window"; fu ...
- js中更改this指向 以及回顾bind、call和apply
1.更改this指向 方法1:对this进行保存 var _this = this; 例: var _this = this; document.onclick = fu ...
- js中的this和apply
this是js的一个关键字,随着函数使用场合不同,this的值会发生变化.但是总有一个原则,那就是this指的是调用函数的那个对象. 1.纯粹函数调用. function test() { this. ...
- Js中call apply函数以及this用法
this介绍: C#里this关键字的意义比较确定的.JavaScript的this关键字,随着函数使用场合不同,this的值会发生变化,感觉用法比较混乱,所以,现在是有必要整理一下的时刻了! 总结一 ...
- 关于 this对象 指向问题
this 定义:this是包含它的函数作为方法被调用时所属的对象.(1,this所在的函数.2,此函数作为方法被调用.3,this等于调用此函数的对象) this 对象在运行时基于函数的执行环境绑定的 ...
- 数组去重,call、apply、bind之间的区别,this用法总结
一.数组去重,直接写到Array原型链上. //该方法只能去除相同的数字 不会去判断24和'24'是不同的 所有数字和字符串数字是相同是重复的 Array.prototype.redup=functi ...
随机推荐
- leetcode 169. Majority Element 多数投票算法(Boyer-Moore Majority Vote algorithm)
题目: Given an array of size n, find the majority element. The majority element is the element that ap ...
- animation-delay负值
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- MySQL_活动期间单笔订单最高的且满600元 判别是重激活客户还是10月注册客户_20161031
将29号和30号两个需求放到一个表当中 首先都满足在10.29到31号之间单笔订单最高的且满600元 数据结构为一个用户一个订单ID 一行一行的 上面是第一个表 我们当做主表 a 第二个表 我们找注册 ...
- 洛谷 P4721 [模板]分治FFT —— 分治FFT / 多项式求逆
题目:https://www.luogu.org/problemnew/show/P4721 分治做法,考虑左边对右边的贡献即可: 注意最大用到的 a 的项也不过是 a[r-l] ,所以 NTT 可以 ...
- [poj2955/nyoj15]括号匹配(区间dp)
解题关键:了解转移方程即可. 转移方程:$dp[l][r] = dp[l + 1][r - 1] + 2$ 若该区间左右端点成功匹配.然后对区间内的子区间取max即可. nyoj15:求需要添加的最少 ...
- 如何解决WAMP Server 与IIS端口冲突问题
PHP也是一门开发网页的语言,WAMP Server 是它的一个较好的集成开发环境,今日,小编发现好多Wamp Server 安装后启动local host 出现的却是IIS页面!为什么会这样呢? 出 ...
- 使用军哥的lnmp配置虚拟主机,需要注意的是要配置hosts文件
#使用军哥的lnmp配置虚拟主机,需要注意的是要配置hosts文件(这一点官方没有讲到)具体方法:1.修改hosts文件sudo vim /etc/hosts 2.在hosts文件中新增一行(这里类似 ...
- MFC——4个基本类中的成员函数介绍
09121852 杜军 机械设计及理论 1. CMainFrame ActivateFrame使框架对用户可视并可用 CalcWindowRect每当主框架窗口的客户区尺寸发生变化或控制条的位置发生变 ...
- 牛客多校2 D-money(dp记录/贪心)
D-money 链接:https://www.nowcoder.com/acm/contest/140/D来源:牛客网 时间限制:C/C++ 1秒,其他语言2秒 空间限制:C/C++ 131072K, ...
- DIV文字水平垂直居中的方法
水平居中 text-align:center 垂直居中(vertical-align) vertical-align:middle; vertical-align时而没效果 然而真实使用的时候,我们会 ...