首页 > 其他分享 >"this"关键字在js中的工作原理

"this"关键字在js中的工作原理

时间:2023-06-19 14:47:09浏览次数:35  
标签:console name person 绑定 js 关键字 sayName 原理 John

在js中,关键字“”this“”用于引用当前执行代码的上下文对象它的工作原理是根据函数的调用方式来确定其绑定的值它的值会根据函数的调用方式而变化。下面解释几种常见的 "this" 绑定规则:

1. 默认绑定:“this”默认绑定到全局对象(在浏览器环境中是window对象,在Node.js中是global对象)

function sayName() {
  console.log(this.name);
}

var name = "John";
sayName(); // 输出:John

2.隐式绑定:当函数作为对象的方法调用时,this绑定到调用该方法的对象。

let person = {
   name:'John',
   sayName:function(){
      console.log(this.name)  
  }    
}
person.sayName()// 输出:John


3.显式绑定:通过call, apply, bind方法可以显示指定函数的执行上下文。

function sayName() {
  console.log(this.name);
}

var person = {
  name: "John"
};

sayName.call(person); // 输出:John

4. new绑定:当使用new关键字创建一个实例对象时,this绑定到新创建的实例对象。

function Person(name) {
  this.name = name;
}

var john = new Person("John");
console.log(john.name); // 输出:John

5.箭头函数:箭头函数没有自己的this绑定,他会继承外层作用域的this值。

var person = {
  name: "John",
  sayName: function() {
    setTimeout(() => {
      console.log(this.name);
    }, 1000);
  }
};

person.sayName(); // 输出:John

 

标签:console,name,person,绑定,js,关键字,sayName,原理,John
From: https://www.cnblogs.com/yaotuo/p/17491057.html

相关文章

  • Turndown 源码分析:四、`turndown.js`
    importCOMMONMARK_RULESfrom'./commonmark-rules'importRulesfrom'./rules'import{extend,trimLeadingNewlines,trimTrailingNewlines}from'./utilities'importRootNodefrom'./root-node'importNodefrom'......
  • vite+vue3项目中使用 lottie 动画,如何在 template 中直接使用本地 json 文件路径
    安装lottie-webyarnaddlottie-web封装 lottie组件<template><divref="animation":style="{width,height}"></div></template><script>import{defineComponent,ref,onMounted}from'vue'......
  • 消防设备监控系统设计原理及其意义
    安科瑞虞佳豪6月13日起,北京市怀柔区一个占地面积超过2000平方米的聚苯乙烯彩钢板建筑启动拆除更换工作,标志着这一影响辖区安全的突出火灾隐患正式销账。自火灾隐患大排查大整治以来,怀柔区消防救援支队按照零增量、消存量的原则,集中开展历史遗留突出隐患的销账工作,根据实际需要......
  • nodejs 伪全局变量模块
    使用这个文件可以实现不同文件中读写变量,适合当做共享变量文件名:globals.tsletglobals:any={myGlobal:{value:'canbeanytype:String,Array,Object,...'},aReadonlyGlobal:{value:'thisvalueisreadonly',protected:......
  • app直播源代码,JS生成随机数,生成指定位数的随机数
    app直播源代码,JS生成随机数,生成指定位数的随机数<html><script> //获取指定位数的随机数 functiongetRandom(num){  letrandom=Math.floor((Math.random()+Math.floor(Math.random()*9+1))*Math.pow(10,num-1)); } //调用随机数函数生成10位数的随机......
  • auto.js自动化手机脚本初始配置
    软件选择:auto.js8.0pro版本(对比4.0版本有阉割,微信支付宝不能点)有两种模式:客户端模式服务器模式auto.js4.0版本有一种模式:客户端模式设备和电脑连接:手机:服务器模式:手机和电脑在同一局域网下相互连接。(手机电脑同wifi远程连接,稳定)客户端模式:电脑连接以太网(不是虚拟机的......
  • JSP连接数据库大全
    JSP连接数据库大全一、jsp连接Oracle8/8i/9i数据库(用thin模式)testoracle.jsp如下:<%@pagecontentType="text/html;charset=gb2312"%><%@pageimport="java.sql.*"%><html><body><%Class.forName(......
  • Three.js教程:动画渲染循环
    推荐:将NSDT场景编辑器加入你的3D工具链其他系列工具:NSDT简石数字孪生动画渲染循环threejs可以借助HTML5的API请求动画帧window.requestAnimationFrame实现动画渲染。请求动画帧window.requestAnimationFrame//requestAnimationFrame实现周期性循环执行//requestAnimationF......
  • 外键要建立索引的原理和实验
    项目中,我们要求凡是有主子关系的表都要使用外键约束,来保证主子表之间关系的正确,不推荐由应用自己控制这种关系。但发现有时开发人员提交SQL语句时未必会注意外键列需要定义索引,或者不清楚为什么外键列需要建立索引,网上一些所谓的“宝典”也会将外键列建索引作为其中的一条,包括TOM大......
  • 关于ASP.NET.CORE中的Failed to read parameter "string param" from the request bod
    先上报错信息Microsoft.AspNetCore.Http.BadHttpRequestException:Failedtoreadparameter"stringparam"fromtherequestbodyasJSON.--->System.Text.Json.JsonException:'s'isaninvalidstartofavalue.Path:$|LineNumber:0|By......