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) {
  //Object.create() 静态方法以一个现有对象作为原型,创建一个新对象
  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()方法的更多相关文章

  1. 关于JS中apply方法的基本理解

    最近研究OpenLayers源码时,发现其中使用了比较多的apply方法,对其也是很不明白.于是上网经过多方面了解以及自己细细体会后,终于算是基本明白是其干什么的了,这里分享下.apply方法的造型是 ...

  2. 理解 backbone.js 中的 bind 和 bindAll 方法,关于如何在方法中指定其中的 this,包含apply方法的说明[转载]

    转载自:http://gxxsite.com/content/view/id/132.html 在backbone.js的学习过程中,被bind和bindAll弄得有点晕,这里包括underscore ...

  3. JS中的call()和apply()方法理解和使用

    1.方法定义call方法: 语法:obj.method.call(thisObj[,arg1[, arg2[, [,.argN]]]]) 定义:调用对象(obj)的一个方法(method),以另一个对 ...

  4. 理解JavaScript中的call和apply方法

    call方法 总的来说call()有这几种作用:1.可以借用另一个对象的方法.2.改变this的指向(重要).3.将arguments数组化.下面详细介绍这三种作用: 1.可以借用另一个对象的方法:当 ...

  5. JavaScript学习笔记(1))——————call,apply方法

    学习前端也有一段时间了,但是效果甚微.利用时间不够充分,虽然是利用工作之余来学习.但是这不能成为我的借口. 今天学习了(其实看了很多遍)call apply方法. function abc(a,b){ ...

  6. angularjs $scope.$apply 方法详解

    myApp.controller('firstController',function($scope,$interval){ $scope.date = new Date(); setInterval ...

  7. Js apply方法详解

    我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这里我做如下笔记,希望和大家 ...

  8. scala 学习笔记(04) OOP(上)主从构造器/私有属性/伴生对象(单例静态类)/apply方法/嵌套类

    一.主从构造器 java中构造函数没有主.从之分,只有构造器重载,但在scala中,每个类都有一个主构造器,在定义class时,如果啥也没写,默认有一个xxx()的主构造器 class Person ...

  9. Js apply 方法 详解

    Js apply方法详解 我在一开始看到JavaScript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这 ...

  10. 深入学习JavaScript: apply 方法 详解(转)——非常好

    主要我是要解决一下几个问题: 1.        apply和call的区别在哪里 2.        什么情况下用apply,什么情况下用call 3.        apply的其他巧妙用法(一般 ...

随机推荐

  1. Spring MVC 和 Struts 的区别是什么?

    1. 拦截机制的不同 Struts2 是类级别的拦截,每次请求就会创建一个 Action,和 Spring 整合时 Struts2 的 ActionBean 注入作用域是原型模式 prototype, ...

  2. 数据库相关知识点整理,助力拿到心仪的offer

    1. 数据库的事务 1.1 什么是数据库事务? 事务是指一组逻辑上相关的操作,这些操作要么全部完成,要么全部不完成. 事务是数据库管理系统执行过程中的一个逻辑工作单位,是用户定义的一个操作序列,这些操 ...

  3. 【小白晋级大师】如何设计一个支持10万人用的ChatGPT对接系统

    不停地书写,方能不失在人海茫茫. 1.前言 之前给大家写了ChatGPT对接企业微信的教程,具体可看知乎链接: [奶奶看了都会]ChatGPT3.5接入企业微信,可连续对话 文章结尾说了教程只能适用于 ...

  4. [ElasticSearch]#解决问题#修改Search Guard密码时 报错:ERR: Seems there is no Elasticsearch running on localhost:9300 - Will exit

    问题复现 [root@es2 tools]# ps -ef | grep elasticsearch 9200 22693 1 1 09:31 ? 00:04:54 /usr/bin/java -Xm ...

  5. WAL模块主要方法简述

    Method---wal.go Description func Create(lg *zap.Logger, dirpath string, metadata []byte) (*WAL, erro ...

  6. 扯下@EventListener这个注解的神秘面纱。

    你好呀,我是歪歪. 前段时间看到同事在项目里面使用了一个叫做 @EventListener 的注解. 在这之前,我知道这个注解的用法和想要达到的目的,但是也仅限于此,其内部工作原理对我来说是一个黑盒, ...

  7. Http请求get与post请求方式的各种相关面试总结

    转载请注明出处: GET方法和POST方法是两种HTTP请求方法,GET方法通过URL传递参数,可以缓存,但参数长度有限,一般用于获取资源:POST方法通过表单传递参数,不能缓存,参数长度没有限制,一 ...

  8. python:模拟购票的小程序

    问题描述:小白学习python的第N天,继续练习.做一个模拟购票的小程序,没有用数据库和文件来存储数据,只是能够单词选择. # hzh 每天进步一点点 # 2022/5/13 17:24 import ...

  9. DolphinDB +Python Airflow 高效实现数据清洗

    DolphinDB 作为一款高性能时序数据库,其在实际生产环境中常有数据的清洗.装换以及加载等需求,而对于该如何结构化管理好 ETL 作业,Airflow 提供了一种很好的思路.本篇教程为生产环境中 ...

  10. defineProperty在数据劫持后是如何通知数据的更新和视图的更新的

    vue的双向绑定是由数据劫持结合发布者-订阅者模式实现的,那么什么是数据劫持?vue是如何进行数据劫持的?说白了就是通过Object.defineProperty()来劫持对象属性的setter和ge ...