Arguments 对象、call()与apply()
Arguments 对象
arguments:是一个对应于传递给函数的参数的类数组对象。arguments对象是所有(非箭头)函数中都可用的局部变量,你可以使用arguments对象在函数中引用函数的参数。此对象包含传递给函数的每个参数,第一个参数在索引0处。
ps:arguments对象不是一个 Array ,它类似于Array,但除了length属性和索引元素之外没有任何Array属性和方法。但可以被转换为一个真正的Array,方式如下:
// ES5
var args = Array.prototype.slice.call(arguments);
var args = [].slice.call(arguments);
// ES6
const args = Array.from(arguments);
const args = [...arguments];
参考资料:
1、arguments:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/arguments
call()、apply()、bind()——用于改变this指向
call():使用一个指定的 this 值和单独给出的一个或多个参数来调用一个函数:接受的是一个参数列表
call巧用:将具有length属性的对象转成数组[].slice.call(arguments),为了提高性能,减少对原型链的追溯,一般使用Array.prototype.slice.call(arguments)
let obj1 = {
a: '我是obj1的a',
fn: function(msg) {
console.log(msg + this.a);
}
}
let obj2 = {
a: '我是obj2的a'
}
// 正常调用
obj1.fn('你说啥?') // 你说啥?我是obj1的a
// call()调用
obj1.fn.call(obj2, '你说啥?') // 你说啥?我是obj2的a
apply():使用一个指定的 this 值和单独给出的一个数组(
['eat', 'bananas'])或数组对象(new Array('eat', 'bananas'))参数来调用一个函数:接受的是一个包含多个参数的数组
const numbers = [5, 6, 2, 3, 7];
const max = Math.max.apply(null, numbers); // apply巧用,将数组转换为参数列表,等同于`Math.max(...numbers)`
console.log(max); // expected output: 7
const min = Math.min.apply(null, numbers);
console.log(min); // expected output: 2
bind():使用一个指定的 this 值和单独给出的一个或多个参数来创建一个函数供后续被调用:接受的是一个参数列表
const module = {
x: 42,
getX: function() {
return this.x;
}
};
const unboundGetX = module.getX;
console.log(unboundGetX()); // The function gets invoked at the global scope
// expected output: undefined
const boundGetX = unboundGetX.bind(module);
console.log(boundGetX());
// expected output: 42
注意:apply传参是数组,而call、bind是参数列表,且apply和call是一次性传入参数,而bind可以分为多次传入;bind 是返回绑定this之后的函数,便于稍后调用;apply 、call 则是立即执行。
参考资料:
1、call():https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Function/call
2、apply():https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Function/apply
3、bind():https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Function/bind
4、展开语法:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Spread_syntax
Arguments 对象、call()与apply()的更多相关文章
- JavaScript中的apply与call与arguments对象
(一) call方法 语法:presentObj.call(thisObj,arg1,arg2,arg3...) 参数thisObj :将被用作当前对象presentObj的对象. 当thisObj无 ...
- arguments对象、apply()、匿名函数
在学习arguments对象时,碰到的一段code,不是太好理解.原文地址中文(http://www.jb51.net/article/25048.htm).英文(http://www.sitepoi ...
- 永远不要修改arguments对象
案例复现 var obj = { plus: function(arg0, arg1) { return arg0 + arg1; } }; function callMethod(context, ...
- [Effective JavaScript 笔记]第23条:永远不要修改arguments对象
arguments对象并不是标准的Array类型的实例.arguments对象不能直接调用Array方法. arguments对象的救星call方法 使得arguments可以品尝到数组方法的美味,知 ...
- 关于arguments对象以及函数的柯里化;
1.arguments对象 Arguments是个类似数组但不是数组的对象,说他类似数组是因为其具备数组相同的访问性质及方式,能够由arguments[n]来访问对应的单个参数的值,并拥有数组长度属性 ...
- Javascript Arguments,calle,caller,call,apply
一.Arguments 该对象代表正在执行的函数和调用他的函数的参数. [function.]arguments[n] 参数function :选项.当前正在执行的 Function 对象的名字. n ...
- 你不知道的JavaScript--Item11 arguments对象
1.什么是arguments arguments 是是JavaScript里的一个内置对象,它很古怪,也经常被人所忽视,但实际上是很重要的.所有主要的js函数库都利用了arguments对象.所以ag ...
- ES6教程-字符串,函数的参数,了解函数的arguments对象,js面向对象,设计模式-单例模式,解构赋值
前言 主要讲解了ES6对字符串的拓展,包括includes,startsWith和endsWith,另外增加了字符串模板. Start includes()是否包含 startsWith()以什么开头 ...
- JavaScript学习总结(三、函数声明和表达式、this、闭包和引用、arguments对象、函数间传递参数)
一.函数声明和表达式 函数声明: function test() {}; test(); //运行正常 function test() {}; 函数表达式: var test = functio ...
随机推荐
- 从未被Google过 #NerverBeenGoogled
我相信大家都用Google搜索互联网上的东西,Google会跟踪你搜索的所有内容,但是你或许不知道,他们也记录着从未被Google过的内容.我有个清单,这些是有史以来从未被Google过的一些东西1. ...
- 凯哥带你用python撸算法之雪花算法
import time class Snow(object): def __init__(self, idx=None): init_date = time.strptime('2010-01-01 ...
- 解决Vue调用springboot接口403跨域问题
最近在做一个前后端分离的项目, 前端用的是Vue后端使用的是springboot, 在项目整合的时候发现前端调用后端接口报错403跨域请求问题 前端跨域请求已解决, 那么问题就出在后端了, 找了一些资 ...
- Ubuntu18.04.2下安装 RTX2080 Nvidia显卡驱动
转载请注明出处:BooTurbo https://www.cnblogs.com/booturbo/p/11261903.html 不久前入手了蓝天P870TM1G准系统,配置如下: 1. Z370 ...
- 基于DBUtils实现数据库连接池及flask项目部署
阅读目录 flask中是没有ORM的,如果在flask里面连接数据库有两种方式 数据库连接池原理 模式一: 模式二: 数据库连接池 flask中是没有ORM的,如果在flask里面连接数据库有两种方式 ...
- 201871010134-周英杰《面向对象程序设计(java)》第十三周学习总结
201871010134-周英杰<面向对象程序设计(java)>第十三周学习总结 项目 内容 这个作业属于哪个课程 https://www.cnblogs.com/nwnu-daizh/ ...
- Eclipse IDE for java EE Developers下载和安装
1.登录 http://www.eclipse.org/home/index.php ,下载Eclipse IDE for java EE Developers 2.解压缩压缩包到任意路径(推荐:G: ...
- js常用方法总结(以后遇到再进一步总结)
1.index() 返回指定元素相对于其他指定元素的 index 位置. <h1>店铺评价</h1> <div class="star starcd&qu ...
- org.slf4j.helpers.Log4jLoggerFactory is not on classpath. Good!
View Javadoc 1 /* 2 * Licensed to the Apache Software Foundation (ASF) under one or more 3 * contrib ...
- web框架--tornado自定义分页
1.tornado_main.py #!/usr/bin/env python # -*- coding: utf-8 -*- import tornado.web import tornado.io ...