显式绑定法 apply/call(); 通过显式绑定法可以使用另一个对象中的方法

  • apply/call()都是JS预定义的方法, 他们都可以用于将一个对象作为参数调用对象方法
  • FOR example
const person1 = {
nameFunction: function() {
return this.name + this.sex + this.age + '岁';
},
};
const person2 = {
age: 20,
sex: '女',
name: 'Alone'
};
person1.nameFunction.call(person2);// 把函数nameFunction的this指向替换成person2;

call(); 除了可以把对象当参数传过去外, 还能带其他的参数, 形式call(Obj, ...arr);

  • 使用方法
const personClass = {
name: 'Steve Jobs',
age: 65,
sex: '男',
};
const personFun = {
SpeakFunc: function(a,b,c) {
return `姓名${this.name},性别${this.sex},${this.age}岁,${a+b+c}`
}
};
personFun.SpeakFunc.call(personClass, '爱好', 'Mac', '电脑');
const hello = 'hello';
const Mac = 'Mac';
const Yo = 'Yo';
personFun.SpeakFunc.call(personClass, {hello}, {Mac}, {Yo});

apply()

  • 基本和call()一样, 区别传参形式不一样, call()分别接收参数, apply()接收数组参数;
  • 实用方法example: Math.max('1','2','3'); => 分别接收参数,如果是一个数组需要取最大值那么用apply
  • Math.max.apply(null, [1,3,4,5,6]); => 6;
  • 使用方法
const person = {
interest: '玩球',
color: 'black',
house: '太空站',
sex: '男'
};
const interest = '唱歌',
color = 'blue',
house = '火星',
sex = '女';
let personFun = {
interest: '唱歌',
color: 'blue',
house: '火星',
sex: '女',
example: (a, b, c) => {
// 箭头函数this的指向始终表示定义箭头函数的对象=>window or '其他'
return `这个${this.sex}人在${this.house}${this.interest}${a}${b}${c}`
}
};
personFun.example.apply(person, ['好玩','bu','好玩']);
//'这个undefined人在undefinedundefined好玩bu好玩'
// Remark对像函数里面不能写箭头函数
// 改成
let personFun = {
example: function(a, b, c){
return `这个${this.sex}人在${this.house}${this.interest}${a}${b}${c}`
}
};

对象中的apply&call的更多相关文章

  1. JavaScript中的apply,call与this的纠缠

    1.apply定义 apply:调用函数,并用指定对象替换函数的 this 值,同时用指定数组替换函数的参数. 语法:apply([thisObj[,argArray]]) thisObj 可选.要用 ...

  2. JavaScript中的apply和call函数详解(转)

    每个JavaScript函数都会有很多附属的(attached)方法,包括toString().call()以及apply().听起来,你是否会感到奇怪,一个函数可能会有属于它自己的方法,但是记住,J ...

  3. 011-Scala中的apply实战详解

    011-Scala中的apply实战详解 object中的apply方法 class中的apply方法 使用方法 apply方法可以应用在类或者Object对象中 class类 必须要创建实例化的类对 ...

  4. js中的apply调用

    今天看了阮一锋老师的一篇文章,感觉很明了对闭包的理解,尤其是文章中的apply的介绍 apply()是函数对象的一个方法,它的作用是改变函数的调用对象,它的第一个参数就表示改变后的调用这个函数的对象. ...

  5. JS中的apply,call,bind深入理解

    在Javascript中,Function是一种对象.Function对象中的this指向决定于函数被调用的方式.使用apply,call 与 bind 均可以改变函数对象中this的指向,在说区别之 ...

  6. JavaScript中的apply和call函数详解

    本文是翻译Function.apply and Function.call in JavaScript,希望对大家有所帮助 转自“http://www.jb51.net/article/52416.h ...

  7. javascript中bind,apply,call的相同和不同之处

    javasctipt中bind,apply,call的相同点是: 1,都是用来改变this的指向; 2,都可以通过后续参数进行传参; 3,第一个参数都是指定this要指向的对象; 不同点: 1,调用方 ...

  8. 深入理解js中的apply、call、bind

    概述 js中的apply,call都是为了改变某个函数运行时的上下文环境而存在的,即改变函数内部的this指向. apply() apply 方法传入两个参数:一个是作为函数上下文的对象,另外一个是作 ...

  9. javascript 中的apply()和call()方法详解

    1.语法 先来看看JS手册中对call的解释: call 方法 调用一个对象的一个方法,以另一个对象替换当前对象. call([thisObj[,arg1[, arg2[, [,.argN]]]]]) ...

随机推荐

  1. Redis哨兵模式高可用解决方案

    一.序言 Redis高可用有两种模式:哨兵模式和集群模式,本文基于哨兵模式搭建一主两从三哨兵Redis高可用服务. 1.目标与收获 一主两从三哨兵Redis服务,基本能够满足中小型项目的高可用要求,使 ...

  2. UIView与核心动画对比?

    1.UIView和核心动画区别?        核心动画只能添加到CALayer        核心动画一切都是假象,并不会改变真实的值.             2.什么时候使用UIView的动画? ...

  3. Ubuntu好用的文本编辑器-SciTE Text Editor

    Ubuntu下除了gedit之外,还可以使用SciTE编辑器,非常方便,安装 sudo apt install scite 不过刚刚装好在中文环境下还是不能够用的,因为会有中文乱码,还有很多设置也不符 ...

  4. 安装Varnish 及遇到的坑

      转自:http://ixdba.blog.51cto.com/2895551/682555   一.安装Varnish Varnish的安装非常简单,下面逐步介绍: 1.安装前的准备  Varni ...

  5. byte溢出栗子

    原创:转载需注明原创地址 https://www.cnblogs.com/fanerwei222/p/11634402.html byte溢出测试: byte b1 = (byte) 127; byt ...

  6. HMS Core助力宝宝巴士为全球开发者展现高品质儿童数字内容

    本文分享于HMS Core开发者论坛<宝宝巴士携HMS Core为全球家庭用户提供优质儿童数字内容>采访稿整理 宝宝巴士是国内有着十多年出海经验的开发者,其旗下有超过200多款儿童益智互动 ...

  7. 6、架构--Nginx虚拟主机(基于多ip、端口、域名方式)、日志配置、Nginx模块(访问控制模块、状态监控模块、访问链接控制模块)

    笔记 1.晨考 2.昨日问题 3.今日内容 1.Nginx虚拟主机 - 基于多IP的方式 - 基于多端口的方式 - 基于多域名的方式 2.日志配置 Nginx有非常灵活的日志记录模式,每个级别的配置可 ...

  8. CentOS8系统上Zookeeper安装启动

    下载Zookeeper安装包,下载地址为:https://zookeeper.apache.org/releases.html.注意选择bin的gz包,否则安装不成功,提示找不到相应的类. 一.单机模 ...

  9. MyBatis功能点一:二级缓存cache

    对于Mybatis缓存分作用域等维度区别一.二级缓存特点如下图: 分析缓存源码首先得找到缓存操作的入口:前面已经分析,sqlsesion.close()仅对一级缓存有影响,而update等对一/二级缓 ...

  10. html页面预览pdf文件使用插件pdfh5.js

    html预览pdf文件需要依赖pdf.js 移动端适配需要pdfh5.js 记录移动端适配pdfh5.js的用发 在线预览: https://www.gjtool.cn/pdfh5/pdf.html? ...