本文給大家分享我的javascript高級(jí)編程學(xué)習(xí)筆記之object和array引用類型，涉及到j(luò)avascript引用類型相關(guān)知識(shí)，大家一起看看把。

1. Object類型

     大多數(shù)引用類型值都是Object類型的實(shí)例；而且Object也是ECMAScript中使用最多的一個(gè)類型。

     創(chuàng)建Object實(shí)例有如下兩種方式：

new操作符后跟Object構(gòu)造函數(shù)：

   var person=new Object( );
   person.name="webb";
   person.age=25;

對(duì)象字面量表示法：

  var person={
     name:"webb",
     age:25
   };

2. Array類型

     除了Object之外，Array類型恐怕是ECMAScript中最常用的類型了。
     ECMAScript數(shù)組的每一項(xiàng)可以保存任何類型的數(shù)據(jù)（例如，第一個(gè)位置可存放字符串，第二個(gè)位置保存數(shù)值，第三個(gè)位置保存對(duì)象，以此類推）。而且ECMAScript數(shù)組的大小是可以動(dòng)態(tài)調(diào)整的，即可以隨著數(shù)據(jù)的添加自動(dòng)增長以容納新增數(shù)據(jù)。

     創(chuàng)建數(shù)組的基本方式有兩種，

使用Array構(gòu)造函數(shù)：

var colors=new Array( );
     var colors=new Array(20);   //也可設(shè)置length屬性
     var colors=new Array("red","blue","green");   //包含3個(gè)字符串的數(shù)組
     var colors=Array(3);   //可省略new操作符

數(shù)組字面量表示法

 var colors=["red","blue","green"];
     alert(colors[0]);   //顯示第一項(xiàng)
     colors[2]="black";   //修改第三項(xiàng)
     colors[3]="brown";   //新增第四項(xiàng)

     注：數(shù)組的length屬性很有特點(diǎn)——它不是只讀的。因此通過設(shè)置這個(gè)屬性，可以從數(shù)組的末尾移除或添加項(xiàng)。例如，

     var colors=["red","blue","green"];
     colors.length=2;
     alert(colors[2]);   //undefined
     colors[colors.length]="black";   //在末尾添加項(xiàng)

     2.1 檢測(cè)數(shù)組

          對(duì)于一個(gè)網(wǎng)頁，或者一個(gè)全局作用域而言，使用instanceof操作符就能判斷某個(gè)對(duì)象是不是數(shù)組：

   if(value instanceof Array){
        //對(duì)數(shù)組執(zhí)行某些操作
     }

          instanceof操作符的問題在于，它假定只有一個(gè)全局執(zhí)行環(huán)境。如果網(wǎng)頁中包含多個(gè)框架，那實(shí)際上就存在兩個(gè)以上不同的全局執(zhí)行環(huán)境，從而存在兩個(gè)以上不同版本的Array構(gòu)造函數(shù)。如果你從一個(gè)框架向另一個(gè)框架傳入一個(gè)數(shù)組，那么傳入的數(shù)組與在第二個(gè)框架中原生創(chuàng)建的數(shù)組分別具有各自不同的構(gòu)造函數(shù)。

          為了解決這個(gè)問題，ECMAScript5新增了Array.isArray( )方法。這個(gè)方法的目的是最終確定某個(gè)值到底是不是數(shù)組，而不管它是在哪個(gè)全局執(zhí)行環(huán)境中創(chuàng)建的，

if(Array.isArray(value)){
        //對(duì)數(shù)組執(zhí)行某些操作
     }

支持該方法的瀏覽器有IE9+、Firefox 4+、Safari 5+、Opera 10.5+和Chrome。

     2.2 轉(zhuǎn)換方法

          調(diào)用數(shù)組的toString( )方法會(huì)返回由數(shù)組中每個(gè)值的字符串形式拼接而成的一個(gè)以逗號(hào)分隔的字符串。而調(diào)用valueOf( )返回的還是數(shù)組。實(shí)際上，為了創(chuàng)建這個(gè)字符串會(huì)調(diào)用數(shù)組每一項(xiàng)的toString( )方法。例如，

