深入理解 apply()方法
apply(thisArg)
apply(thisArg, argsArray)
thisArg
在 func 函数运行时使用的 this 值。请注意,this 可能不是该方法看到的实际值:如果这个函数处于非严格模式下,则指定为 null 或 undefined 时会自动替换为指向全局对象,原始值会被包装。
argsArray 可选
一个数组或者类数组对象,其中的数组元素将作为单独的参数传给 func 函数。如果该参数的值为 null 或 undefined,则表示不需要传入任何参数。从 ECMAScript 5 开始可以使用类数组对象。浏览器兼容性请参阅本文底部内容。
返回值
调用有指定 this 值和参数的函数的结果。
1.数组合并用法
const arr1 = ["anan", "zooey"];
const arr2 = [198, 246, 357];
//1.1 apply()
arr1.push.apply(arr1, arr2);
// console.log(arr1);//['anan','zooey',198,246,357]
//1.2call()
arr1.push.call(arr1, ...arr2);
// console.log(arr1);//['anan','zooey',198,246,357]
//1.3 es6
const newArr = [...arr1, ...arr2];
// console.log(newArr);//['anan','zooey',198,246,357]
2.内置函数用法
const num = [2, 5, 3, 6, 9, 0, 99]; //2.1 错误用法
let max1 = Math.max(num);
// console.log(max1);//NaN
//2.2 apply()
let max2 = Math.max.apply(null, num);
// console.log(max2);//99
//2.3 es6
let max3 = Math.max(...num);
// console.log(max3);//99
//2.4 call()
let max4 = Math.max.call(null, ...num);
// console.log(max4);//99
3.apply链接构造器用法
你可以使用 apply 来链接一个对象构造器,类似于 Java。(Java的对象构造器用来创建对象,也可以对对象属性做一些特殊处理,如时间格式化)
在接下来的例子中我们会创建一个全局 Global_Objects/Function 对象的 construct 方法,来使你能够在构造器中使用一个类数组对象而非参数列表。
个人理解:给全局的Function 类定义一个construct方法,并且在construct方法中根据现有对象创建一个新的对象,利用apply链接构造器,返回一个新的对象,此时对全局的Function 对象拥有了一个的 construct 方法,能够返回类数组对象
注意,这个construct方法是新定义的,不是原本的constructor
定义中描述的类数组对象是下图的样子:

