函数四种调用模式以及其中的this指向


Posted in Javascript onJanuary 16, 2017

第一种:函数直接执行模式

function add(a,b){
   console.log(this);
   return a+b;
  }
 add(10,20)//this===window

第二种:对象方法的调用模式

var obj={
   name:'aaa',
   age:20,
   said:function(){
    console.log(this);
   }
  }
obj.said();//this===obj,此处this指代被调用者

第三种:构造器的调用模式

function School(){
   this.said=function(){
    console.log(this);
   }
  }
var nanj=new School();
nanj.said();//对象调用自己的方法,this===nanj,类似上面

第四种:call和apply调用模式

function change(a,b){
   this.detial=a*b;
   console.log(this);
  }
  var p={};
  change.call(p,4,5);//此处的this===p
  console.log(p.detial);
  var q=[];
  change.call(q,5,10)//this===q
  console.log(q.detial);
  //apply和call一样的用法,只不过apply第二个参数用数组进行传递
  var arr=[];
  change.apply(arr,[10,10]);//this===arr
  console.log(arr.detial);
  var str={};
  change.apply(str,[20,20]);//this===str
  console.log(str.detial);

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
JS返回上一页实例代码通过图片和按钮分别实现
Aug 16 Javascript
JavaScript的setAttribute兼容性问题解决方法
Nov 11 Javascript
javascript的函数作用域
Nov 12 Javascript
javascript实现数字倒计时特效
Mar 30 Javascript
Bootstrap输入框组件简单实现代码
Mar 06 Javascript
详解使用angularjs的ng-options时如何设置默认值(初始值)
Jul 18 Javascript
vue组件学习教程
Sep 09 Javascript
javascript性能优化之分时函数的介绍
Mar 28 Javascript
如何在vue里面优雅的解决跨域(路由冲突问题)
Jan 20 Javascript
vue项目前端知识点整理【收藏】
May 13 Javascript
javascript实现计算器功能
Mar 30 Javascript
如何实现echarts markline标签名显示自己想要的
Jul 20 Javascript
js实现导航栏中英文切换效果
Jan 16 #Javascript
Bootstrap面板使用方法
Jan 16 #Javascript
codeMirror插件使用讲解
Jan 16 #Javascript
微信小程序 图片边框解决方法
Jan 16 #Javascript
微信小程序 scroll-view隐藏滚动条详解
Jan 16 #Javascript
微信小程序 video详解及简单实例
Jan 16 #Javascript
Vue系列:通过vue-router如何传递参数示例
Jan 16 #Javascript
You might like
php 无法载入mysql扩展
2010/03/12 PHP
具有时效性的php加密解密函数代码
2013/06/19 PHP
Yii使用migrate命令执行sql语句的方法
2016/03/15 PHP
php cli模式下获取参数的方法
2017/05/05 PHP
PHP长连接实现与使用方法详解
2018/02/11 PHP
在Laravel5.6中使用Swoole的协程数据库查询
2018/06/15 PHP
javascript call方法使用说明
2010/01/11 Javascript
SeaJS入门教程系列之完整示例(三)
2014/03/03 Javascript
关于编写性能高效的javascript事件的技术
2014/11/28 Javascript
jQuery满意度星级评价插件特效代码分享
2015/08/19 Javascript
jquery实现鼠标经过显示下划线的渐变下拉菜单效果代码
2015/08/24 Javascript
JS实现上下左右对称的九九乘法表
2016/02/22 Javascript
浅谈JS继承_借用构造函数 & 组合式继承
2016/08/16 Javascript
基于jQuery和Bootstrap框架实现仿知乎前端动态列表效果
2016/11/09 Javascript
JS实现的表头列头固定页面功能示例
2017/01/10 Javascript
移动端网页开发调试神器Eruda的介绍与使用技巧
2017/10/30 Javascript
JS模拟实现哈希表及应用详解
2018/05/04 Javascript
详解jQuery中的getAll()和cleanData()
2019/04/15 jQuery
jquery 验证用户名是否重复代码实例
2019/05/14 jQuery
[50:58]2018DOTA2亚洲邀请赛3月29日 小组赛A组OpTic VS Newbee
2018/03/30 DOTA
使用Python判断质数(素数)的简单方法讲解
2016/05/05 Python
python 使用get_argument获取url query参数
2017/04/28 Python
Python实现多条件筛选目标数据功能【测试可用】
2018/06/13 Python
python中字符串内置函数的用法总结
2018/09/13 Python
Python里字典的基本用法(包括嵌套字典)
2019/02/27 Python
python使用opencv实现马赛克效果示例
2019/09/28 Python
tensorflow求导和梯度计算实例
2020/01/23 Python
Python实现动态给类和对象添加属性和方法操作示例
2020/02/29 Python
利用Python实现字幕挂载(把字幕文件与视频合并)思路详解
2020/10/21 Python
高山背包:High Sierra
2017/11/23 全球购物
英国领先的在线高尔夫商店:Scottsdale Golf
2019/08/26 全球购物
介绍一下Java的事务处理
2012/12/07 面试题
统计员岗位职责
2013/11/14 职场文书
学习保证书范文
2014/04/30 职场文书
2015年物资管理工作总结
2015/05/20 职场文书
优秀范文:《但愿人长久》教学反思3篇
2019/10/24 职场文书