当前位置: 首页 > news >正文

JavaScript的函数中this的指向

JavaScript的函数中this的指向

JavaScript 语言之所以有 this 的设计,跟内存里面的数据结构有关系。

以下例子来简单描述this在不同情况下所指向的对象。

var obj = {aa: function(){console.log(this.num)},num: 5
};var aa = obj.aa;
var num = 10;obj.aa();  // 5
aa();  // 10

对于以上代码,obj.aa和aa都是指向同一个函数,但其执行输出的结果却是大不相同,其原因是他们所指向的函数在内存中是独立保存的。

var obj = {aa: 20};

上面代码所展示的是将一个对象aa的地址丢给了obj,也就是说obj指向的是aa,通过obj拿到内存地址,读取aa对象,返回aa的属性,而aa属性中的值为20。

在这里插入图片描述

注意:aa属性的值保存在aa对象的value属性里面。

而如果value属性中所存的不是固定的数值,而是一个函数,则存的是函数的地址(因为函数在内存中是另外的独立存在)。

在这里插入图片描述

var obj = {aa: function(){console.log(this.num)},num: 5
};obj.aa();  // 5

对于aa的value属性中存在函数的地址,则在aa中所调用的函数所属的环境存在于obj中,即function中this所指向为obj。

在这里插入图片描述

在上面代码所指向的this是obj本身,this.num所输出的值就是obj中num的value属性所带的值。

var obj = {aa: function(){console.log(this.num)},num: 5
};var aa = obj.aa;
var num = 10;obj.aa();  // 5
aa();  // 10

对于obj.aa();调用的函数指向情况和aa();调用的函数指向情况有所不同,obj.aa和上面所阐述的一样,相当于将函数绑定在obj的环境里面。

在这里插入图片描述

而对于var aa = obj.aa;来说,变量aa相当于指向函数本身,即aa是一个与function共同存放在全局环境下的函数。

在这里插入图片描述

相当于现在的window就好比原来的obj,而现在的obj.aa就好比原来的aa,即将obj.aa看成一个整体,是window环境下的对象,value的值为function的地址,与num:10并其在window这个环境下面,此时this指向的不再是obj,而是window,即this.num调用的是window下的num:10。

http://www.lryc.cn/news/97615.html

相关文章:

  • Caddy 中实现自动 HTTPS
  • SK5代理(socks5代理)在网络安全与爬虫应用中的优势与编写指南
  • 【LeetCode-简单】剑指 Offer 06. 从尾到头打印链表(详解)
  • 【LeetCode】114.二叉树展开为链表
  • DAY3,Qt(完成闹钟的实现,定时器事件处理函数的使用)
  • TL-ER3220G设置vlan
  • PHPWord 实现合并多个word文件
  • rust持续学习Box::leak
  • 通过SSH实现将本地端口反向代理到公网服务器
  • Fragment的基本用法、Fragment和活动间的通信、Fragment的生命周期、动态加载布局的技巧
  • 机器学习 day30(正则化参数λ对模型的影响)
  • 图文教程:如何在 3DS Max 中创建3D迷你卡通房屋
  • 根据UIL下载图片/视频、根据URL自动下载图片/视频、GUI自动下载想要的图片
  • HTML <picture> 标签
  • 力扣天天练--week3-LeetCode75
  • 5.2 方法的定义和调用
  • Linux基础以及常用命令
  • echarts 折线图上只显示某一个点值
  • 1、传统锁回顾(Jvm本地锁,MySQL悲观锁、乐观锁)
  • 【Java||牛客】DFS应用迷宫问题
  • 【vue】Vue中class样式的动态绑定
  • 机器学习深度学习——随机梯度下降算法(及其优化)
  • 【MTK平台】【wpa_supplicant】关于wpa_supplicant_8/src/p2p/p2p.c文件的介绍
  • 华为数通HCIP-流量过滤与转发路径控制
  • SpringBoot中定时任务开启多线程避免多任务堵塞
  • 回归预测 | MATLAB实现SO-CNN-BiLSTM蛇群算法优化卷积双向长短期记忆神经网络多输入单输出回归预测
  • 入侵检测——IDS概述、签名技术
  • golang 标准库json Marshal 序列化与反序列化
  • 【【51单片机AD/DA的分析】】
  • 在docker中安装使用达梦数据库