|
|
調(diào)用一個對象的一個方法，以另一個對象替換當前對象(其實就是更改對象的內(nèi)部指針，即改變對象的this指向的內(nèi)容)。
Js代碼
call([thisObj[,arg1[, arg2[, [,.argN]]]]])
參數(shù)
thisObj
可選項。將被用作當前對象的對象。
arg1, arg2, , argN
可選項。將被傳遞方法參數(shù)序列。
說明
call 方法可以用來代替另一個對象調(diào)用一個方法。call 方法可將一個函數(shù)的對象上下文從初始的上下文改變?yōu)橛?thisObj 指定的新對象。如果沒有提供 thisObj 參數(shù)，那么 Global 對象被用作 thisObj。
Js代碼
復(fù)制代碼 代碼如下:
<input type="text" id="myText" value="input text"> Code
function Obj(){this.value="對象！";}
var value="global 變量";
function Fun1(){alert(this.value);}
window.Fun1(); //global 變量
Fun1.call(window); //global 變量
Fun1.call(document.getElementById('myText')); //input text
Fun1.call(new Obj()); //對象！
Js代碼
Code
復(fù)制代碼 代碼如下:
var first_object = {
num: 42
};
var second_object = {
num: 24
};
function multiply(mult) {
return this.num * mult;
}
multiply.call(first_object, 5); // returns 42 * 5
multiply.call(second_object, 5); // returns 24 * 5
二、apply方法
apply方法的第一個參數(shù)也是要傳入給當前對象的對象，即函數(shù)內(nèi)部的this。后面的參數(shù)都是傳遞給當前對象的參數(shù)。
對于apply和call兩者在作用上是相同的，但兩者在參數(shù)上有區(qū)別的。對于第一個參數(shù)意義都一樣，但對第二個參數(shù)：apply傳入的是一個參數(shù)數(shù)組，也就是將多個參數(shù)組合成為一個數(shù)組傳入，而call則作為call的參數(shù)傳入（從第二個參數(shù)開始）。
如 func.call(func1,var1,var2,var3)對應(yīng)的apply寫法為：func.apply(func1,[var1,var2,var3])同時使用apply的好處是可以直接將當前函數(shù)的arguments對象作為apply的第二個參數(shù)傳入。
Js代碼
復(fù)制代碼 代碼如下:
var func=new function(){this.a="func"}
var myfunc=function(x,y){
var a="myfunc";
alert(this.a);
alert(x + y);
}
myfunc.call(func,"var"," fun");// "func" "var fun"
myfunc.apply(func,["var"," fun"]);// "func" "var fun"
三、caller 屬性
返回一個對函數(shù)的引用，即調(diào)用了當前函數(shù)的函數(shù)體。
functionName.caller :functionName 對象是所執(zhí)行函數(shù)的名稱。
說明:
對于函數(shù)來說，caller 屬性只有在函數(shù)執(zhí)行時才有定義。 如果函數(shù)是由 JScript 程序的頂層調(diào)用的，那么 caller 包含的就是 null 。如果在字符串上下文中使用 caller 屬性，那么結(jié)果和 functionName.toString 一樣，也就是說，顯示的是函數(shù)的反編譯文本。
Js代碼
復(fù)制代碼 代碼如下:
function CallLevel(){
if (CallLevel.caller == null)
alert("CallLevel was called from the top level.");
else
alert("CallLevel was called by another function:/n"+CallLevel.caller);
}
function funCaller(){
CallLevel();
}
CallLevel();
funCaller()
四、callee屬性
返回正被執(zhí)行的 Function 對象，也就是所指定的 Function 對象的正文。
[function.]arguments.callee:可選項 function 參數(shù)是當前正在執(zhí)行的 Function 對象的名稱。
說明:
callee 屬性的初始值就是正被執(zhí)行的 Function 對象。
callee 屬性是 arguments 對象的一個成員，它表示對函數(shù)對象本身的引用，這有利于匿
函數(shù)的遞歸或者保證函數(shù)的封裝性，例如下邊示例的遞歸計算1到n的自然數(shù)之和。而該屬性
僅當相關(guān)函數(shù)正在執(zhí)行時才可用。還有需要注意的是callee擁有l(wèi)ength屬性，這個屬性有時
用于驗證還是比較好的。arguments.length是實參長度，arguments.callee.length是
形參長度，由此可以判斷調(diào)用時形參長度是否和實參長度一致。
Js代碼
復(fù)制代碼 代碼如下:
//callee可以打印其本身
function calleeDemo() {
alert(arguments.callee);
}
//用于驗證參數(shù)
function calleeLengthDemo(arg1, arg2) {
if (arguments.length==arguments.callee.length) {
window.alert("驗證形參和實參長度正確！");
return;
} else {
alert("實參長度：" +arguments.length);
alert("形參長度： " +arguments.callee.length);
}
}
//遞歸計算
var sum = function(n){
if (n <= 0)
return 1;
else
return n ＋arguments.callee(n - 1)
}
五、bind
Js代碼
復(fù)制代碼 代碼如下:
var first_object = {
num: 42
};
var second_object = {
num: 24
};
function multiply(mult) {
return this.num * mult;
}
Function.prototype.bind = function(obj) {
var method = this,
temp = function() {
return method.apply(obj, arguments);
};
return temp;
}
var first_multiply = multiply.bind(first_object);
first_multiply(5); // returns 42 * 5
var second_multiply = multiply.bind(second_object);
second_multiply(5); // returns 24 * 5
六、JS閉包(Closure)
所謂“閉包”，指的是一個擁有許多變量和綁定了這些變量的環(huán)境的表達式（通常是一個函數(shù)），因而這些變量也是該表達式的一部分。
關(guān)于閉包，最簡單的描述就是 ECMAScript 允許使用內(nèi)部函數(shù)－－即函數(shù)定義和函數(shù)表達式位于另一個函數(shù)的函數(shù)體內(nèi)。而且，這些內(nèi)部函數(shù)可以訪問它們所在的外部函數(shù)中聲明的所有局部變量、參數(shù)和聲明的其他內(nèi)部函數(shù)。當其中一個這樣的內(nèi)部函數(shù)在包含它們的外部函數(shù)之外被調(diào)用時，就會形成閉包。也就是說，內(nèi)部函數(shù)會在外部函數(shù)返回后被執(zhí)行。而當這個內(nèi)部函數(shù)執(zhí)行時，它仍然必需訪問其外部函數(shù)的局部變量、參數(shù)以及其他內(nèi)部函數(shù)。這些局部變量、參數(shù)和函數(shù)聲明（最初時）的值是外部函數(shù)返回時的值，但也會受到內(nèi)部函數(shù)的影響。
簡而言之，閉包的作用就是在out function執(zhí)行完并返回后，閉包使得Javascript的垃圾回收機制GC不會收回out function所占用的資源，因為out function的內(nèi)部函數(shù)inner function的執(zhí)行需要依賴out function中的變量。
閉包的兩個特點：
1、作為一個函數(shù)變量的一個引用 - 當函數(shù)返回時，其處于激活狀態(tài)。
2、一個閉包就是當一個函數(shù)返回時，一個沒有釋放資源的棧區(qū)。
例1：
Html代碼
復(fù)制代碼 代碼如下:
<script type="text/Javascript">
function setupSomeGlobals() {
// Local variable that ends up within closure
var num = 666;
// Store some references to functions as global variables
gAlertNumber = function() { alert(num); }
gIncreaseNumber = function() { num++; }
gSetNumber = function(x) { num = x; }
}
</script>
<button onclick="setupSomeGlobals()">生成 - setupSomeGlobals()</button>
<button onclick="gAlertNumber()">輸出值 - gAlertNumber()</button>
<button onclick="gIncreaseNumber()">增加 - gIncreaseNumber()</button>
<button onclick="gSetNumber(5)">賦值5 - gSetNumber(5)</button>
例2：
Html代碼
復(fù)制代碼 代碼如下:
<script type="text/Javascript">
function newClosure(someNum, someRef) {
// Local variables that end up within closure
var num = someNum;
var anArray = [1,2,3];
var ref = someRef;
return function(x) {
num += x;
anArray.push(num);
alert('num: ' + num +
' nanArray ' + anArray.toString() +
' nref.someVar ' + ref.someVar);
}
}
var closure1 = newClosure(40, {someVar:' never-online'})
var closure2 = newClosure(99, {someVar:' BlueDestiny'})
closure1(4)
closure2(3)
</script>
例3：
Js代碼
復(fù)制代碼 代碼如下:
<script language="Javascript">
/* 聲明一個全局變量 - getImgInPositionedDivHtml - 并將一次調(diào)用一個外部函數(shù)表達式返回的內(nèi)部函數(shù)賦給它。
這個內(nèi)部函數(shù)會返回一個用于表示絕對定位的 DIV 元素包圍著一個 IMG 元素 的 HTML 字符串，這樣一來，
所有可變的屬性值都由調(diào)用該函數(shù)時的參數(shù)提供：
*/
var getImgInPositionedDivHtml = (function(){
/* 外部函數(shù)表達式的局部變量 - buffAr - 保存著緩沖數(shù)組。這個數(shù)組只會被創(chuàng)建一次，生成的數(shù)組實例對內(nèi)部函數(shù)而言永遠是可用的
因此，可供每次調(diào)用這個內(nèi)部函數(shù)時使用。
其中的空字符串用作數(shù)據(jù)占位符，相應(yīng)的數(shù)據(jù)
將由內(nèi)部函數(shù)插入到這個數(shù)組中：
*/
var buffAr = [
'<div id="',
'', //index 1, DIV ID 屬性
'" style="position:absolute;top:',
'', //index 3, DIV 頂部位置
'px;left:',
'', //index 5, DIV 左端位置
'px;width:',
'', //index 7, DIV 寬度
'px;height:',
'', //index 9, DIV 高度
'px;overflow:hidden;/"><img src=/"',
'', //index 11, IMG URL
'/" width=/"',
'', //index 13, IMG 寬度
'/" height=/"',
'', //index 15, IMG 調(diào)蓄
'/" alt=/"',
'', //index 17, IMG alt 文本內(nèi)容
'/"><//div>'
];
/* 返回作為對函數(shù)表達式求值后結(jié)果的內(nèi)部函數(shù)對象。
這個內(nèi)部函數(shù)就是每次調(diào)用執(zhí)行的函數(shù)
- getImgInPositionedDivHtml( ... ) -
*/
return (function(url, id, width, height, top, left, altText){
/* 將不同的參數(shù)插入到緩沖數(shù)組相應(yīng)的位置：
*/
buffAr[1] = id;
buffAr[3] = top;
buffAr[5] = left;
buffAr[13] = (buffAr[7] = width);
buffAr[15] = (buffAr[9] = height);
buffAr[11] = url;
buffAr[17] = altText;
/* 返回通過使用空字符串（相當于將數(shù)組元素連接起來）
連接數(shù)組每個元素后形成的字符串：
*/
return buffAr.join('');
}); //:內(nèi)部函數(shù)表達式結(jié)束。
})();//自調(diào)用
alert(getImgInPositionedDivHtml);//顯示返回的函數(shù)
alert(getImgInPositionedDivHtml("img.gif","img",100,50,0,0,"Test"));
</script>
說明：其中的關(guān)鍵技巧在于通過執(zhí)行一個單行（in-line）函數(shù)表達式創(chuàng)建一個額外的執(zhí)行環(huán)境，而將該函數(shù)表達式返回的內(nèi)部函數(shù)作為在外部代碼中使用的函數(shù)。此時，緩沖數(shù)組被定義為函數(shù)表達式的一個局部變量。這個函數(shù)表達式只需執(zhí)行一次，而數(shù)組也只需創(chuàng)建一次，就可以供依賴它的函數(shù)重復(fù)使用。
七、原型鏈
ECMAScript 為 Object 類型定義了一個內(nèi)部 [[prototype]] 屬性。這個屬性不能通過腳本直接訪問，但在屬性訪問器解析過程中，則需要用到這個內(nèi)部[[prototype]] 屬性所引用的對象鏈－－即原型鏈。可以通過一個公共的 prototype 屬性，來對與內(nèi)部的 [[prototype]] 屬性對應(yīng)的原型對象進行賦值或定義。
例1：
Js代碼
復(fù)制代碼 代碼如下:
<script language="Javascript">
function NumObject(formalParameter){
this.testNumber = formalParameter;
}
function StrObject(formalParameter){
this.testString = formalParameter;
}
//用 NumObject類的實例替換了所有與 StrObject類的實例相關(guān)聯(lián)的原型。
StrObject.prototype =new NumObject(6);
var objRef = new StrObject( "String_Value" );
//當某個屬性訪問器嘗試讀取由 objectRef 所引用的對象的屬性值時，整個原型鏈都會被搜索。
//不論是在對象或?qū)ο蟮脑椭校x取命名屬性值的時候只返回首先找到的屬性值。而當為對象的命名屬性賦值時，如果對象自身不存在該屬性則創(chuàng)建相應(yīng)的屬性。
alert(objRef.testString);//output "String_Value"
alert(objRef.testNumber);//output "6"
alert(objRef.toString);
//StrObject 的實例擁有一個原型鏈。該鏈中的第一個對象是在創(chuàng)建后被指定給 StrObject 構(gòu)造函數(shù)的 prototype 屬性的 NumObject 的一個實例。NumObject 的實例也有一個原型，即與 Object.prototype 所引用的對象對應(yīng)的默認的 Object 對象的原型。最后， Object.prototype 有一個值為 null 的原型，因此這條原型鏈到此結(jié)束。
objRef.testNumber = 3;//對象自身不存在該屬性則創(chuàng)建相應(yīng)的屬性
alert(objRef.testNumber);//自身有了屬性，屬性訪問器不會再進一步搜索原型鏈
alert(NumObject.prototype.isPrototypeOf(objRef));// output "true"
</script>
0 0 0
JavaScript技術(shù)：js apply/call/caller/callee/bind使用方法與區(qū)別分析，轉(zhuǎn)載需保留來源！
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯(lián)系我們修改或刪除，多謝。
