函数四种调用模式以及其中的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 相关文章推荐
JavaScript 学习笔记(十二) dom
Jan 21 Javascript
几个比较经典常用的jQuery小技巧
Mar 01 Javascript
跨浏览器的 mouseenter mouseleave 以及 compareDocumentPosition的使用说明
May 04 Javascript
简单实例处理url特殊符号&处理(2种方法)
Apr 02 Javascript
jquery select 设置默认选中的示例代码
Feb 07 Javascript
JS+CSS实现经典的左侧竖向滑动菜单效果
Sep 23 Javascript
JQueryEasyUI框架下的combobox的取值和绑定的方法
Jan 22 Javascript
详解Vue中localstorage和sessionstorage的使用
Dec 22 Javascript
小程序ios音频播放没声音问题的解决
Jul 11 Javascript
使用localStorage替代cookie做本地存储
Sep 25 Javascript
微信浏览器左上角返回按钮监听的实现
Mar 04 Javascript
详解element上传组件before-remove钩子问题解决
Apr 08 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语法速查表
2007/01/02 PHP
PHP得到某段时间区间的时间戳 php定时任务
2012/04/12 PHP
2014过年倒计时示例
2014/01/31 PHP
php中json_encode处理gbk与gb2312中文乱码问题的解决方法
2014/07/10 PHP
Yii2实现上下联动下拉框功能的方法
2016/08/10 PHP
PHP获取HTTP body内容的方法
2018/12/31 PHP
JavaScript如何实现对数字保留两位小数一位自动补零
2015/12/18 Javascript
JavaScript 消息框效果【实现代码】
2016/04/27 Javascript
jQuery插件开发汇总
2016/05/15 Javascript
Javascript+CSS3实现进度条效果
2016/10/28 Javascript
vue 添加vux的代码讲解
2017/11/30 Javascript
Vue利用canvas实现移动端手写板的方法
2018/05/03 Javascript
解决vue-cli项目打包出现空白页和路径错误的问题
2018/09/04 Javascript
对angularJs中自定义指令replace的属性详解
2018/10/09 Javascript
KOA+egg.js集成kafka消息队列的示例
2018/11/09 Javascript
Vue最新防抖方案(必看篇)
2019/10/30 Javascript
基于JavaScript实现猜数字游戏代码实例
2020/07/30 Javascript
对django中foreignkey的简单使用详解
2019/07/28 Python
使用Django和Postgres进行全文搜索的实例代码
2020/02/13 Python
不同浏览器对CSS3和HTML5的支持状况
2009/10/31 HTML / CSS
详解HTML5中div和section以及article的区别
2015/07/14 HTML / CSS
详解通过HTML5 Canvas实现图片的平移及旋转变化的方法
2016/03/22 HTML / CSS
导出HTML5 Canvas图片并上传服务器功能
2019/08/16 HTML / CSS
纽约现代艺术博物馆商店:MoMA STORE(室内家具和杂货商品)
2016/08/02 全球购物
中学家长会邀请函
2014/01/17 职场文书
商务英语专业求职信范文
2014/01/28 职场文书
实习协议书范本
2014/04/22 职场文书
大学生应聘导游自荐信
2014/06/02 职场文书
乡镇党建工作汇报材料
2014/08/14 职场文书
交通工程专业推荐信
2014/09/06 职场文书
银行催款通知书
2015/04/17 职场文书
和谐拯救危机观后感
2015/06/15 职场文书
铁人观后感
2015/06/16 职场文书
预备党员表决心的话
2015/09/22 职场文书
2016年社区“6.26”禁毒日宣传活动总结
2016/04/05 职场文书
浅谈MySQL函数
2021/10/05 MySQL