跟我學(xué)習(xí)javascript的arguments對(duì)象
1、什么是arguments
arguments 是是JavaScript里的一個(gè)內(nèi)置對(duì)象,它很古怪,也經(jīng)常被人所忽視,但實(shí)際上是很重要的。所有主要的js函數(shù)庫都利用了arguments對(duì)象。所以agruments對(duì)象對(duì)于javascript程序員來說是必需熟悉的。在javascript函數(shù)體內(nèi),標(biāo)識(shí)符arguments具有特殊含義。它是調(diào)用對(duì)象的一個(gè)特殊屬性,用來引用Arguments對(duì)象。Arugments對(duì)象就像數(shù)組,注意這里只是像并不是哈。
javascript函數(shù)體內(nèi),arguments像數(shù)組(并不是真的數(shù)組,是一個(gè)Arguments對(duì)象,再次強(qiáng)調(diào))一樣,有l(wèi)ength屬性,可以代表傳給函數(shù)的參數(shù)的個(gè)數(shù)。
javascript中Arguments對(duì)象是函數(shù)的實(shí)際參數(shù),arguments對(duì)象的長度是由實(shí)參個(gè)數(shù)而不是形參個(gè)數(shù)決定的。形參是函數(shù)內(nèi)部重新開辟內(nèi)存空間存儲(chǔ)的變量,但是其與arguments對(duì)象內(nèi)存空間并不重疊。
js不會(huì)主動(dòng)為你判斷你到底給函數(shù)傳了多少個(gè)參數(shù),如果你多傳了,多余的部分就沒有被使用,如果你少傳了,那么沒傳的參數(shù)值就是undefined.所以我們可以借助arguments的length屬性來檢測調(diào)用函數(shù)時(shí)是否使用了正確數(shù)目的實(shí)際參數(shù),因?yàn)閖avascript是不會(huì)為你做這些事的
function f(x,y,z) { //首先檢查傳遞的參數(shù)數(shù)量是否正確 if(arguments.length != 3) { throw new Error("function f called with " + arguments.length + "arguments"); } //下面運(yùn)行真正的函數(shù) }
2、arguments創(chuàng)建可變參數(shù)列表函數(shù)
arguments還為我們提供了這樣一種可能,就是為一個(gè)函數(shù)傳任意數(shù)目的實(shí)際參數(shù):
比如說,我想用一個(gè)display()函數(shù)來計(jì)算每個(gè)公司的員工工資總額,對(duì),沒錯(cuò),你傳多少參數(shù)都行,但是前提是你要傳數(shù)字,因?yàn)槲以诤瘮?shù)內(nèi)部懶得判斷了。
function display(){ var sum=0; //總額 for(var i=0;i<arguments.length;i++){ sum+=arguments[i]; } document.write(sum+'<br>'); } //A公司 display(10000,2000,5000); //B公司 display(1000,2000,5000,8000,10000);
怎么樣?這個(gè)方法很巧妙吧?
說明一下arguments與真正傳的形式參數(shù)是一致的:
對(duì)于arguments和值都存在的情況下,兩者值是同步的改變其中一個(gè)值,即改變了二者所有的值
function f(a, b, c){ alert(arguments.length); // result: "2" a = 100; alert(arguments[0]); // result: "100" arguments[0] = "qqyumidi"; alert(a); // result: "qqyumidi" alert(c); // result: "undefined" c = 2012; alert(arguments[2]); // result: "undefined" } f(1, 2);
3、永遠(yuǎn)不要修改arguments對(duì)象
函數(shù)中聲明的參數(shù)和arguments之間的聯(lián)系很脆弱,每個(gè)聲明的參數(shù)實(shí)際上只是對(duì)arguments對(duì)象中對(duì)應(yīng)位置的一個(gè)引用。
值得注意的是,在ES5的strict mode中,函數(shù)聲明的參數(shù)并不會(huì)引用arguments:
function strict(x) { "use strict"; arguments[0] = "modified"; return x === arguments[0]; } function nonstrict(x) { arguments[0] = "modified"; return x === arguments[0]; } strict("unmodified"); // false nonstrict("unmodified"); // true
正因?yàn)樵趕trict和非strict模式下,函數(shù)聲明的參數(shù)和arguments的關(guān)系不一致,所以為了避免出現(xiàn)問題,不去修改arguments對(duì)象才是最安全的做法。
如果確實(shí)需要修改arguments對(duì)象,那么可以首先賦值一份arguments對(duì)象:
var args = [].slice.call(arguments);
當(dāng)slice方法不接受任何參數(shù)的時(shí)候,就會(huì)執(zhí)行復(fù)制操作,得到的args也是一個(gè)真正的數(shù)組對(duì)象。同時(shí),args和函數(shù)聲明的參數(shù)之間也沒有任何聯(lián)系了,對(duì)它進(jìn)行操作是安全的。
4、一個(gè)變量來保存arguments的引用
假設(shè)需要一個(gè)API用來遍歷若干元素,像下面這樣:
var it = values(1, 4, 1, 4, 2, 1, 3, 5, 6); it.next(); // 1 it.next(); // 4 it.next(); // 1
相應(yīng)的實(shí)現(xiàn)可以是:
function values() { var i = 0, n = arguments.length; return { hasNext: function() { return i < n; }, next: function() { if (i >= n) { throw new Error("end of iteration"); } return arguments[i++]; // wrong arguments } }; }
但是執(zhí)行的實(shí)際情況卻是:
var it = values(1, 4, 1, 4, 2, 1, 3, 5, 6); it.next(); // undefined it.next(); // undefined it.next(); // undefined
原因在于:對(duì)于arguments對(duì)象的賦值是隱式完成的。在next方法內(nèi)部,使用了arguments,然而此arguments和values方法開始處的arguments并不是一個(gè)對(duì)象。這里的arguments對(duì)象是函數(shù)next()的。
解決方法也很簡單,就是將需要訪問的arguments使用另外一個(gè)變量進(jìn)行引用。然后通過閉包的性質(zhì)在其嵌套的函數(shù)中進(jìn)行訪問就可以了,像下面這樣:
function values() { var i = 0, n = arguments.length, a = arguments; return { hasNext: function() { return i < n; }, next: function() { if (i >= n) { throw new Error("end of iteration"); } return a[i++]; } }; } var it = values(1, 4, 1, 4, 2, 1, 3, 5, 6); it.next(); // 1 it.next(); // 4 it.next(); // 1
5、arguments對(duì)象的callee屬性:
arguments的callee屬性是用來引用當(dāng)前正在執(zhí)行的函數(shù),這對(duì)未命名的函數(shù)調(diào)用自身非常有好處。
首先用命名函數(shù)表達(dá)式實(shí)現(xiàn)遞歸的函數(shù):
//函數(shù)直接量 指定函數(shù)名 遞歸函數(shù) var result = function fact(x){ if(x<=1) return 1; else return x*fact(x-1); };
那里面,我提到可以為函數(shù)直接量以函數(shù)名。這樣實(shí)現(xiàn)遞歸可以很方便的調(diào)用自己。
現(xiàn)在用arguments的這個(gè)callee同樣可以簡單的實(shí)現(xiàn)
//用函數(shù)直接量,采用arguments.callee屬性實(shí)現(xiàn)遞歸函數(shù) var result = function(x){ if(x<=1) return 1; return x*arguments.callee(x-1); };
在最后提醒大家一點(diǎn),既然這個(gè)arguments這么厲害,那么我們就不要為變量命名為arguments了,事實(shí)上arguments是javascript的保留字之一。嗯。
最后補(bǔ)充一點(diǎn):
區(qū)別caller
返回一個(gè)對(duì)函數(shù)的引用,該函數(shù)調(diào)用了當(dāng)前函數(shù)。
- - functionName.caller
- - functionName 對(duì)象是所執(zhí)行函數(shù)的名稱。
對(duì)于函數(shù)來說,caller 屬性只有在函數(shù)執(zhí)行時(shí)才有定義。如果函數(shù)是由頂層調(diào)用的,那么 caller 包含的就是 null 。如果在字符串上下文中使用 caller 屬性,那么結(jié)果和 functionName.toString 一樣,也就是說,顯示的是函數(shù)的反編譯文本。
代碼:
Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/-->// caller demo { function callerDemo() { if (callerDemo.caller) { var a= callerDemo.caller.toString(); alert(a); } else { alert("this is a top function"); } } function handleCaller() { callerDemo(); } handleCaller();//彈出handleCaller的定義
以上就是針對(duì)javascript的arguments對(duì)象的相關(guān)介紹,希望對(duì)大家的學(xué)習(xí)有所幫助。
- javascript內(nèi)置對(duì)象arguments詳解
- js arguments對(duì)象應(yīng)用介紹
- Javascript中arguments對(duì)象的詳解與使用方法
- Javascript中的arguments對(duì)象
- Javascript中arguments對(duì)象詳解
- JS中使用變量保存arguments對(duì)象的方法
- 深入解析JavaScript中的arguments對(duì)象
- JavaScript中如何通過arguments對(duì)象實(shí)現(xiàn)對(duì)象的重載
- Javascript學(xué)習(xí)筆記之函數(shù)篇(四):arguments 對(duì)象
- js中arguments對(duì)象的深入理解
相關(guān)文章
JavaScript實(shí)現(xiàn)Fly Bird小游戲
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)Fly Bird小游戲的制作方法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-12-12實(shí)例講解DataTables固定表格寬度(設(shè)置橫向滾動(dòng)條)
下面小編就為大家?guī)硪黄獙?shí)例講解DataTables固定表格寬度(設(shè)置橫向滾動(dòng)條)。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-07-07使用js獲取url中的參數(shù)并返回一個(gè)對(duì)象方式
這篇文章主要介紹了使用js獲取url中的參數(shù)并返回一個(gè)對(duì)象方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-01-01前端JavaScript實(shí)現(xiàn)本地模糊搜索功能的方法實(shí)例
對(duì)于模糊查詢,一般都是傳關(guān)鍵字給后端,由后端來做。但是有時(shí)候一些輕量級(jí)的列表前端來做可以減少ajax請(qǐng)求,在一定程度上提高用戶體驗(yàn),這篇文章主要給大家介紹了關(guān)于前端JavaScript如何實(shí)現(xiàn)本地模糊搜索功能的相關(guān)資料,需要的朋友可以參考下2021-07-07JavaScript獲取圖片真實(shí)大小代碼實(shí)例
這篇文章主要介紹了JavaScript獲取圖片真實(shí)大小代碼實(shí)例,本文使用onload事件來獲取圖片的真實(shí)大小,需要的朋友可以參考下2014-09-09