call、apply、bind一直是不求甚解!
一直感觉代码中有call和apply就很高大上(看不懂),但是都草草略过,今天非要弄明白!
以前总是死记硬背:call、apply、bind 都是用来修改函数中的this,传参时,call是一个个传参,apply是数组或者类数组形式传参,call和apply立即执行并且返回值是你调用的方法的返回值,若该方法没有返回值,则返回undefined。bind是改变this后返回一个新的函数,他不会立即执行。
死记硬背的结果就是:总以为这三个方法改变了原方法的this,原方法的this就永久改变了!大错特错啊!!
1.提出问题:看到好多call使用场景,就是不求甚解!
例1:Object.prototype.toString.call(arguments) 用来精确判断数据类型:"[object Array]" 或者 "[object Object]"
例2:Array.slice.call(类数组) 或者 [].slice.call(类数组) 用来把类数组转为数组,其实这里就是让类数组使用一下不属于自己的方法slice 2.验证问题:看看apply的用法 (别人写的)
function people(age,sex){
this.age=age;
this.sex=sex;
};
function adult(age,sex){
people.apply(this,arguments)
};
var jack = new adult(18,'man');
console.log(jack.age+":"+jack.sex)
输出为 18:man
其实看到这段代码就知道apply怎么用了吧。
其实apply说到底就是为了使一个对象可以使用不属于自己的方法,
3. 扩展(填坑之路):我想自己写一下验证apply会不会改变this,如下(自己写的)
function fn() {
console.log(this);
}
var obj={a:[4,5,6],b:[7,8]};
fn.apply(obj); // {a: Array(3), b: Array(2)}
var f=new fn(); // { }
郁闷:倒数第二行我不是用fn.apply(obj)改了fn的this指向为obj了么,为什么最后一行new出来的对象是空的?不应该是带a和b属性么?
答案:你只是用fn.apply(obj)执行了一把fn,执行时顺便把fn中的this改成了obj而已,然后把结果输出,这并不会改变fn原函数啊。
否则调用一次 Array.slice.call(类数组) ,难道就要把数组的slice方法里的this永久修改为传入的参数 类数组 么!那不是疯了么!
以后这样死记硬背:call、apply、bind 是Function.prototype下的方法,作用是执行一下目标函数,执行时顺便把目标函数中的this改一下,然后把结果输出,执行后,不会影响原函数!
题外话:如果你的代码也想用这三个方法,你就要学习数组的slice写法,里面的逻辑都考虑到this问题。
call、apply、bind一直是不求甚解!的更多相关文章
- 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 指定 ...
- JS 的 call apply bind 方法
js的call apply bind 方法都很常见,目的都是为了改变某个方法的执行环境(context) call call([thisObj[,arg1[, arg2[, [,.argN]]]] ...
- javascript-this,call,apply,bind简述2
上节我们一起研究了this这个小兄弟,得出一个结论,this指向调用this所在函数(或作用域)的那个对象或作用域.不太理解的朋友可以看看上节的内容,这次我们主要探讨一下call(),apply(), ...
- javascript-this,call,apply,bind简述1
最近在系统的学习面向对象方面的知识,遇到的最大拦路虎就数this的指向,call,apply,bind函数的使用,单独抽出一天时间把这几个烦人的家伙搞定,去学习更深入的内容. 首先介绍一下this的一 ...
- 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的环境,在没有学之 ...
- call, apply,bind 方法解析
call(), apply(),bind() 三者皆为Function的方法 call(),apply()的作用是调用方法,并改变函数运行时的context(作用上下文) bind() 的作用是引用方 ...
- JS中call,apply,bind方法的总结
why?call,apply,bind干什么的?为什么要学这个? 一般用来指定this的环境,在没有学之前,通常会有这些问题. var a = { user: "小马扎", fn: ...
随机推荐
- 双缓冲技术局部更新原理之派生自View
package com.loaderman.customviewdemo; import android.content.Context; import android.graphics.Canvas ...
- c语言 GPS nmealib学习笔记
.nmealib简介 nmealib是一个基于C语言的用于nmea协议的开源库.虽然nmea体积小巧,但是却具备了不少功能. 分析NMEA语句并把结果保存在合适的C语言结构体中. 除了解析NMEA语句 ...
- QML渐变色
Rectangle { id: tab_btn width: height: parent.height color: "black" gradient: Gradient { G ...
- thymeleaf中分类信息使用不同的样式
需求: 相关class类名:S224_on_point url:/notification/list url:/notification/list?type=2 thymeleaf代码如下: < ...
- (四)java对象的结构和对象的访问定位
在HotSpot虚拟机中,对象在内存中存储的布局可以分为3块区域:对象头(Header).实例数据(Instance Data)和对齐填充(Padding). 一. 对象头 HotSpot虚拟机的对象 ...
- VS2010插件之NuGet
Visual Studio(简写VS)是.net程序员开发必不可少的开发工具,随着VS的版本不断的升级和使用用户的扩大,现在针对VS开发了许多的开源免费的插件,大大的方便了程序员的开发,提高了开发效率 ...
- [CareerCup] Guards in a museum 博物馆的警卫
A museum was represented by a square matrix that was filled with O, G, and W where O represented ope ...
- iOS算法题
1兔子算法题 兔子可以跳一步2步或者3步,问跳到100有多少种跳法? // 兔子可以跳一步2步或者3步 // 问跳到100有几种跳法 /* 分析1 两个变量,X*2+Y*3=100. X最大为50,X ...
- OpenCV计算机视觉实战(Python版)资源
疲劳检测 pan.baidu.com/s/1Ng_-utB8BSrXlgVelc8ovw #导入工具包 from scipy.spatial import distance as dist from ...
- 字符串匹配算法---BF
Brute-Force算法,简称BF算法,是一种简单朴素的模式匹配算法,常用语在一个主串string 内查找一个子串 pattern的出现位置. 核心思想: i 遍历主串string i 每自增一次, ...