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 相关文章推荐
bcastr2.0 通用的图片浏览器
Nov 22 Javascript
javascript判断单选框或复选框是否选中方法集锦
Apr 04 Javascript
jQuery live( type, fn ) 委派事件实现
Oct 11 Javascript
关于 文本框默认值 的操作js代码
Jan 12 Javascript
JavaScript中Cookie操作实例
Jan 09 Javascript
JavaScript中解析JSON数据的三种方法
Jul 03 Javascript
JS组件Bootstrap导航条使用方法详解
Apr 29 Javascript
BootStrap扔进Django里的方法详解
May 13 Javascript
深入理解jQuery.data() 的实现方式
Nov 30 Javascript
Angularjs 1.3 中的$parse实例代码
Sep 14 Javascript
vue的toast弹窗组件实例详解
May 14 Javascript
vue cli 3.0 使用全过程解析
Jun 14 Javascript
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
如何对PHP程序中的常见漏洞进行攻击(下)
2006/10/09 PHP
PHP在字符串中查找指定字符串并删除的代码
2008/10/02 PHP
测试PHP连接MYSQL成功与否的代码
2013/08/16 PHP
smarty内置函数section的用法
2015/01/22 PHP
php+html5使用FormData对象提交表单及上传图片的方法
2015/02/11 PHP
php格式化时间戳
2016/12/17 PHP
PHP+redis实现的悲观锁机制示例
2018/06/12 PHP
【消息提示组件】,兼容IE6/7&&FF2
2007/09/04 Javascript
JQuery打造PHP的AJAX表单提交实例
2009/11/03 Javascript
JS操作Cookie写入和读取实例代码
2013/10/20 Javascript
函数式 JavaScript(一)简介
2014/07/07 Javascript
jQuery中dequeue()方法用法实例
2014/12/29 Javascript
一款基于jQuery的图片场景标注提示弹窗特效
2015/01/05 Javascript
NodeJS学习笔记之(Url,QueryString,Path)模块
2015/01/13 NodeJs
详细解读JavaScript编程中的Promise使用
2015/07/27 Javascript
使用RequireJS库加载JavaScript模块的实例教程
2016/06/06 Javascript
基于jQuery和hwSlider实现内容左右滑动切换效果附源码下载(一)
2016/06/22 Javascript
基于Bootstrap的网页设计实例
2017/03/01 Javascript
原生Aajax 和jQuery Ajax 写法个人总结
2017/03/24 jQuery
微信小程序中的swiper组件详解
2017/04/14 Javascript
AngularJS 的$timeout服务示例代码
2017/09/21 Javascript
解决vue 路由变化页面数据不刷新的问题
2018/03/13 Javascript
浅谈js获取ModelAndView值的问题
2018/03/28 Javascript
如何理解Vue的v-model指令的使用方法
2018/07/19 Javascript
[04:16]完美世界DOTA2联赛PWL S2 集锦第一期
2020/11/23 DOTA
Python中defaultdict与lambda表达式用法实例小结
2018/04/09 Python
Flask实现跨域请求的处理方法
2018/09/27 Python
Python 开发工具PyCharm安装教程图文详解(新手必看)
2020/02/28 Python
python 双循环遍历list 变量判断代码
2020/05/04 Python
HTML5 Web Workers之网站也能多线程的实现
2013/04/24 HTML / CSS
常用的HTML5列表标签
2017/06/20 HTML / CSS
巴西最大的巴士票务门户:Quero Passagem
2020/11/21 全球购物
修理厂厂长岗位职责
2014/01/30 职场文书
运动会入场词50字
2014/02/20 职场文书
毕业生自我鉴定范文
2019/05/13 职场文书
口袋妖怪冰系十大最强精灵,几何雪花排第七,第六类似北极熊
2022/03/18 日漫