js-apply call bind 浅析
call
1.第一个参数指定了this,第二个参数传给this,也就是call前面的函数,作为他的参数第三个参数也一样
指定了this,就是执行环境,greet的this在i里面找
function greet() {
var reply = [this.person, 'Is An Awesome', this.role].join(' ');
console.log(reply);
}
var i = {
person: 'Douglas Crockford', role: 'Javascript Developer'
};
greet.call(i); // Douglas Crockford Is An Awesome Javascript Developer
第二个参数传给this,也就是call前面的函数,也就是函数继承,知乎大佬这莫说
猫吃鱼,狗吃肉,奥特曼打小怪兽。
有天狗想吃鱼了
猫.吃鱼.call(狗,鱼)
狗就吃到鱼了
猫成精了,想打怪兽
奥特曼.打小怪兽.call(猫,小怪兽)
function Product(name, price) {
this.name = name;
this.price = price;
}
function Food(name, price) {
Product.call(this, name, price);
this.category = 'food';
}
//等同于
function Food(name, price) {
this.name = name;
this.price = price;
if (price < 0) {
throw RangeError(
'Cannot create product ' + this.name + ' with a negative price'
);
}
this.category = 'food';
}
//function Toy 同上
function Toy(name, price) {
Product.call(this, name, price);
this.category = 'toy';
}
var cheese = new Food('feta', 5);
var fun = new Toy('robot', 40);
2.使用call方法调用匿名函数
1.写一个匿名函数
2.给数组中每一个元素作为this去执行这个匿名函数,就是this在animals[i]里面找,并把i传里面
3.因为是匿名函数,没有函数名,所以有this.print()
var animals = [
{species: 'Lion', name: 'King'},
{species: 'Whale', name: 'Fail'}
]; for (var i = 0; i < animals.length; i++) {
(function (i) {
this.print = function () {
console.log('#' + i + ' ' + this.species + ': ' + this.name);
}
this.print();
}).call(animals[i], i);
}
2.call 和 apply 一模一样几乎
区别只在于传递参数的方式
console.log.apply(console, [1, 2, 3, 4])
console.log.call(console, 1, 2, 3, 4)
}
3.bind最大用途在于指定this的值,第二个参数是提前给他穿进去了这个参数
function list() {
return Array.prototype.slice.call(arguments);//把arguments变成数组,再使用数组才有的slice方法
}
var list1 = list(1, 2, 3); // [1, 2, 3]
// Create a function with a preset leading argument
var leadingThirtysevenList = list.bind(undefined, 37);
var list2 = leadingThirtysevenList(); // [37]
var list3 = leadingThirtysevenList(1, 2, 3); // [37, 1, 2, 3]
js-apply call bind 浅析的更多相关文章
- this,call,apply,bind浅析
在JS中,this指向是一个难点,在本文中讲解几种常见的this指向问题,并介绍一下call,apply,bind这三个函数的用法. 一.常见的this指向情况 首先要明白一点就是,函数里面才会有th ...
- js apply() call() bind() 的使用
bind ,call,apply 这三者都是用来改变函数的this对象的指向的. call和apply其实是同一个东西,区别只有参数不同. 其实call和apply ,只要你调用调用一个函数的时候就可 ...
- JS核心系列:浅谈 call apply 与 bind
在JavaScript 中,call.apply 和 bind 是 Function 对象自带的三个方法,这三个方法的主要作用是改变函数中的 this 指向,从而可以达到`接花移木`的效果.本文将对这 ...
- js里function的apply vs. bind vs. call
js里除了直接调用obj.func()之外,还提供了另外3种调用方式:apply.bind.call,都在function的原型里.这3种方法的异同在stackoverflow的这个答案里说的最清楚, ...
- JS之apply,call,bind区别
为了加深对基础知识的理解,今天再复习下js中的apply,call,bind的区别和用法.整理笔记的过程也是一个再次学习的过程. apply和call js中的调用apply和call方法可以改变某个 ...
- JS中的call、apply、bind方法
JS中的call.apply.bind方法 一.call()和apply()方法 1.方法定义 call方法: 语法:call([thisObj[,arg1[, arg2[, [,.argN]]] ...
- js中call、apply、bind那些事
前言 回想起之前的一些面试,几乎每次都会问到一个js中关于call.apply.bind的问题,比如- 怎么利用call.apply来求一个数组中最大或者最小值 如何利用call.apply来做继承 ...
- 前端总结·基础篇·JS(三)arguments、callee、call、apply、bind及函数封装和构造函数
前端总结系列 前端总结·基础篇·CSS(一)布局 前端总结·基础篇·CSS(二)视觉 前端总结·基础篇·CSS(三)补充 前端总结·基础篇·JS(一)原型.原型链.构造函数和字符串(String) 前 ...
- 理解JS中的call、apply、bind方法(*****************************************************************)
在JavaScript中,call.apply和bind是Function对象自带的三个方法,这三个方法的主要作用是改变函数中的this指向. call.apply.bind方法的共同点和区别:app ...
- 使用call、apply和bind解决js中烦人的this,事件绑定时的this和传参问题
1.什么是this 在JavaScript中this可以是全局对象.当前对象或者任意对象,这完全取决于函数的调用方式,this 绑定的对象即函数执行的上下文环境(context). 为了帮助理解,让我 ...
随机推荐
- 我的wordpress在Nginx的配置
lnmp生成过程 You select the exist rewrite rule:/usr/local/nginx/conf/wordpress.conf Gracefully shutting ...
- Ubuntu14.04引导菜单修复
原文链接:http://www.metsky.com/archives/636.html 独立分区下的Ubuntu引导菜单修复有点麻烦,执行挂载等命令时要小心检查,修复此类引导,首先需要确保当前系统和 ...
- (转)RabbitMQ学习之安装
http://blog.csdn.net/zhu_tianwei/article/details/40832185 RabbitMQ是一个开源的AMQP实现,服务器端用Erlang语言编写,支持多种客 ...
- HTTP报文获取方法
GET:获取资源,可以理解为读取或者下载数据: HEAD:获取资源的元信息: POST:向资源提交数据,相当于写入或上传数据: PUT:类似 POST: DELETE:删除资源: CONNECT:建立 ...
- Here comes Treble: A modular base for Android
On the Android team, we view each dessert release as an opportunity to make Android better for our u ...
- 洛谷P2776 [SDOI2007]小组队列 链表 + 模拟
有些细节需要注意: 1.编号和元素种类都从0开始标号. 2.需要特判一下队列被弹空的情况. Code: #include<cstdio> #include<cstring> u ...
- 关于配置websocket,nginx转发https至wss问题
在本地测试通过的socket,再放到现在的有nginx代理之后发现会报:failed: Error in connection establishment: net::ERR_NAME_NOT_RES ...
- Python笔记15------图像
主要三个库:Pilow(PIL).OpenCV.Skimage(针对scipy,用的少) 小例子:给一张图片的左上角粘贴一个相同的图片(缩略并旋转了45度) from PIL import Image ...
- [USACO08NOV]奶牛混合起来Mixed Up Cows(状态压缩DP)
题目描述 Each of Farmer John's N (4 <= N <= 16) cows has a unique serial number S_i (1 <= S_i & ...
- django模板使用
概述 模板由两部分组成,HTML代码,逻辑控制代码,作用:快速生成HTML页面,优点:模板的设计实现了业务逻辑与现实内容的分离 定义模板 挖坑与继承 模板继承可以减少页面的内容的重复定义,实现页面的重 ...