var colors=["red","blue","green"];
     alert(colors.toString());   //red,blue,green
     alert(colors.valueOf());   //red,blue,green
     alert(colors);   //red,blue,green

          另外，toLocaleString( )方法經(jīng)常也會(huì)返回與toString( )和valueOf( )方法相同的值，但也不總是如此。當(dāng)調(diào)用數(shù)組的toLocaleString( )方法時(shí)，它也會(huì)創(chuàng)建一個(gè)數(shù)組值的以逗號(hào)分隔的字符串。而與前兩個(gè)方法唯一的不同之處在于，這一次為了取得每一項(xiàng)的值，調(diào)用的是每一項(xiàng)的toLocaleString( )方法，而不是toString( )方法。

  var person1={
        toLocaleString:function(){
          return "webbxx";
        },
        toString:function(){
          return "webb";
        }
     };
     var person2={
        toLocaleString:function(){
          return "susanxx";
        },
        toString:function(){
          return "susan";
        }
     };
     var people=[person1,person2];
     alert(people);   //webb,susan
     alert(people.toString());   //webb,susan
     alert(people.toLocaleString());   //webbxx,susanxx
     使用join( )方法也可輸出數(shù)組，并可指定分隔符，默認(rèn)為逗號(hào)：
          var colors=["red","blue","green"];
          alert(colors.join(","));   //red,blue,green
          alert(colors.join("||"));   //red||blue||green

     2.3 棧方法(LIFO)

          push( )：接受任意數(shù)量的參數(shù)，把它們逐個(gè)添加到數(shù)組末尾，并返回修改后數(shù)組的長度；
          pop( )：從數(shù)組末尾移除最后一項(xiàng)

  var colors=new Array();
        var count=colors.push("red","green");
        alert(count);   //2
        count=colors.push("black");
        alert(count);   //3
        var item=colors.pop();
        alert(item);   //"black"
        alert(colors.length);   //2

     2.4 隊(duì)列方法(FIFO)

          shift( )：移除數(shù)組的第一項(xiàng)并返回該項(xiàng)，同時(shí)數(shù)組長度減1；
          unshift( )：顧名思義，與shift( )用途相反，能在數(shù)組前端添加任意個(gè)項(xiàng)并返回?cái)?shù)組的長度。

     2.5 重排序方法

          reverse( )：反轉(zhuǎn)數(shù)組項(xiàng)的順序；

          sort( )：默認(rèn)按升序排列；為了實(shí)現(xiàn)排序，sort( )方法會(huì)調(diào)用每項(xiàng)的toString( )方法，然后比較得到的字符串，以確定如何排序。即使每一項(xiàng)都是數(shù)值，比較的也是字符串，如下所示。

   var values=[0,1,5,10,15];
        values.sort();
        alert(values);   //0,1,10,15,5

          這種排序方式在很多情況下都不是最佳方案。因此sort( )方法可以接受一個(gè)比較函數(shù)作為參數(shù)，以便指定哪個(gè)值位于哪個(gè)值的前面。

 function compare(value1,value2){
        if(value1<value2){
          return -1;   //value1在value2之前
        }else if(value1>value2){
          return 1;
        }else{
          return 0; 
        }
     }

          這個(gè)比較函數(shù)可以適用大多數(shù)據(jù)類型，只要將其作為參數(shù)傳遞給sort( )方法即可，如下，

 var values=[0,1,5,10,15];
        values.sort(compare);
        alert(values);   //0,1,5,10,15

     2.6 操作方法

          concat( )：基于當(dāng)前數(shù)組中的所有項(xiàng)創(chuàng)建一個(gè)新數(shù)組。例如，

 var colors=["red","blue","green"];
        var colors2=colors.concat("yellow",["black","brown"]);
        alert(colors);   //red,blue,green
        alert(colors2);   //red,blue,green,yellow,black,brown

          slice( )：基于當(dāng)前數(shù)組中的一個(gè)或多個(gè)項(xiàng)創(chuàng)建一個(gè)新數(shù)組。例如，

       var colors=["red","green","blue","yellow","purple"];
        var colors2=colors.slice(1);   //green,blue,yellow,purple
        var colors3=colors.slice(1,3);   //green,blue,yellow

          splice( )：這個(gè)方法恐怕是最強(qiáng)大的數(shù)組方法了，主要用途是向數(shù)組的中部插入項(xiàng)，但使用這種方法的方式則有如下2種。

