call,apply,bind的理解
call,apply,bind均是用于改变this指向。
三者相似之处:
1:都是用于改变函数的this指向。
2:第一个参数都是this要指向的对象。
3:都可以通过后面的参数进行对方法的传参。
let obj = {
address: '北京',
age: 18
}
let address = '上海'
var age = 20
let fn = function(name,sex){
console.log('address',this.address)
console.log('age',this.age)
console.log('name',name)
console.log('sex',sex)
}
fn()

在图中可以看到只有age是有值的,直接调用fn方法,this默认指向为window。
address因为是let声明出来的变量,会产生一个做个作用域,所以fn同样是取不到address,只可以取到age。
使用call:

apply:

bind:

call跟apply的相同点:改变this指向后会对函数进行调用。
call跟apply的区别:后续参数call是一个一个传入,apply是将所有参数放到一个数组中进行传递。
bind跟apply跟call的不同:改变this指向后,并不会主动度函数进行调用,需要再手动调用函数。
传参方式有两种:1、跟call相同,将后续参数依次传入。
2、在调用时进行参数的传递
注意点:在严格模式下,即“use strict”
function fn() {
console.log(this);
}
fn()// 普通模式下this是window,在严格模式下this是undefined
fn.call(); // 普通模式下this是window,在严格模式下this是undefined
fn.call(null); // 普通模式下this是window,在严格模式下this是null
fn.call(undefined); // 普通模式下this是window,在严格模式下this是undefined
call的实现原理,实现一个自己的call方法。
明确call做了哪些事情。
1.改变了this指向
2.传递了要传递的参数
3.主动调用了方法
Function.prototype.myCall = function(...arg){
let obj = [...arg][0] || window//将this要指向的对象赋值给一个新对象
obj.fn = this//给新对象添加新的属性fn为要改变this指向的方法,实现了this的改变,obj.fn的this指向的便是obj了
let result = obj.fn(...[...arg].slice(1))//实现主动调用,并将参数传递
delete obj.fn//删除fn属性,防止破坏原有对象
return result //若方法有返回值将返回值return出去
}
call的经典例子:
function fn1() {
console.log(1);
}
function fn2() {
console.log(2);
}
fn1.call(fn2); //
fn1.call.call(fn2); //
fn1.call(fn2); 因为并没有涉及到this所以打印的仍然是1
fn1.call.call(fn2)
fn1.call.call(fn2)//将fn1.call看做要被该边this指向的函数,结合自己实现的call函数
function(...arg){
let obj = [...arg][0] || window//将this要指向的对象赋值给一个新对象
obj.fn = this//给新对象添加新的属性fn为要改变this指向的方法,实现了this的改变,obj.fn的this指向的便是obj了
let result = obj.fn(...[...arg].slice(1))//实现主动调用,并将参数传递
delete obj.fn//删除fn属性,防止破坏原有对象
return result //若方法有返回值将返回值return出去
}.call(fn2)//将里面的this改为fn2,可以看到实际执行的就是fn2函数
call,apply,bind的理解的更多相关文章
- call,apply,bind的理解
2020-03-19 call,apply,bind的理解 先说区别call, apply基本上没什么不一样,唯一不一样的地方是传参方式不同 但是bind和call,apply有区别.bind是重新绑 ...
- 理解 JavaScript call()/apply()/bind()
理解 JavaScript this 文章中已经比较全面的分析了 this 在 JavaScript 中的指向问题,用一句话来总结就是:this 的指向一定是在执行时决定的,指向被调用函数的对象.当然 ...
- 学习前端的菜鸡对JS的call,apply,bind的通俗易懂理解
call,apply,bind 在JavaScript中,call.apply和bind是Function对象自带的三个方法,都是为了改变函数体内部 this 的指向. a ...
- call,apply,bind的用法
关于call,apply,bind这三个函数的用法,是学习javascript这门语言无法越过的知识点.下边我就来好好总结一下它们三者各自的用法,及常见的应用场景. 首先看call这个函数,可以理解成 ...
- JavaScript中call,apply,bind方法的总结。
why?call,apply,bind干什么的?为什么要学这个? 一般用来指定this的环境,在没有学之前,通常会有这些问题. var a = { user:"追梦子", fn:f ...
- call(),apply(),bind()与回调
1.call(),apply(),bind()方法 JavaScript 中通过call或者apply用来代替另一个对象调用一个方法,将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定 ...
- javascript-this,call,apply,bind简述2
上节我们一起研究了this这个小兄弟,得出一个结论,this指向调用this所在函数(或作用域)的那个对象或作用域.不太理解的朋友可以看看上节的内容,这次我们主要探讨一下call(),apply(), ...
- call,apply,bind方法的总结
why?call,apply,bind干什么的?为什么要学这个? 一般用来指定this的环境,在没有学之前,通常会有这些问题. var a = { user:"追梦子", fn:f ...
- JavaScript中call,apply,bind方法的总结
原文链接:http://www.cnblogs.com/pssp/p/5215621.html why?call,apply,bind干什么的?为什么要学这个? 一般用来指定this的环境,在没有学之 ...
随机推荐
- 前世今生:Hive、Shark、spark SQL
Hive (http://en.wikipedia.org/wiki/Apache_Hive )(非严格的原文顺序翻译) Apache Hive是一个构建在Hadoop上的数据仓库框架,它提供数据的 ...
- k8s环境部署(一)
环境介绍 1.单masrer节点 (安装下面图中介绍的四个组件) 2.俩个node节点(安装kubelet和docker) 3.为了支持master与node之前的通信,我们还需要在master上安装 ...
- GitHub 访问慢
绕过 DNS 解析,配置 hosts 文件直连. 速度取决与服务器和你所在的网络环境,不一定换了就速度快. DNS 查询网址 https://www.ipaddress.com/ https://to ...
- linux常用20条命令
1.cd命令 这是一个非常基本,也是大家经常需要使用的命令,它用于切换当前目录,它的参数是要切换到的目录的路径,可以是绝对路径,也可以是相对路径.如: cd /root/Docements # 切换到 ...
- ModuleNotFoundError: No module named '_sqlite3'的解决办法:pipenv的用法
export PIPENV_VENV_IN_PROJECT=1pipenv --venvpipenv --where pipenv install -r requirements.txtpipenv ...
- Android Butterknife(黄油刀) 使用方法总结
前言: ButterKnife是一个专注于Android系统的View注入框架,以前总是要写很多findViewById来找到View对象,有了ButterKnife可以很轻松的省去这些步骤.是大神J ...
- HAproxy负载均衡-ACL篇(转) blog.csdn.net/tantexian
ACL定制法则: 开放策略:拒绝所有,只开放已知 拒绝策略:允许所有,只拒绝某些 事实上实现安全策略,无非也就是以上两种方法 redirect 参考:http://cbonte.github.io/h ...
- [log4j]SLF4J+log4j的使用
使用log4j有两种方法,一种是直接使用log4j jar包,另一种是本文介绍的SLF4J+log4j的使用 概念 SLF4J:即简单日志门面(Simple Logging Facade fo ...
- centos 7 删除 virbr0 虚拟网卡
出现虚拟网卡是因为安装时启用了 libvirtd 服务后生成的关闭方法virsh net-list名称 状态 自动开始 持久------------------- ...
- docker镜像的仓库
一.docker镜像的仓库 --- repos-registry的创建: 仓库分为公共仓库和私有仓库 DockerHub的官方仓库 https://hub.docker.com DockerPool社 ...