js 函数的调用模式
1、函数调用
调用一个函数将暂停当前函数的执行,传递控制权和参数给新函数。除了函数声明时定义的形参,每个函数还接受两个附加的参数:this和arguments(arguments并不是一个真正的数组,它拥有length属性,但它缺少数组的所有方法)。参数this在面向对象编程中非常重要,它的值取决于调用的模式。
在js中一共有四种调用模式:方法调用模式、函数调用模式、构造器调用模式和apply调用模式。这些模式在如何初始化关键参数this上存在差异。arguments的个数取决于函数定义时候形参的个数,如果调用函数时,传递的形参与函数定义的参数个数不匹配不会导致运行错误,调用时传递的参数过多,
超出的参数会被忽略,如果过少,缺失的值被undefined代替。
2、方法调用模式
var myObj = {
value:0,
increment:function(val){
this.value += typeof val ==="number" ? val : 1;//this为myObj对象
}
};
myObj.increment();
document.write(myObj.value);//
myObj.increment(2);
document.write(myObj.value);//
方法可以使用this去访问,所以它能从对象取值或修改该对象。this到对象的绑定发生在调用的时候。这个“超级”迟绑定使得函数可以对this高度复用。通过this可取得它们所属对象的上下文的方法称为公共方法。
3、函数调用模式
var name = "zhangsan";//aa变量加载到了window对象上
function test(){
function test1(){
document.write(this.name);//zhangsan,this为window对象
};
test1();
}
test();
当函数以此模式调用时,this被绑定到全局对象。这是语言设计的一个错误。倘若语言设计正确,当内部函数被调用时,this应该仍然绑定到外部函数的this变量。这个设计错误的后果是方法不能利用内部函数来帮助它工作,因为内部函数的this被绑定了错误的值,所以不能共享该方法对对象的访问权。
幸运的是,有一个很容易的解决方案:如果该方法定义一个变量并给它赋值为this,那么内部函数就可以通过那个变量访问到this,按照约定,我给那个变量命令为that
//目的:使用add方法对数值进行相加
//给myObject增加一个double方法。
myObject.double = function(){
var that = this;//解决方法
var helper = function(){
that.value = add(that.value,that.value);//add方法为两数字相加
};
helper();//以函数的形式调用helper
};
//以方法模式调用double
myObject.double();
document.write(myObject.getValue());//6,这样helper方法可以使用this
4、构造器调用模式
对象实例调用原型中的方法时,该方法可以使用this访问其构造函数内的属性或方法。
//创建一个名为Quo的构造函数,它构造一个带有status属性的对象。
var Quo = function (str,name){
this.status = str;
this.name = name;
};
//给Quo的所有实例提供一个名为get_status的公共方法。
Quo.prototype.get_status = function(){
return this.status;//this能访问到status
};
Object.prototype.get_name = function(){
return this.name;//能访问到name
};
//构造一个Quo实例
var myQuo = new Quo("confused","zhangsan");
//confused,document.write()和document.writeln都是js向客户端写入的方法,writeln是以行方式输出的,但并不是指页面实际效果中的换行,即页面的实际效果是没有换行的。
document.writeln(myQuo.get_status());
document.write(myQuo.get_name());//zhangsan
5、Apply调用模式
apply方法让我们构建一个参数数组并用其去调用函数。它也允许我们选择this的值。
apply方法接受两个参数,第一个是将被绑定给this的值,第二个就是一个参数数组。
var myStatus = {
status:'A-OK'
};
//myStatus并没有继承自Ouo.prototype。但我们可以在myStatus上调用get_status方法,尽管myStatus并没有一个名为get_status的方法
var st = Quo.prototype.get_status.apply(myStatus);//A-OK
var st1 = myQuo.get_status.apply(myStatus);//A-OK
js 函数的调用模式的更多相关文章
- JavaScript函数的调用模式
我们说一个函数的调用模式是作为一个函数来调用,是要与其它三种调用模式做区分函数其他的三种调用: 方法调用模式,构造器调用模式,apply/call调用模式. 方法的调用模式: var obj={ fu ...
- js函数的调用问题
1.js函数的调用方式有三种.请问以下“二”处的几行代码有什么猫腻? //一 事件调用 btn.onclick=fn; //二 直接调用(window调用) fn(); //自上而下解析到这一行的时候 ...
- JS高级——函数的调用模式
函数调用模式一共有四种 <script> //1.函数模式 //this指向window全局对象 //2.方法模式 //this指向调用这个方法的对象 //3.构造函数模式 //this ...
- JS函数-我调用自己试试看
前言 最近在读<JavaScript语言精粹>,对递归函数有了进一步的认识,希望总结下来: 递归是一种强大的编程技术,他把一个问题分解为一组相似的子问题,每一问题都用一个寻常解去解决.递归 ...
- flash、js 函数 互相调用
js调用flex函数 flex 利用ExternalInterface.addCallback(“注册的方法名”,As中的函数名)进行注册 js中,用document.getElementById(“ ...
- js 四种调用模式和this的关系总结
更新: 这篇又简单又明了啊喂 首先看这一篇, 很简单很清楚了,http://www.ruanyifeng.com/blog/2010/04/using_this_keyword_in_javascri ...
- js函数简单调用
<script> //最简单的调用 //这是JavaScript DOM编程艺术(第2版)关于函数的原码 function convertToCelsius(temp) { var res ...
- VC与JavaScript交互(二) --- 调用JS函数
这一章,我们来动手实践VC调用JS函数. 我们动手写一个HTML,其中包含这样一段JS代码: //[html] <script type="text/javascript"& ...
- JavaScript函数的各种调用模式
函数是JavaScript世界里的第一公民,换句话来说,就是我们如果可以精通JavaScript函数的使用,那么对JavaScript的运用可以更游刃有余了.熟悉JavaScript的人应该都知道,同 ...
随机推荐
- You don't have permission to access / on this server
配置虚拟主机的时候,里面加上如下: <Directory "/var/www/html"> Options Indexes FollowSymLinks AllowOv ...
- Linux五种IO模型
http://www.cnblogs.com/renxs/p/3683189.html
- 简单的div元素拖拽到div
drag1 drag2 drag3 代码如下: <!DOCTYPE HTML> <html> <head> <title>div拖拽到div</t ...
- Golang学习 - path/filepath 包
------------------------------------------------------------ filepath 中的函数会根据不同平台做不同的处理,比如路径分隔符.卷名等. ...
- Linux根文件系统的制作
转载:http://www.cnblogs.com/hnrainll/archive/2011/06/09/2076655.html 1. 根文件系统 文件系统是包括在一个磁盘(包括光盘.软盘.闪盘及 ...
- c++ 构造函数,拷贝构造函数,析构函数与赋值操作符
题目: 为下面的Rectangle类实现构造函数,拷贝构造函数,赋值操作符,析构函数. class Shape { int no; }; class Point { int x; int y; }; ...
- C#实现万年历(农历、节气、节日、星座、属相、生肖、闰年等)
C# 万年历 农历 节气 节日 星座 星宿 属相 生肖 闰年月 时辰等,代码如下: using System.Collections.Generic; using System.Text; using ...
- Mybank
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...
- Frogs' Neighborhood
Frogs' Neighborhood Time Limit: 5000MS Memory Limit: 10000K Total Submissions: 7920 Accepted: 33 ...
- android 内存优化以及性能优化相关问题
最近做一个android 的应用程序 总是出现内存高 和cpu高的问题困扰了好多天. 下面为自己从网上总结的和自己找到的问题. 1. WebView 控件: 使用了 WebView 控件一定要注意清 ...