首页 > 其他分享 >谈谈js中this的理解

谈谈js中this的理解

时间:2022-11-09 00:13:02浏览次数:36  
标签:函数 指向 对象 js 谈谈 理解 call apply name

this

一、this的理解
第一准则: this 永远指向函数 运行时 所在的对象,而不是函数被创建时所在的对象【不包含箭头函数】

二、this 的集中指向:

  • window 对象 如: console.log(this);

  • 函数中的 this 函数中的this,谁调用函数,函数中的 this 就指向谁,一般指向 window 如: function foo() { console.log(this); } foo();

  • 对象中的 this ,一般指向对象 如: var obj = { name: "jack", run: function() { console.log(this.name+"run"); } } obj.run();

  • 构造函数中的 this, 指向实例化出来的对象 function Person(name) { this.name = name; // this 指向当前实例化的对象。 }

三、借来的 this (难点)

可以借助一些方法手动修改 this 的指向。

1、fn.call(对象, 参数1, 参数2…) 【将函数的上下文环境切换到另外一个对象中】【参数利用逗号隔开,如"小乔",“一天”】
注意:
该函数会立即执行;
执行一次。

2、fn,apply(对象, [参数1, 参数2…])
用法同 call ,只是传参方式不一样。apply传的是数组

3、 fn.bind(对象)
用于被动修改 this 的指向【一般用于修改回调函数的方法】

小总结:call 、apply 、bind 的区别
相同点: 都是用于改变函数中 this 的指向。

不同点:
call 、apply 都是立即执行(主动),用于一般函数
bind 是被动执行,通常用于回调函数
call 直接将参数举例在对象的后面
apply 是以数组的形式传递参数

标签:函数,指向,对象,js,谈谈,理解,call,apply,name
From: https://www.cnblogs.com/maxiaohu/p/16871761.html

相关文章

  • 数据源开发步骤; 数据源(连接池)的作用; IOC与DI的理解; 怎么把UserDao注入到UserService内
    数据源开发步骤1、导入数据源的坐标和数据库驱动坐标2、创建数据源对象3、设置数据源的基本连接数据4、使用数据源获取连接资源和归还连接资源数据源(连接池)的作用1、提高程......
  • js对象属性继承的方式都有哪些
    对象属性继承原型继承-实现方式:将子类构造函数的原型指向父类构造函数的实例对象+改变了子类构造函数的原型指向实现继承+则子类构造函数实例对象的原型指向......
  • js jsonp
    同源策略(浏览器的一种机制)概述:浏览器为了安全,他产生了一种同源策略,这个策略是为了防止一些恶意的请求,保护对应的隐私.同源策略主要是对应三个内容分别问同协议......
  • JS WEB怎么实现大文件上传
    ​ 文件上传是最古老的互联网操作之一,20多年来几乎没有怎么变化,还是操作麻烦、缺乏交互、用户体验差。一、前端代码英国程序员RemySharp总结了这些新的接口 ,本文在他......
  • java读取word显示在jsp页面上
    在最近的一个项目中需要将一段字符类型的文本存为word,html并要将word的内容保存在数据库中,于是就有了如下的一个工具类,希望能对碰到这样需求的朋友提供点帮助。      ......
  • mysql根据json字段内容作为查询条件(包括json数组)检索数据
    最近用到了mysql5.7的json字段的检索查询,发现挺好用的,记录一下笔记我们有一个日志表,里面的data字段是保存不同对象的json数据,遇到想根据里面的json的字段内容作为条件查询......
  • 我的朋友因为 JSON.stringify 差点丢了奖金
    英文|https://medium.com/frontend-canteen/my-friend-almost-lost-his-year-end-bonus-because-of-json-stringify-9da86961eb9e翻译|杨小爱这是发生在我朋友身上的真......
  • vue slot的一点理解
    先来一个实例,方便解释:子组件:<template><div><button></button><slot>这里是默认值</slot><slotname="one">这里是默认值one</slot><slotname......
  • 快速理解ASP.NET Core的认证与授权
      原文网址:https://blog.csdn.net/helendemeng/article/details/122352963ASP.NETCore的认证与授权已经不是什么新鲜事了,微软官方的文档对于如何在ASP.NETCore中......
  • 6.Json交互处理
    6.Json交互处理1.什么是JsonJSON(JavaScriptObjectNotation,JS对象标记)是一种轻量级的数据交换格式,目前使用特别广泛。采用完全独立于编程语言的文本格式来存储......