新手理解 apply 和 call

栏目: JavaScript · 发布时间: 5年前

内容简介:本文仅适合新手, 我是说很新的那种, 旨在和大家共同了解js的call和apply方法. 笔者水平有限, 文中不免会有疏漏, 大神请轻喷.apply 和 call 都是 JS 函数对象的原型方法, 因此我们可以在任何的函数调用这两个方法, 主要作用就是使得对象能够借用到本来不属于他的方法(就是对象的本领). 有点懵逼是不是? 下边我们来举个栗子.假设我们有一只喵星人:

本文仅适合新手, 我是说很新的那种, 旨在和大家共同了解js的call和apply方法. 笔者水平有限, 文中不免会有疏漏, 大神请轻喷.

新手理解 apply 和 call

开始说正事

apply 和 call 都是 JS 函数对象的原型方法, 因此我们可以在任何的函数调用这两个方法, 主要作用就是使得对象能够借用到本来不属于他的方法(就是对象的本领). 有点懵逼是不是? 下边我们来举个栗子.

新手理解 apply 和 call

狗急跳墙

假设我们有一只喵星人:

const cat = {
    // 它的名字叫 cat
    name: 'cat',
    // 它可以跑
    run() {
        console.log(`${this.name} can run`)
    },
    // 还可以跳(包括跳墙是可以的)
    jump() {
        console.log(`${this.name} can jump`)
    }
}
复制代码

同时, 它还有一个小伙伴汪星人:

const dog = {
    // 汪星人叫 dog
    name: 'dog',
    // 会跑
    run() {
        console.log(`${this.name} can run`)
    },
    // 还会吠
    bark() {
        console.log(`${this.name} bark loudly`)
    },
    // 马戏团的:dog:, 还会做算数
    count(a, b) {
        console.log(`${a} + ${b} = ${a + b}`)
    }
}
复制代码

不难发现, 猫狗各有所长. 猫咪可以跳墙, 但是 :dog::dog: 可以吠叫. 假如, 现在的情况提别紧急, 紧急到了什么地步呢. 大家都要到墙头上才能保证安全. 这个时候猫咪直接

cat.jump()
复制代码
新手理解 apply 和 call

成功翻上墙头.

然而, 现在 :dog::dog: 就尴尬了. 跳上墙头??? 不会

新手理解 apply 和 call

就一个 bark() 喊半天也没有用呀!!!

这个时候 apply 就派上用场了. 我们执行

cat.jump.apply(dog)
复制代码
新手理解 apply 和 call
:dog::dog: 也顺利脱险啦. 跳上了墙头, 狗狗欢快的 bark()

这时候猫咪不乐意了, 它也想吠叫, 但是没有这个本领. 这时候:dog::dog:也大方的借出了自己的 bark 本领给了猫咪.

dog.bark.apply(cat)
复制代码
新手理解 apply 和 call

两只小可爱欢快的在墙头上叫起来 ^_^.

apply方法的原理

apply方法可以当作是一种方法的借调: 也就是说把某个方法引用到不包含它的某个对象上. 方法(函数)是用来被对象调用才能够执行的, 而apply恰恰指向了调用当前方法的对象. 初学者可能会误认为apply是对向继承了之前引用的方法. 然而, 这里不太建议这样理解. 我们可以再次利用狗狗对象调用jump方法, 得到的结果如下图所示:

新手理解 apply 和 call

狗狗, 并没有学会 jump 的本领, 它只是在紧急时刻借用了猫咪的跳墙方法.

需要参数

我们知道我们的 :dog::dog: 来自马戏团, 具备了算数的能力. 不信试试?

dog.count(1, 2)
复制代码
新手理解 apply 和 call

简直了不得, 有木有? 然而, 喵星人现在也想要去马戏团. 可是它不会算数, 就需要从汪星人那里借来 count 本领. 那么就尴尬了.

新手理解 apply 和 call

既然要算加法, 就需要把两个加数给人家嘛. 怎么给呢? 只需要把 count 方法需要的参数拼接到一个数组里就可以啦. 就像酱紫.

新手理解 apply 和 call

以上所述就是小编给大家介绍的《新手理解 apply 和 call》,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对 码农网 的支持!

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

网络心理学

网络心理学

玛丽•艾肯 (Mary Aiken) / 中信出版社 / 2018-8-1 / CNY 58.00

《五十度灰》如何利用恋物心理,成为全球仅次于《圣经》的畅销读物? 为什么相对于亲朋好友,你更愿意向网络陌生人敞开心扉? 上网时总感觉时间飞逝,原来是网络的时间扭曲效应? 网络游戏中埋伏了哪些“上瘾”机关,暗中操控着你的行为? 为什么科技越发达,我们就越怕死? ...... 网络空间是一个巨大的兔子洞,里面集合了新奇、刺激、喜悦、痛苦、不安等各种元素。在日复一日的......一起来看看 《网络心理学》 这本书的介绍吧!

JSON 在线解析
JSON 在线解析

在线 JSON 格式化工具

图片转BASE64编码
图片转BASE64编码

在线图片转Base64编码工具

html转js在线工具
html转js在线工具

html转js在线工具