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 1.5.1 发布,全面支持IE9 修复大量bug
Feb 26 Javascript
javascript实现dom动态创建省市纵向列表菜单的方法
May 14 Javascript
javascript断点调试心得分享
Apr 23 Javascript
javascript 动态样式添加的简单实现
Oct 11 Javascript
利用js获取下拉框中所选的值
Dec 01 Javascript
JS动态生成年份和月份实例代码
Feb 04 Javascript
Spring Boot+AngularJS+BootStrap实现进度条示例代码
Mar 02 Javascript
Vue header组件开发详解
Jan 26 Javascript
jquery动态添加以及遍历option并获取特定样式名称的option方法
Jan 29 jQuery
ajax前台后台跨域请求处理方式
Feb 08 Javascript
通过原生vue添加滚动加载更多功能
Nov 21 Javascript
如何手写简易的 Vue Router
Oct 10 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自动适应范围的分页代码
2008/08/05 PHP
解决php接收shell返回的结果中文乱码问题
2014/01/23 PHP
php使用sql server验证连接数据库的方法
2014/12/25 PHP
PHP批量去除BOM头内容信息代码
2016/03/11 PHP
Zend Framework入门知识点小结
2016/03/19 PHP
浅谈PHP array_search 和 in_array 函数效率问题
2019/10/15 PHP
JavaScript创建命名空间(namespace)的最简实现
2007/12/11 Javascript
网站页面自动跳转实现方法PHP、JSP(下)
2010/08/01 Javascript
不使用XMLHttpRequest实现异步加载 Iframe和script
2012/10/29 Javascript
jquery $.fn $.fx是什么意思有什么用
2013/11/04 Javascript
js对文章内容进行分页示例代码
2014/03/05 Javascript
AngularJS HTML编译器介绍
2014/12/06 Javascript
JavaScript实现弹出子窗口并传值给父窗口
2014/12/18 Javascript
javascript从定义到执行 你不知道的那些事
2016/01/04 Javascript
Bootstrap每天必学之模态框(Modal)插件
2016/04/26 Javascript
微信小程序-拍照或选择图片并上传文件
2017/01/06 Javascript
Vue.js学习之计算属性
2017/01/22 Javascript
解决Vue 浏览器后退无法触发beforeRouteLeave的问题
2017/12/24 Javascript
微信小程序自定义导航栏
2018/12/31 Javascript
基于vue-cli 路由 实现类似tab切换效果(vue 2.0)
2019/05/08 Javascript
vue 递归组件的简单使用示例
2021/01/14 Vue.js
python为tornado添加recaptcha验证码功能
2014/02/26 Python
详解Python中的type()方法的使用
2015/05/21 Python
Python 绘图和可视化详细介绍
2017/02/11 Python
基于Python新建用户并产生随机密码过程解析
2019/10/08 Python
Django权限设置及验证方式
2020/05/13 Python
OpenCV 之按位运算举例解析
2020/06/19 Python
CSS3标注引用的出处和来源的方法
2020/02/25 HTML / CSS
机械设计制造专业个人求职信
2013/09/25 职场文书
银行简历自我评价
2014/02/11 职场文书
会计专业个人自我鉴定
2014/03/21 职场文书
《三顾茅庐》教学反思
2014/04/10 职场文书
2014年社区教育工作总结
2014/12/02 职场文书
经理聘任证明
2015/03/02 职场文书
深入理解 Golang 的字符串
2022/05/04 Golang
mysql查找连续出现n次以上的数字
2022/05/11 MySQL