JS apply用法总结和使用场景实例分析


Posted in Javascript onMarch 14, 2020

本文实例讲述了JS apply用法总结和使用场景。分享给大家供大家参考,具体如下:

apply是绑定this到指定函数或类,也可以说把函数或者类的方法和属性给到当前作用域。

1,使用apply实现继承

function A(name, age){
   this.name = name;
   this.age = age;
  }
 
  function B(name, age, time){
   A.apply(this,[name]) //这里的name必须加上[]
  }
 
  const b = new B('继承');
  console.log(b)

2,使用apply实现多重继承

function Class10(){
 this.showSub = function(a,b){
    alert(a - b);
  }  
}
 
function Class11(){
 this.showAdd = function(a,b){
    alert(a + b);
  } 
}
 
function Class12(){
 Class10.apply(this);
 Class11.apply(this);  
 // Class10.call(this);
 //Class11.call(this); 
}
 
var c2 = new Class12();
c2.showSub(3,1);  //2
c2.showAdd(3,1);  //4

3,apply使用时传参规则

fn.apply(this,array)

在执行过程中,array参数会被转化成一个一个参数传递给函数fn

fn.apply(this,[params1,params2,...])
//相当于
fn(params1,params2,...)//这里的this指向执行fn函数的作用域

4,apply绑定this和绑定null

function C(name, age){
   console.log(this.name)
  }
 
  var name = 'windowname'
  var myObject = {name:"myA",age:"myB"};
  C.apply(myObject) //myA
  C.apply(null)//windowname
 
   function D(){
   this.name = '我是D空间'
   C.apply(this)
  }
 
  D();//我是D空间

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
基于jQuery的一个扩展form序列化到json对象
Dec 09 Javascript
javascript学习笔记(六)数据类型和JSON格式
Oct 08 Javascript
javascript数据结构与算法之检索算法
Apr 04 Javascript
js实现透明度渐变效果的方法
Apr 10 Javascript
AngularJS中的JSONP实例解析
Dec 01 Javascript
Javascript中构造函数要注意的一些坑
Jan 23 Javascript
iview实现select tree树形下拉框的示例代码
Dec 21 Javascript
JavaScript 截取字符串代码实例
Sep 05 Javascript
Vue 技巧之控制父类的 slot
Feb 24 Javascript
基于Vue2实现移动端图片上传、压缩、拖拽排序、拖拽删除功能
Jan 05 Vue.js
ajax jquery实现页面某一个div的刷新效果
Mar 04 jQuery
vue+element ui实现锚点定位
Jun 29 Vue.js
javascript事件循环event loop的简单模型解释与应用分析
Mar 14 #Javascript
原生js实现ajax请求和JSONP跨域请求操作示例
Mar 14 #Javascript
js实现的订阅发布者模式简单示例
Mar 14 #Javascript
vue插槽slot的简单理解与用法实例分析
Mar 14 #Javascript
es6中new.target的作用和使用场景简单示例分析
Mar 14 #Javascript
JS中类的静态方法,静态变量,实例方法,实例变量区别与用法实例分析
Mar 14 #Javascript
js中forEach,for in,for of循环的用法示例小结
Mar 14 #Javascript
You might like
解析CodeIgniter自定义配置文件
2013/06/18 PHP
PHP中的reflection反射机制测试例子
2014/08/05 PHP
PHP单态模式简单用法示例
2016/11/16 PHP
在PHP中输出JS语句以及乱码问题的解决方案
2019/02/13 PHP
php屏蔽错误及提示的方法
2020/05/10 PHP
浅谈PHP中的那些魔术常量
2020/12/02 PHP
用Javascript 和 CSS 实现脚注(Footnote)效果
2009/09/09 Javascript
利用js获取服务器时间的两个简单方法
2010/01/08 Javascript
JS的replace方法详细介绍
2012/11/09 Javascript
javascript操作字符串的原生方法
2014/12/22 Javascript
jQuery获取标签文本内容和html内容的方法
2015/03/27 Javascript
JavaScript中的条件判断语句使用详解
2015/06/03 Javascript
jQuery on()方法示例及jquery on()方法的优点
2015/08/27 Javascript
实现非常简单的js双向数据绑定
2015/11/06 Javascript
JavaScript读二进制文件并用ajax传输二进制流的方法
2016/07/18 Javascript
js简单正则验证汉字英文及下划线的方法
2016/11/28 Javascript
基于Vue.js实现tab滑块效果
2017/07/23 Javascript
网页爬虫之cookie自动获取及过期自动更新的实现方法
2018/03/06 Javascript
vue实现多个元素或多个组件之间动画效果
2018/09/25 Javascript
深入浅析js原型链和vue构造函数
2018/10/25 Javascript
Angular单元测试之事件触发的实现
2020/01/20 Javascript
JavaScript canvas绘制渐变颜色的矩形
2020/02/18 Javascript
使用element-ui +Vue 解决 table 里包含表单验证的问题
2020/07/17 Javascript
[10:34]DOTA2上海特级锦标赛全纪录
2016/03/25 DOTA
RC4文件加密的python实现方法
2015/06/30 Python
python opencv 读取本地视频文件 修改ffmpeg的方法
2019/01/26 Python
python函数修饰符@的使用方法解析
2019/09/02 Python
如何通过python实现人脸识别验证
2020/01/17 Python
美国最大的万圣节服装网站:HalloweenCostumes.com
2017/10/12 全球购物
给定一个时间点,希望得到其他时间点
2013/11/07 面试题
大学生实习鉴定评语
2014/04/25 职场文书
2015年商场工作总结
2015/04/27 职场文书
先进个人主要事迹范文
2015/11/04 职场文书
Python使用psutil库对系统数据进行采集监控的方法
2021/08/23 Python
Spring Security使用单点登录的权限功能
2022/04/03 Java/Android
pytest实现多进程与多线程运行超好用的插件
2022/07/15 Python