認識js中的function和this---new Function(a,b,body)方式
以下是引用片段：
function func1(…){…}
var func2=function(…){…};
var func3=function func4(…){…};
var func5=new Function();
這些都是宣告函式的正確語法。它們和其他語言中常見的函式或之前介紹的函式定義方式有著很大的區別。那麼在JavaScript中為什麼能這麼寫？它所遵循的語法是什麼呢？下面將介紹這些內容。
認識函式物件（Function Object）
可以用function關鍵字定義一個函式，併為每個函式指定一個函式名，通過函式名來進行呼叫。在JavaScript解釋執行時，函式都是被維護為一個物件，這就是要介紹的函式物件（Function Object）。
函式物件與其他使用者所定義的物件有著本質的區別，這一類物件被稱之為內部物件，例如日期物件（Date）、陣列物件（Array）、字串物件 （String）都屬於內部物件。這些內建物件的構造器是由JavaScript本身所定義的：通過執行new Array()這樣的語句返回一個物件，JavaScript內部有一套機制來初始化返回的物件，而不是由使用者來指定物件的構造方式。
在JavaScript中，函式物件對應的型別是Function，正如陣列物件對應的型別是Array，日期物件對應的型別是Date一樣，可以通過 new Function()來建立一個函式物件，也可以通過function關鍵字來建立一個物件。為了便於理解，我們比較函式物件的建立和陣列物件的建立。先 看陣列物件：下面兩行程式碼都是建立一個數組物件myArray：
以下是引用片段：
var myArray=[];
//等價於
var myArray=new Array();
同樣，下面的兩段程式碼也都是建立一個函式myFunction：
function myFunction(a,b){
return a+b;
}
//等價於
var myFunction=new Function("a","b","return a+b");
通過和構造陣列物件語句的比較，可以清楚的看到函式物件本質，前面介紹的函式宣告是上述程式碼的第一種方式，而在直譯器內部，當遇到這種語法時，就會自動構 造一個Function物件，將函式作為一個內部的物件來儲存和執行。從這裡也可以看到，一個函式物件名稱（函式變數）和一個普通變數名稱具有同樣的規 範，都可以通過變數名來引用這個變數，但是函式變數名後面可以跟上括號和引數列表來進行函式呼叫。
用new Function()的形式來建立一個函式不常見，因為一個函式體通常會有多條語句，如果將它們以一個字串的形式作為引數傳遞，程式碼的可讀性差。下面介紹一下其使用語法：
以下是引用片段：
var funcName=new Function(p1,p2,...,pn,body);
引數的型別都是字串，p1到pn表示所建立函式的引數名稱列表，body表示所建立函式的函式體語句，funcName就是所建立函式的名稱。可以不指定任何引數建立一個空函式，不指定funcName建立一個無名函式，當然那樣的函式沒有任何意義。
需要注意的是，p1到pn是引數名稱的列表，即p1不僅能代表一個引數，它也可以是一個逗號隔開的引數列表，例如下面的定義是等價的：
以下是引用片段：
new Function("a", "b", "c", "return a+b+c")
new Function("a, b, c", "return a+b+c")
new Function("a,b", "c", "return a+b+c")
JavaScript引入Function型別並提供new Function()這樣的語法是因為函式物件新增屬性和方法就必須藉助於Function這個型別。
函式的本質是一個內部物件，由JavaScript直譯器決定其執行方式。通過上述程式碼建立的函式，在程式中可以使用函式名進行呼叫。本節開頭列出的函式定義問題也得到了解釋。注意可直接在函式聲明後面加上括號就表示建立完成後立即進行函式呼叫，例如：
以下是引用片段：
var i=function (a,b){
return a+b;
}(1,2);
alert(i);
這段程式碼會顯示變數i的值等於3。i是表示返回的值，而不是建立的函式，因為括號“(”比等號“=”有更高的優先順序。這樣的程式碼可能並不常用，但當用戶想在很長的程式碼段中進行模組化設計或者想避免命名衝突，這是一個不錯的解決辦法。
需要注意的是，儘管下面兩種建立函式的方法是等價的：
以下是引用片段：
function funcName(){
//函式體
}
//等價於
var funcName=function(){
//函式體
}
但前面一種方式建立的是有名函式，而後面是建立了一個無名函式，只是讓一個變數指向了這個無名函式。在使用上僅有一點區別，就是：對於有名函式，它可以出現在呼叫之後再定義；而對於無名函式，它必須是在呼叫之前就已經定義。例如：
以下是引用片段：
這段語句將產生func未定義的錯誤，而：
以下是引用片段：
則能夠正確執行，下面的語句也能正確執行：
以下是引用片段：
由此可見，儘管JavaScript是一門解釋型的語言，但它會在函式呼叫時，檢查整個程式碼中是否存在相應的函式定義，這個函式名只有是通過function funcName()形式定義的才會有效，而不能是匿名函式。
函式物件和其他內部物件的關係
除了函式物件，還有很多內部物件，比如：Object、Array、Date、RegExp、Math、Error。這些名稱實際上表示一個型別，可以通 過new操作符返回一個物件。然而函式物件和其他物件不同，當用typeof得到一個函式物件的型別時，它仍然會返回字串“function”，而 typeof一個數組物件或其他的物件時，它會返回字串“object”。下面的程式碼示例了typeof不同型別的情況：
以下是引用片段：
alert(typeof(Function)));
alert(typeof(new Function()));
alert(typeof(Array));
alert(typeof(Object));
alert(typeof(new Array()));
alert(typeof(new Date()));
alert(typeof(new Object()));
執行這段程式碼可以發現：前面4條語句都會顯示“function”，而後面3條語句則顯示“object”，可見new一個function實際上是返回 一個函式。這與其他的物件有很大的不同。其他的型別Array、Object等都會通過new操作符返回一個普通物件。儘管函式本身也是一個物件，但它與 普通的物件還是有區別的，因為它同時也是物件構造器，也就是說，可以new一個函式來返回一個物件，這在前面已經介紹。所有typeof返回 “function”的物件都是函式物件。也稱這樣的物件為構造器（constructor），因而，所有的構造器都是物件，但不是所有的物件都是構造 器。
既然函式本身也是一個物件，它們的型別是function，聯想到C++、Java等面嚮物件語言的類定義，可以猜測到Function型別的作用所在， 那就是可以給函式物件本身定義一些方法和屬性，藉助於函式的prototype物件，可以很方便地修改和擴充Function型別的定義，例如下面擴充套件了 函式型別Function，為其增加了method1方法，作用是彈出對話方塊顯示"function"：
以下是引用片段：
Function.prototype.method1=function(){
alert("function");
}
function func1(a,b,c){
return a+b+c;
}
func1.method1();
func1.method1.method1();
注意最後一個語句：func1.method1.mehotd1()，它呼叫了method1這個函式物件的method1方法。雖然看上去有點容易混 淆，但仔細觀察一下語法還是很明確的：這是一個遞迴的定義。因為method1本身也是一個函式，所以它同樣具有函式物件的屬性和方法，所有對 Function型別的方法擴充都具有這樣的遞迴性質。
Function是所有函式物件的基礎，而Object則是所有物件（包括函式物件）的基礎。在JavaScript中，任何一個物件都是 Object的例項，因此，可以修改Object這個型別來讓所有的物件具有一些通用的屬性和方法，修改Object型別是通過prototype來完成 的：
以下是引用片段：
Object.prototype.getType=function(){
return typeof(this);
}
var array1=new Array();
function func1(a,b){
return a+b;
}
alert(array1.getType());
alert(func1.getType());
上面的程式碼為所有的物件添加了getType方法，作用是返回該物件的型別。兩條alert語句分別會顯示“object”和“function”。
將函式作為引數傳遞
在前面已經介紹了函式物件本質，每個函式都被表示為一個特殊的物件，可以方便的將其賦值給一個變數，再通過這個變數名進行函式呼叫。作為一個變數，它可以 以引數的形式傳遞給另一個函式，這在前面介紹JavaScript事件處理機制中已經看到過這樣的用法，例如下面的程式將func1作為引數傳遞給 func2：
以下是引用片段：
function func1(theFunc){
theFunc();
}
function func2(){
alert("ok");
}
func1(func2);
在最後一條語句中，func2作為一個物件傳遞給了func1的形參theFunc，再由func1內部進行theFunc的呼叫。事實上，將函式作為引數傳遞，或者是將函式賦值給其他變數是所有事件機制的基礎。
例如，如果需要在頁面載入時進行一些初始化工作，可以先定義一個init的初始化函式，再通過window.onload=init;語句將其繫結到頁面載入完成的事件。這裡的init就是一個函式物件，它可以加入window的onload事件列表。
傳遞給函式的隱含引數：arguments
當進行函式呼叫時，除了指定的引數外，還建立一個隱含的物件——arguments。arguments是一個類似陣列但不是陣列的物件，說它類似是因為 它具有陣列一樣的訪問性質，可以用arguments[index]這樣的語法取值，擁有陣列長度屬性length。arguments物件儲存的是實際 傳遞給函式的引數，而不侷限於函式宣告所定義的引數列表，例如：
以下是引用片段：
function func(a,b){
alert(a);
alert(b);
for(var i=0;i
alert(arguments[i]);
}
}
func(1,2,3);
程式碼執行時會依次顯示：1，2，1，2，3。因此，在定義函式的時候，即使不指定引數列表，仍然可以通過arguments引用到所獲得的引數，這給程式設計 帶來了很大的靈活性。arguments物件的另一個屬性是callee，它表示對函式物件本身的引用，這有利於實現無名函式的遞迴或者保證函式的封裝 性，例如使用遞迴來計算1到n的自然數之和：
以下是引用片段：
var sum=function(n){
if(1==n)return 1;
else return n+sum(n-1);
}
alert(sum(100));
其中函式內部包含了對sum自身的呼叫，然而對於JavaScript來說，函式名僅僅是一個變數名，在函式內部呼叫sum即相當於呼叫一個全域性變數，不能很好的體現出是呼叫自身，所以使用arguments.callee屬性會是一個較好的辦法：
以下是引用片段：
var sum=function(n){
if(1==n)return 1;
else return n+arguments.callee(n-1);
}
alert(sum(100));
callee屬性並不是arguments不同於陣列物件的惟一特徵，下面的程式碼說明了arguments不是由Array型別建立：
以下是引用片段：
Array.prototype.p1=1;
alert(new Array().p1);
function func(){
alert(arguments.p1);
}
func();
執行程式碼可以發現，第一個alert語句顯示為1，即表示陣列物件擁有屬性p1，而func呼叫則顯示為“undefined”，即p1不是arguments的屬性，由此可見，arguments並不是一個數組物件。
函式的apply、call方法和length屬性
JavaScript為函式物件定義了兩個方法：apply和call，它們的作用都是將函式繫結到另外一個物件上去執行，兩者僅在定義引數的方式有所區別：
以下是引用片段：
Function.prototype.apply(thisArg,argArray);
Function.prototype.call(thisArg[,arg1[,arg2…]]);
從函式原型可以看到，第一個引數都被取名為thisArg，即所有函式內部的this指標都會被賦值為thisArg，這就實現了將函式作為另外一個物件 的方法執行的目的。兩個方法除了thisArg引數，都是為Function物件傳遞的引數。下面的程式碼說明了apply和call方法的工作方式：
以下是引用片段：
//定義一個函式func1，具有屬性p和方法A
function func1(){
this.p="func1-";
this.A=function(arg){
alert(this.p+arg);
}
}
//定義一個函式func2，具有屬性p和方法B
function func2(){
this.p="func2-";
this.B=function(arg){
alert(this.p+arg);
}
}
var obj1=new func1();
var obj2=new func2();
obj1.A("byA"); //顯示func1-byA
obj2.B("byB"); //顯示func2-byB
obj1.A.apply(obj2,["byA"]); //顯示func2-byA，其中[“byA”]是僅有一個元素的陣列，下同
obj2.B.apply(obj1,["byB"]); //顯示func1-byB
obj1.A.call(obj2,"byA"); //顯示func2-byA
相關推薦
認識js中的function和this---new Function(a,b,body)方式
javascript中的函式不同於其他的語言，每個函式都是作為一個物件被維護和執行的。通過函式物件的性質，可以很方便的將一個函式賦值給一個變數或者將函式作為引數傳遞。在繼續講述之前，先看一下函式的使用語法：以下是引用片段：function func1(…){…}var func2=function(…){…}
在JS中Function()和this的巧妙運用
1.構造器呼叫模式當我們把一個函式前面帶上new來呼叫,則相同於 java中的實體初始化賦值,函式內建屬性都會賦值123456789101112131415161718192021functiontes
JS中用function和沒有用function的區別
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style>
格式化Date():後臺傳回一串數字js中格式化(date.getFullYear is not a function)
先上總結：getFullYear is not a function報錯原因：js呼叫的方法中少了這一句var date = new Date(date);接下來是解決方法：後臺傳回的時間如下：js程式
JS中isPrototypeOf 和hasOwnProperty 的區別
另一個 strong 是否 指定 不同 名稱 功能 成員 eof 1、isPrototypeOf isPrototypeOf是用來判斷指定對象object1是否存在於另一個對象object2的原型鏈中，是則返回true，否則返回false。 格式如下： object1.is
【2017-05-21】WebForm跨頁面傳值取值、C#服務端跳轉頁面、 Button的OnClientClick屬性、Js中getAttribute和超鏈接點擊彈出警示框。
代碼 height delet update size 內存 客戶 bar win 一、跨頁面傳值和取值： 1、QueryString - url傳值，地址傳值 優缺點：不占用服務器內存；保密性差，傳遞長度有限。 通過跳轉頁面路徑進行傳值，方式： href="地址?ke
js中undefined和null的區別
常常 html exist tex 輸出 output 為什麽 hive 存在 轉自：http://www.cnblogs.com/eastday/archive/2010/03/03/1677324.html 在JavaScript中存在這樣兩種原始類型:Null與Und
js中eval()和$.parseJSON()的區別
16px 異常 comment 而不是 str on() ajax 鏈接 強制 之前自己一直對ajax不是特別的熟悉，所以一般都很少用這個去寫功能，但是最近這個項目中用到了，用ajax異步傳數據，json傳數據這個時候就需要去解析傳過來的數據了，eval()和$.parse
Js中caller和callee的區別
存在 ons var nbsp fun 區別 test 函數對象 返回 1 ：caller 返回一個調用當前函數的引用 如果是由頂層調用的話 則返回null （舉個栗子哈 caller給你打電話的人 誰給你打電話了 誰調用了你 很顯然是下面a函數的執行 只有在打電話的時候
js中decodeURI()和encodeURI()區別，decodeURIComponent和encodeURIComponent區別
nbsp sch www 問題 encode 替換 副本 字符替換 序列 decodeURI()定義和用法:decodeURI()函數可對encodeURI()函數編碼過的URI進行解碼.語法:decodeURI(URIstring)參數描述:URIstring必需,一個字
實例分析Vue.js中 computed和method不同機制
java meta 取值 源碼 otc 它的 round div 兩種 在vue.js中，有methods和computed兩種方式來動態當作方法來用的 1.首先最明顯的不同 就是調用的時候，methods要加上（） 2.我們可以使用 methods 來替代 compute
JS中var和let
聲明 weight ron 內部 es6 png ava 帶來 isp 前 言 JavaScript 大家都知道聲明一個變量時，通常會用‘var‘來聲明，但是在ES6中，定義了另一個關鍵字‘let‘。今天我就為大家帶來‘var‘與‘let‘這兩個關鍵字聲明
JS中String()和toString()
數據 string 一個 htm keyword www. type mar lin 1、.toString()可以將所有的的數據都轉換為字符串，但是要排除null 和 undefined 例如將false轉為字符串類型 <script> var str =
js中properties和attributes
字符 java 主題 clas html標簽 自定義 數據綁定 數據類型 scrip Property：屬性，所有的HTML元素都由HTMLElement類型表示，HTMLElement類型直接繼承自Element並添加了一些屬性，添加的這些屬性分別對應於每個HTML元素都
JS中every()和some()的用法
ray scrip highlight bsp 函數 如果 urn return pre every()與some()方法都是JS中數組的叠代方法。 every()是對數組中每一項運行給定函數，如果該函數對每一項返回true,則返回true。 some()是對數組中每一項運
js中opener 和parent區別
pen window ner win 就是 引用 窗口 iframe 彈出 1、opener即誰打開我的，比如A頁面利用window.open彈出了B頁面窗口，那麽A頁面所在窗口就是B頁面的opener，在B頁面通過opener對象可以訪問A頁面。 2、parent表示父窗
JS中caller和callee
() lee bsp pan call div col span 一個 caller: caller是函數對象的一個屬性，指的是這個函數對象的調用者,如果調用者,如果是頂層調用者,則返回null. 例: function func(){ conso
js中的||和&&的用法
pos AR 規則 pan 隱式 技術 執行 OS 分享 與其他語言不同，在JS中，a&&b或者a||b返回的是要麽是a，要麽是b；而其他語言中返回的是true or false 對於js中的或與運算，需要隱式的轉換為boolean類型再來運算；轉換規則為：
JAVA中super和this調用構造函數
main 執行 TP ID sta ger 構造 tps this關鍵字 轉載自：https://blog.csdn.net/u014042146/article/details/48374087，除了個別註釋稍作更改，其他沒變，代碼建議跑一遍，想清楚邏輯。 this
js中 onreadystatechange 和 onload的區別
chan creat code clas LG 參考 VR href ads IE的script 元素只支持onreadystatechange事件，不支持onload事件。 FF的script 元素不支持onreadystatechange事件，只支持onload事件。