Javascript函数调用的四种模式
一 前言
Javascript一共有四种调用模式:方法调用模式、函数调用模式、构造器调用模式以及apply调用模式。调用模式不同,对应的隐藏参数this值也会不同。
二 方法调用模式
函数作为对象的属性时,称为方法。此时函数(即方法)中的this对应是该对象。
var myObject = {
value:3,
func:function(){
alert(this.value);
}
};
// 方法调用模式,this对应的是myObject对象
myObject.func(); //3
也可以写成如下格式:
var myObject = {
value:
};
myObject.func = function() {
alert(this.value);
}
// 方法调用模式
myObject.func(); //3
上面,this对应的是myObject对象。
三 函数调用模式
函数调用模式即通常的函数调用,属于全局性调用,此时this对应的是全局对象,即Window对象。
var add = function(a, b) {
return a + b;
}
// 函数调用模式
add(,); //
上面也可以写成
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:
}; myObject.func = function() {
var helper = function() {
this.value = add(this.value, this.value);
}
// 函数调用模式
helper();
}
// 方法调用模式
myObject.func();
alert(myObject.value); </script>
答案会是6吗?仔细想想。
答案为6的程序应该是这样的:
<script type="text/javascript">
var add = function(a, b) {
return a + b;
} var myObject = {
value:
}; 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();
}
// 方法调用模式
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(, );
obj为一对象:

对于构造器调用模式,如果函数返回值不是一个对象,则返回该新对象,即this。
五 apply调用模式
// apply调用模式
var sum = add.apply(null,[,]); // this对应全局变量,即window对象
var sum2 = add.apply(myObject,[,]); //this对应为myObject对象
六 源码
Javascript函数调用的四种模式的更多相关文章
- OAuth2简易实战(一)-四种模式
1. OAuth2简易实战(一)-四种模式 1.1. 授权码授权模式(Authorization code Grant) 1.1.1. 流程图 1.1.2. 授权服务器配置 配置授权服务器中 clie ...
- 函数调用的四种方式 和 相关的 --- this指向
this:表示被调用函数的上下文对象. arguments:表示函数调用过程中传递的所有参数. 这两个参数都是隐式的函数参数.会静默传递给函数,并且和函数体内显式声明的参数一样可正常访问. argum ...
- 第164天:js方法调用的四种模式
js方法调用的四种模式 1.方法调用模式 function Persion() { var name1 = "itcast", age1 = 19, show1 = functio ...
- IdentityServer4实现Oauth2.0四种模式之隐藏模式
接上一篇:IdentityServer4实现OAuth2.0四种模式之密码模式,密码模式将用户的密码暴露给了客户端,这无疑是不安全的,隐藏模式可以解决这个问题,由用户自己在IdentityServ ...
- IdentityServer4实现OAuth2.0四种模式之授权码模式
接上一篇:IdentityServer4实现OAuth2.0四种模式之隐藏模式 授权码模式隐藏码模式最大不同是授权码模式不直接返回token,而是先返回一个授权码,然后再根据这个授权码去请求token ...
- Hibernate 查询MatchMode的四种模式
Hibernate 查询MatchMode的四种模式 MatchMode.START:字符串在最前面的位置.相当于"like 'key%'" MatchMode.END:字符串在最 ...
- Android 文件访问权限的四种模式
Linux文件的访问权限* 在Android中,每一个应用是一个独立的用户* drwxrwxrwx* 第1位:d表示文件夹,-表示文件* 第2-4位:rwx,表示这个文件的拥有者(创建这个文件的应用) ...
- 对称加密和分组加密中的四种模式(ECB、CBC、CFB、OFB)
一. AES对称加密: AES加密 分组 二. 分组密码的填充 分组密码的填充 e.g.: PKCS#5填充方式 三. 流密码: 四. 分组密码加密中的四种模式: 3.1 ECB模式 优点: 1. ...
- Asp.net的sessionState四种模式配置方案
sessionState节点的配置 web.config关于sessionState节点的配置方案,sessionState有四种模式:off,inProc,StateServer,SqlServer ...
随机推荐
- {part2}DFN+LOW(tarjan)割边
首先非树边肯定不是割边,因为去掉它DFS树不受影响,只要还能生成一棵DFS树那么图就是连通的. 然后割掉一条树边只可能造成一个点与它的父亲不连通. 那好办,也就是说这个以这个点为根的子树就是上面所说的 ...
- compile vim with lua & python support
vim在macosx 10.9默认没有带lua和python支持,因为装的有些插件是lua写的,有些是python写的,运行不起来,于是决定自己编译一个,下载vim源码,执行以下命令就可以编译vim: ...
- VBA编程常用语句
.Option Explicit '强制对模块内所有变量进行声明 Option Private Module '标记模块为私有,仅对同一工程中其它模块有用,在宏对话框中不显示 Option Compa ...
- C#压缩图片——高质量压缩方式
传入Bitmap对象,以及新图片的长宽(Bitmap.Size),这样生成的就是跟原图尺寸一致的低质量图片 public Bitmap GetImageThumb(Bitmap mg, Size ne ...
- select for update行锁
select for update行锁 2008-05-26 15:15:37 分类: Oracle Select-For Update语句的语法与select语句相同,只是在select语句的后面 ...
- SQLSERVER系统视图,系统表,sys.sql_modules视图
SQLServer中提供了相当丰富的系统视图,能够从宏观到微观,从静态到动态反应数据库对象的存储结果.系统性能.系统等待事件等等.同时 也保留了与早期版本兼容性的视图,主要差别在于SQLServer2 ...
- 安卓,支付宝app登录时,提示 服务器安全证书已过期或不可信任,请问怎么解决
安卓,支付宝app登录时,提示 服务器安全证书已过期或不可信任,请问怎么解决 请把手机时间调成当前时间.
- 64位weblogic11g安装
oracle官网上下载的weblogic就是全功能版本,下面是下载 64bit weblogic 等待下载中…… 下载完成后运行 jar 文件(不会运行jar 的请自己百度) 运行时出现如下 原因是 ...
- Kubernetes系统架构简介
1. 前言 Together we will ensure that Kubernetes is a strong and open container management framework fo ...
- ESXi查询网卡的驱动和固件版本
~ # esxcfg-nics -lName PCI Driver Link Speed Duplex MAC Address MTU Description vmnic0 0000:01:00.00 ...