刪除：可以刪除任意數(shù)量的項(xiàng)，只需指定2個(gè)參數(shù)：要?jiǎng)h除的第一項(xiàng)的位置和要?jiǎng)h除的項(xiàng)數(shù)。

插入：可以向指定位置插入任意數(shù)量的項(xiàng)，只需提供3個(gè)參數(shù)：起始位置、0（要?jiǎng)h除的項(xiàng)數(shù)）和要插入的項(xiàng)。如果要插入多個(gè)項(xiàng)，可以再傳第四、第五以至任意多個(gè)項(xiàng)；例如，splice(2,0,"red","green")會(huì)從當(dāng)前數(shù)組的位置2開始插入字符串"red"和"green"。

               splice( )方法始終都會(huì)返回一個(gè)數(shù)組，包含從原始數(shù)組中刪除的項(xiàng)（如果沒有刪除任何項(xiàng)，則返回空數(shù)組）。

     2.7 位置方法

          indexOf( )和lastIndexOf( )：這兩個(gè)方法都接受兩個(gè)參數(shù)：要查找的項(xiàng)和（可選的）表示查找起點(diǎn)位置的索引。前者從開頭開始向后查找，后者從末尾向前查找

   2.8 迭代方法

          ECMAScript5為數(shù)組定義了5個(gè)迭代方法，每個(gè)方法都接受兩個(gè)參數(shù)：要在每一項(xiàng)上運(yùn)行的函數(shù)和（可選的）運(yùn)行該函數(shù)的作用域?qū)ο蟆绊憈his的值。傳入這些方法中的函數(shù)會(huì)接收三個(gè)參數(shù)：數(shù)組項(xiàng)的值、該項(xiàng)在數(shù)組中的位置和數(shù)組對(duì)象本身。

every( )：對(duì)數(shù)組中的每一項(xiàng)運(yùn)行給定函數(shù)，如果該函數(shù)對(duì)每一項(xiàng)都返回true，則返回true。
filter( )：對(duì)數(shù)組中的每一項(xiàng)運(yùn)行給定函數(shù)，返回該函數(shù)會(huì)返回true的項(xiàng)組成的數(shù)組。
forEach( )：對(duì)數(shù)組中的每一項(xiàng)運(yùn)行給定函數(shù)，這個(gè)方法無返回值。
map( )：對(duì)數(shù)組中的每一項(xiàng)運(yùn)行給定函數(shù)，返回每次函數(shù)調(diào)用的結(jié)果組成的數(shù)組。
some( )：對(duì)數(shù)組中的每一項(xiàng)運(yùn)行給定函數(shù)，如果該函數(shù)對(duì)任一項(xiàng)返回true，則返回true。

         以上方法都不會(huì)修改數(shù)組中包含的值。例如，

var numbers=[1,2,3,4,5,4,3,2,1];
        var everyResult=numbers.every(function(item,index,array){
          return item>2;
        });
        alert(everyResult);   //false
        var someResult=numbers.every(function(item,index,array){
          return item>2;
        });
        alert(someResult);   //true
        var filterResult=numbers.every(function(item,index,array){
          return item>2;
        });
        alert(filterResult);   //[3,4,5,4,3]
        var mapResult=numbers.every(function(item,index,array){
          return item*2;
        });
        alert(mapResult);   //[2,4,6,8,10,8,6,4,2]

     2.9 歸并方法

          reduce( )：從數(shù)組的第一項(xiàng)開始，逐個(gè)遍歷到最后；
          reduceRight( )：從數(shù)組的最后一項(xiàng)開始，向前遍歷到第一項(xiàng)。
          這兩個(gè)方法都接受兩個(gè)參數(shù)：一個(gè)在每一項(xiàng)上調(diào)用的函數(shù)和（可選的）作為歸并基礎(chǔ)的初始值。傳給這些方法的函數(shù)接受4個(gè)參數(shù)：前一個(gè)值、當(dāng)前值、項(xiàng)的索引和數(shù)組對(duì)象。這個(gè)函數(shù)返回的任何值都會(huì)作為第一個(gè)參數(shù)傳給下一項(xiàng)。例如，

   var values=[1,2,3,4,5];
        var sum=values.reduce(function(prev,cur,index,array){
          return prev+cur;
        });
        alert(sum);   //15

最新評(píng)論