Javascript函数调用的四种模式

Javascript一共有四种调用模式:方法调用模式、函数调用模式、构造器调用模式以及apply调用模式。调用模式不同,对应的隐藏参数this值也会不同。

  函数作为对象的属性时,称为方法。此时函数(即方法)中的this对应是该对象。

复制代码
var myObject = {value:3,
  func:function(){
    alert(this.value);
  }
   };

myObject.func();  //3
复制代码

  也可以写成如下格式:

复制代码
var myObject = {value:3
};myObject.func = function() {alert(this.value);
}

myObject.func();  //3
复制代码

  上面,this对应的是myObject对象。

 

  三  函数调用模式

  函数调用模式即通常的函数调用,属于全局性调用,此时this对应的是全局对象,即Window对象。

var add = function(a, b) {return a + b;
}add(3,4);    //7

  上面也可以写成

window.add = function(a, b) {return a + b;
}

add(3,4); //7

  下面来看看下面的测试题,以检验你是否了解了this。

复制代码
<script type="text/javascript">var add = function(a, b) {return a + b;}var myObject = {value:3};myObject.func = function() {var helper = function() {this.value = add(this.value, this.value); 
        }helper();//alert(this.value);}
   myObject.func();alert(myObject.value);</script>
复制代码

  答案会是6吗?仔细想想。

  答案为6的程序应该是这样的:

复制代码
<script type="text/javascript">var add = function(a, b) {return a + b;}var myObject = {value:3};myObject.func = function() {var that = this; // this对应myObject对象   (1)var helper = function() {//this.value = add(this.value, this.value); //这里调用模式为函数调用模式,而非方法调用模式,所以this对应全局对象   (2)that.value = add(that.value, that.value);
        }helper();//alert(this.value);}myObject.func();alert(myObject.value);</script>
复制代码

  (1)处this在firefox调试如下:

  

  (2)处this在firefox调试如下:

  

 

  四  构造器调用模式

  若在函数前面通过new 来调用,其实是生成一新对象,this自然指向该新对象。

var add = function(a, b) {return a + b;
}var obj = new add(3, 4);

  obj为一对象:

  

 

  五  apply调用模式

apply方法有个参数,第一个是要绑定给this的值,第二个是一个参数数组。
var sum = add.apply(null,[3,4]);       // this对应全局变量,即window对象
var sum2 = add.apply(myObject,[3,4]);  //this对应为myObject对象

 

  六  源码

   源码下载。

 

 出处:http://www.cnblogs.com/chenyuming507950417/

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/300458.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

我背着女朋友,用 Python 偷偷抓取了她的行踪

全世界只有3.14 %的人关注了青少年数学之旅1目 标 场 景有时候女朋友一个人在外面玩耍&#xff0c;问她在哪个地方&#xff0c;就是不告诉我。但是&#xff0c;你又很想知道女朋友的「位置」&#xff0c;这该如何是好&#xff1f;其实你可以这样套路女朋友&#xff0c;假装自己…

ASP.NET Core 中的规约模式(Specification Pattern )——增强泛型仓储模式

原文链接&#xff1a;https://codewithmukesh.com/blog/specification-pattern-in-aspnet-core/在本文中&#xff0c;我们将讨论在 ASP.NET Core 应用程序中实现规约模式以及它如何增强现有的泛型仓储模式。我们将从头开始构建具有泛型仓储模式、Entity Framework Core的 ASP.N…

动画演示男性结扎手术 | 今日趣图

全世界只有3.14 % 的人关注了青少年数学之旅流鼻涕了怎么办&#xff1f;医学教育徐琦招聘程序员啦知识萌死大丧失&#xff1b;图熊本科技把下列句子补充完整图三好学生李宇幼年的大象喝水并不会使用鼻子而是趴在水里直接用嘴大喝一顿它们9个月之后才会懂得用鼻子喝水科普斯基请…

AspNetCoreMassTransit Courier实现分布式事务

在之前的一篇博文中&#xff0c;CAP框架可以方便我们实现非实时、异步场景下的最终一致性&#xff0c;而有些用例总是无法避免的需要在实时、同步场景下进行&#xff0c;可以借助Saga事务来解决这一困扰。在一些博文和仓库中也搜寻到了.Net下实现Saga模式的解决方案MassTransit…

设置列表字段为主键

转贴:Sample event handler to set a field as a pr imary key (enforce no duplicates) Got this as a request from a reader- how to prevent users from adding items with same titles as ones that already exist in the list. Codeusing System;using System.Collectio…

被学校辞退、拒绝FB后:语音识别大牛Povey确认兼职北京初创公司,称主业还选中国...

全世界只有3.14 % 的人关注了青少年数学之旅由于5月的学生抗议事件&#xff0c;语音识别领域著名学者、原约翰霍普金斯大学教授Daniel Povey被学校辞退。随后&#xff0c;Daniel Povey准备进入Facebook从事语音识别系统的开发&#xff0c;但是由于Facebook要对其进行长达6周的审…

dotnet中的counters说明(二)

上篇说了System.Runtime&#xff0c;它负责应用运行的环境资源的收集&#xff0c;这篇要继续说AspNetCore的Hosting,Http.Connections和Server.Kestrel三个计数器。同时&#xff0c;下面指标各项()里的项目是--counters 参数[]里的项&#xff0c;用逗号分隔多项指标。Microsoft…

有这些好习惯,可以让你悄悄变优秀

全世界只有3.14 %的人关注了青少年数学之旅这是一个普遍无趣的时代&#xff0c;很多人看似忙到起飞内在却空虚迷茫。今天我们为你诚意推荐几个公众号它们会成为你生活的一剂调味料&#xff0c;让你做一个学识丰富、灵魂有趣的人。快来关注&#xff0c;开启精彩的生活吧&#xf…

java设置access-allow_Java Web如何设置多个Access-Control-Allow-Origin

有没有办法让Access-Control-Allow-Origin header允许设置multiple cross-domains呢&#xff1f;如果设置response.addHeader("Access-Control-Allow-Origin","*");感觉这个接口太开放了&#xff0c;不太安全。 我想只设置自己指定的若干个域名或者端口可以…

微软 MS Learn 上线 Blazor 入门教程

微软官方学习网站 MS Learn 上线了 Blazor 入门教程模块&#xff0c;希望通过这个课程&#xff0c;让开发人员了解如何设置开发环境&#xff0c;以及如何使用 Blazor、Visual Studio Code 和 C# 生成你的首个 Web 应用。Build a web app with Blazor - Learndocs.microsoft.com…

Type Casting

Type Casting C : Documents : C Language Tutorial : Type Casting Search: userpass[register] javascript and cookies required C Language TutorialIntroduction?Instructions for useBasics of C?Structure of a program?Variables. Data Types.?Constants?Oper…

世界最牛实验室,堪称诺贝尔奖孵化器!到底是个怎样神奇的存在?!

▲ 点击查看随着诺贝尔各个奖项陆陆续续的公布&#xff0c;卡文迪许实验室&#xff0c;又开始重回大众视野。在这个世界最牛实验室之一的实验室里&#xff0c;仅仅过去了一百多年&#xff0c;就不断涌现出一批又一批世界一流的科学家&#xff1a;把电与磁进行有机统一的麦克斯…

开源的负载测试/压力测试工具 NBomber

负载测试和压力测试对于确保 web 应用的性能和可缩放性非常重要。尽管它们的某些测试是相同的&#xff0c;但目标不同。负载测试&#xff1a;测试应用是否可以在特定情况下处理指定的用户负载&#xff0c;同时仍满足响应目标。应用在正常状态下运行。压力测试&#xff1a;在极端…

男人都应该懂的一张图。。 | 今日趣图

全世界只有3.14 % 的人关注了青少年数学之旅美国人为了教民众如何辨别韩国人制作的韩国女性标准照左右军事成为一个有钱人的概率有多高&#xff1f;最新版男人都该懂的汽车品牌从属关系图twi:NOCO_1002肥胖和骨架没有必然联系800斤胖子的X射线照 科普君XueShu 雪树来猜一猜这是…

学做菜咯

以前在QQ空间发的贴&#xff0c;现在转到这边来&#xff0c;嘿嘿。青蛙达 - 07月28日- 14时28分今天中午做我个人最喜欢的菜之一《咖喱鸡饭》 早上到超市买了&#xff1a; 大蒜头、洋葱、南瓜、鸡翅膀、咖喱粉、胡椒粉、白糖、桂皮 回来发现原来把辣椒粉当成胡椒粉买回来了....…

Facebook 中国程序员之死

全世界只有3.14 % 的人关注了青少年数学之旅9 月 19 日&#xff0c;一位 Facebook 软件工程师从加州门洛帕克&#xff08;Menlo Park&#xff09;总部四楼纵身跳下&#xff0c;结束年轻的生命。Facebook 新闻发言人证实确有其事&#xff0c;并说公司将会联系员工家人。门洛帕克…

[导入]数据库物理模型设计的其他模式之继承模式

连载之7原创&#xff1a;胖子刘&#xff08;转载请注明作者和出处&#xff0c;谢谢&#xff09;数据库物理模型设计的其他模式除了上面提到的四种主要设计模式&#xff0c;还有一些其他模式&#xff0c;在某些项目中可能会用到&#xff0c;在这里先简单做个说明&#xff0c;暂不…

“我数学太烂,但高考136分!”刷完上万道题后,我找到2个月多考58分的捷径…...

全世界只有3.14 %的人关注了青少年数学之旅01难上天的高考试卷&#xff0c;我逆袭考到136分&#xff01;我叫刘辉&#xff0c;来自湖北省的某个县城&#xff0c;今年我数学考到了136分的好成绩&#xff0c;成功被一所985高校录取。↓我的高考成绩↓但回想一年之前&#xff0c;我…

[Forward] 因为火炬,所以迟到,工资照扣

今天跟往常一样,到香蜜湖等230 看到深南大道主道那边站了一名JC叔叔 在前面的主辅岔道口看到有交J叔叔...对面又大堵车...心想大事不妙..又要交通管制了......两hui期间因为交通管制让我第一个月上班就来了一次迟到 这时候是8点钟多一点开始管制.....很后悔没有上到最后一…

三分钟总览微软任务并行库TPL

点击上方蓝字进行关注有小伙伴问我每天忽悠的TPL是什么&#xff1f;☹️ 这次站位高一点&#xff0c;严肃讲一讲。引言俗话说&#xff0c;不想开飞机的程序员不是一名好爸爸&#xff1b;作为微软技术栈的老鸟&#xff0c;一直将代码整洁之道奉为经典&#xff0c; 优秀的程序员将…