//给全局的Function 类定义一个construct方法,并且在construct方法中创建一个新的对象,利用apply链接构造器,返回一个新的对象
Function.prototype.construct = function (aArgs) {
let oNew = Object.create(this.prototype);
this.apply(oNew, aArgs);
return oNew;
}; function MyConstructor() {
//这里就是对数组进行遍历,然后封装成k:v的形式
for (let nProp = 0; nProp < arguments.length; nProp++) {
this["property" + nProp] = arguments[nProp];
}
}
//定义一个数组
let myArray = ["zooey", "Hello world!", "anan"]; let myInstance = MyConstructor.construct(myArray);
//打印结果
console.log(myInstance);
深入理解 apply()方法的更多相关文章
- 关于JS中apply方法的基本理解
最近研究OpenLayers源码时,发现其中使用了比较多的apply方法,对其也是很不明白.于是上网经过多方面了解以及自己细细体会后,终于算是基本明白是其干什么的了,这里分享下.apply方法的造型是 ...
- 理解 backbone.js 中的 bind 和 bindAll 方法,关于如何在方法中指定其中的 this,包含apply方法的说明[转载]
转载自:http://gxxsite.com/content/view/id/132.html 在backbone.js的学习过程中,被bind和bindAll弄得有点晕,这里包括underscore ...
- JS中的call()和apply()方法理解和使用
1.方法定义call方法: 语法:obj.method.call(thisObj[,arg1[, arg2[, [,.argN]]]]) 定义:调用对象(obj)的一个方法(method),以另一个对 ...
- 理解JavaScript中的call和apply方法
call方法 总的来说call()有这几种作用:1.可以借用另一个对象的方法.2.改变this的指向(重要).3.将arguments数组化.下面详细介绍这三种作用: 1.可以借用另一个对象的方法:当 ...
- JavaScript学习笔记(1))——————call,apply方法
学习前端也有一段时间了,但是效果甚微.利用时间不够充分,虽然是利用工作之余来学习.但是这不能成为我的借口. 今天学习了(其实看了很多遍)call apply方法. function abc(a,b){ ...
- angularjs $scope.$apply 方法详解
myApp.controller('firstController',function($scope,$interval){ $scope.date = new Date(); setInterval ...
- Js apply方法详解
我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这里我做如下笔记,希望和大家 ...
- scala 学习笔记(04) OOP(上)主从构造器/私有属性/伴生对象(单例静态类)/apply方法/嵌套类
一.主从构造器 java中构造函数没有主.从之分,只有构造器重载,但在scala中,每个类都有一个主构造器,在定义class时,如果啥也没写,默认有一个xxx()的主构造器 class Person ...
- Js apply 方法 详解
Js apply方法详解 我在一开始看到JavaScript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这 ...
- 深入学习JavaScript: apply 方法 详解(转)——非常好
主要我是要解决一下几个问题: 1. apply和call的区别在哪里 2. 什么情况下用apply,什么情况下用call 3. apply的其他巧妙用法(一般 ...
随机推荐
- 【VSC】ERROR:GDB exited unexpectedly.
[VSC]ERROR:GDB exited unexpectedly. 记录一次调试所遇bug的查找历程 问题描述 ERROR: GDB exited unexpectedly. Debugging ...
- cl 编译器环境配置
安装 visual studio 2019 其他版本路径可能有差别,需自行对照查找. visual studio 2019安装目录 和 Windows kits 文件夹[在同一目录下] 即VS 如果安 ...
- MyBatis缓存机制[NO]
前言 MyBatis是常见的Java数据库访问层框架.在日常工作中,开发人员多数情况下是使用MyBatis的默认缓存配置,但是MyBatis缓存机制有一些不足之处,在使用中容易引起脏数据,形成一些潜在 ...
- 全网最详细中英文ChatGPT-GPT-4示例文档-从0到1快速入门解析非结构化数据应用——官网推荐的48种最佳应用场景(附python/node.js/curl命令源代码,小白也能学)
目录 Introduce 简介 setting 设置 Prompt 提示 Sample response 回复样本 API request 接口请求 python接口请求示例 node.js接口请求示 ...
- 阿里巴巴为什么建议使用BigDecimal进行浮点数运算
本文先引入一个例子,星期天你和女朋友去逛街,看到一家奶茶店.女朋友想喝奶茶了,你就去买了杯奶茶,然后你问了一下价格.店员说奶茶0.9元一杯.然后你给了1元钱.这个时候你忽然问了一下女友.服务员该找我们 ...
- 纯CSS3实现多行文本截断
纯CSS处理多行文本展开和收起,直接上代码和效果图 1 <html> 2 <header> 3 <style> 4 .wrap { 5 position: rela ...
- [BUUCTF]Web刷题记录
为提升观感体验,本篇博文长期更新,新题目以二次编辑形式附在最后 [ACTF2020 新生赛]Exec 打开后发现网页是关于执行一个ping指令,经过测试是直接执行的,所以就直接命令执行了 127.0. ...
- CentOS8安装Oracle datebase 19C
我这里安装Oracle数据库是rpm格式的包.需要先得有以下依赖包关系,先依次按此顺序安装. yum install ./compat-libcap1-1.10-7.el7.x86_64.rp ...
- 【入门排坑】Windows之间使用OpenSSH的ssh免密登录,排坑
安装 安装OpenSSH 需要安装OpenSSH客户端和服务器,win10自带客户端,我们安装服务器即可. 设置 -- 应用 -- 可选功能 -- 添加 -- 添加 OpenSSH 服务器 配置 公钥 ...
- c++实战开发程序
非常感谢您的进一步提问,以下是一个对于实战开发小程序的更具体的建议: 第1周实战开发小程序建议:写一个简单的计算器程序,要求包含加.减.乘.除四种基本运算,并进行错误处理,例如输入了非法字符或者除数为 ...