javascript Array 學習筆記

時間 2019-12-07

標籤 javascript array 學習筆記欄目 JavaScript 简体版

原文原文鏈接

數組的定義:
今天碰到一個問題:
(this._callback[evn] || (this._callback[evn] = [])).push(callback);
this._callback[evn] undefined-->執行this._callback[evn] = []初始化數組
數組初始化完畢，push()回調函數javascript

var arr = new Array()
   console.log(arr['item1'])//undefined
    arr['item1'] = []// 新建一個數組
    arr['item1'].push('item2')//在空數組的基礎上push("item2")
    console.log(arr['item1'])//輸出["item2"]

constructor 屬性返回對建立此對象的數組函數的引用。html

<!DOCTYPE html>
 <html>
 <head>
     <title>html</title>
 </head>
 <body>
        <script type="text/javascript">
          var arr = new Array();
          if(arr.constructor ==Array){
            document.write('This is an array');
          }
        </script>
 </body>
 </html>

能夠將constructor打印java

<!DOCTYPE html>
 <html>
 <head>
     <title>html</title>
 </head>
 <body>
        <script type="text/javascript">
          function staff(name,sex,job){
             this.name = name;
             this.sex = sex;
             this.job = job;
          }
          var bill = new staff('bill yuan','man','ceo');
          document.write(bill.constructor)
        </script>
 </body>
 </html>

prototype 能夠向對象添加方法和屬性數組

<!DOCTYPE html>
 <html>
 <head>
     <title>html</title>
     <!-- prototype 屬性使你有能力向對象添加屬性和方法。 -->
 </head>
 <body>
        <script type="text/javascript">
          function staff(name,sex,job){
             this.name = name;
             this.sex = sex;
             this.job = job;
          }
          var bill = new staff('bill yuan','man','ceo');
          staff.prototype.sallary = null;
          staff.prototype.doSomething = function(v){
            document.write(v)
          }
          bill.sallary = 100000;
          bill.doSomething('say something')
          document.write(bill.sallary+bill.name)
        </script>
 </body>
 </html>

對象方法 contact，用於鏈接2個或2個以上的數組，合成一個大數組瀏覽器

<!DOCTYPE html>
 <html>
 <head>
     <title>html</title>
     <!-- contact 對象方法，用於鏈接2個或者以上的數組。 -->
 </head>
 <body>
        <script type="text/javascript">
          var arr = new Array('e1','e2','e3');
          var arr1 = new Array('n1','n2','n3');
          var arr2 = new Array('b1','b2','b3');
          //var str = new Array(arr.concat(arr1,arr2))
          var str = arr.concat(arr1,arr2)
          document.write(str)
        </script>
 </body>
 </html>

對象方法 join，用於將數組中的每個元素使用指定的分割符合成一個你想要的字符串。app

<!DOCTYPE html>
 <html>
 <head>
     <title>html</title>
     <!--join() 方法用於把數組中的全部元素放入一個字符串。元素是經過指定的分隔符進行分隔的。.join(separator)-->
     <!--返回一個字符串。該字符串是經過把 array中的每一個元素轉換爲字符串，而後把這些字符串鏈接起來，在兩個元素之間插入 separator(分隔符)字符串而生成的-->
 </head>
 <body>
        <script type="text/javascript">
          var arr = new Array('what','is','your','name?');
          var str = arr.join(' ')
          document.write(str)
        </script>
 </body>
 </html>

對象方法 pop()；用於刪除數組最後一個元素，而且返回該元素值函數

<!DOCTYPE html>
 <html>
 <head>
     <title>html</title>
    <!-- pop() 方法用於刪除並返回數組的最後一個元素。 -->
    <!-- pop() 方法將刪除 arrayObject 的最後一個元素，把數組長度減 1，而且返回它刪除的元素的值。若是數組已經爲空，則 pop() 不改變數組，並返回 undefined 值。-->
 </head>
 <body>
        <script type="text/javascript">
          var arr = new Array('what','is','your','name?','somethingelse');
          document.write(arr)
          document.write('<br>')
          document.write(arr.pop())
          document.write('<br>')
          document.write(arr)
        </script>
 </body>
 </html>

對象方法.push能夠向數組添加多個元素
.unshift 能夠從開頭添加一個或是多個元素this

<!DOCTYPE html>
 <html>
 <head>
     <title>html</title>
     <!-- push() 方法可向數組的末尾添加一個或多個元素，並返回新的長度。 -->
     <!-- push() 方法可把它的參數順序添加到 Array 的尾部。它直接修改 Array,而不是建立一個新的數組。push() 方法和 pop() 方法使用數組提供的先進後出棧的功能。 -->
     <!-- 要想數組的開頭添加一個或多個元素，請使用 unshift() 方法。 -->
 </head>
 <body>
        <script type="text/javascript">
          var arr = new Array('what','is','your','name?');
          document.write(arr+'<br>')//what,is,your,name?
          document.write(arr.push('do','you','have','time?'))//8
          document.write('<br>')
          document.write(arr+'<br>')//what,is,your,name?,do,you,have,time? 
          document.write(arr.unshift('do','you','have','time?'))//12
          document.write('<br>')
          document.write(arr)//do,you,have,time?,what,is,your,name?,do,you,have,time? 
        </script>
 </body>
 </html>

數組對象方法.shift() 用於刪除第一個元素，而且返回這個元素。編碼

<!DOCTYPE html>
 <html>
 <head>
     <title>html</title>
     <!--shift() 方法用於把數組的第一個元素從其中刪除，並返回第一個元素的值。-->
 </head>
 <body>
        <script type="text/javascript">
          var arr = new Array('what','is','your','name?');
          document.write(arr+'<br>')//what,is,your,name?
          document.write(arr.shift())//what
          document.write('<br>')
          document.write(arr)//is,your,name?
        </script>
 </body>
 </html>

數組對象方法，arr.slice(start,end)因爲選取數組元素(含頭不含尾)prototype

<!DOCTYPE html>
 <html>
 <head>
     <title>html</title>
     <!--slice() 方法可從已有的數組中返回選定的元素。截取的字符串含頭不含尾-->
     <!-- start 若是是負數，那麼它規定從數組尾部開始算起的位置。也就是說，-1 指最後一個元素，-2 指倒數第二個元素，以此類推。 -->
     <!-- end 可選。規定從何處結束選取。該參數是數組片段結束處的數組下標。若是沒有指定該參數，那麼切分的數組包含從 start 到數組結束的全部元素。若是這個參數是負數，那麼它規定的是從數組尾部開始算起的元素。 -->
 </head>
 <body>
        <script type="text/javascript">
          var arr = new Array('what','is','your','name?');
          document.write(arr.slice(0,2))//what,is
          document.write('<br>')
          document.write(arr+'<br>')//waht,is,your,name?
          document.write(arr.slice(1,-1))//is,your
        </script>
 </body>
 </html>

array數組對象方法 .sort(sortBy),用於對數組裏面的元素進行排序

<!DOCTYPE html>
 <html>
 <head>
     <title>html</title>
     <!-- sort() 方法用於對數組的元素進行排序。 -->
     <!-- 若是調用該方法時沒有使用參數，將按字母順序對數組中的元素進行排序，說得更精確點，是按照字符編碼的順序進行排序。要實現這一點，首先應把數組的元素都轉換成字符串（若有必要），以便進行比較。
    若是想按照其餘標準進行排序，就須要提供比較函數，該函數要比較兩個值，而後返回一個用於說明這兩個值的相對順序的數字。比較函數應該具備兩個參數 a 和 b，其返回值以下：
    若 a 小於 b，在排序後的數組中 a 應該出如今 b 以前，則返回一個小於 0 的值。
    若 a 等於 b，則返回 0。
    若 a 大於 b，則返回一個大於 0 的值。
 -->
 </head>
 <body>
        <script type="text/javascript">
        function sToBig(a,b){
          return a-b//按照數字從小到大排序
        }
        function bToSmall(a,b){
          return b-a//按照數字從大到小排列
        }
          var arr = new Array(1,3,6,7,0,65,34,23,54,18);
          document.write(arr.sort(sToBig))//0,1,3,6,7,18,23,34,54,65
          document.write('<br>')
          document.write(arr.sort(bToSmall))//65,54,34,23,18,7,6,3,1,0
          var arr2 = new Array('car','doctor','zoo','tool','apple')
          document.write('<br>')
          document.write(arr2.sort())//apple,car,doctor,tool,zoo 
        </script>
 </body>
 </html>

數組對象方法 splice(index,howmany,item) 因爲修改數值元素，增刪替換元素

<!DOCTYPE html>
 <html>
 <head>
     <title>html</title>
     <!-- arr.splice(index,howmany,item) -->
     <!--   index必需。整數，規定添加/刪除項目的位置，使用負數可從數組結尾處規定位置。插入數據通常是插在前面 -->
     <!-- how many  必需。要刪除的項目數量。若是設置爲 0，則不會刪除項目。 -->
     <!--  item 可選。向數組添加的新項目。-->
 </head>
 <body>
        <script type="text/javascript">
           var arr = new Array("{'1':'m','2':'n'}","{'1':'x','2':'y'}","{'1':'a','2':'b'}","{'1':'c','2':'d'}","{'1':'w','2':'z'}","{'1':'d','2':'t'}");
           document.write(arr.splice(2,0,"{'1':'mike','2':'hh'}"))
           document.write('<br>')
           document.write(arr)//{'1':'m','2':'n'},{'1':'x','2':'y'},{'1':'mike','2':'hh'},{'1':'a','2':'b'},{'1':'c','2':'d'},{'1':'w','2':'z'},{'1':'d','2':'t'} 
        </script>
 </body>
 </html>

對象方法，toSource因爲打印輸出對象的源代碼

<!DOCTYPE html>
 <html>
 <head>
     <title>html</title>
<!-- toSource() 方法表示對象的源代碼。該原始值由 Array 對象派生的全部對象繼承。toSource() 方法一般由 JavaScript 在後臺自動調用，並不顯式地出如今代碼中。 -->
<!-- 只有 Gecko 核心的瀏覽器（好比 Firefox）支持該方法，也就是說 IE、Safari、Chrome、Opera 等瀏覽器均不支持該方法。 -->
 </head>
 <body>
        <script type="text/javascript">
           function Staff(Name,Gender,job){
             this.Name = Name;
             this.Gender = Gender;
             this.job = job;
           }

          var mk = new Staff('mike','male','staff')
          document.write(mk.toSource())//({Name:"mike", Gender:"male", job:"staff"}) 
        </script>
 </body>
 </html>

toString對象方法，用於將數組轉換成字符串

<!DOCTYPE html>
 <html>
 <head>
     <title>html</title>
<!-- toString() 方法可把數組轉換爲字符串，並返回結果(數組中的元素之間用逗號分隔。)。返回值與沒有參數的 join() 方法返回的字符串相同。 -->
 </head>
 <body>
        <script type="text/javascript">
           var arr = new Array('item1','item2','item3')
           document.write(arr.toString())
        </script>
 </body>
 </html>

valueOf 返回數組對象原始值

<html>
<!-- valueOf() 方法返回 Array 對象的原始值。該原始值由 Array 對象派生的全部對象繼承。valueOf() 方法一般由 JavaScript 在後臺自動調用，並不顯式地出如今代碼中。 -->
 <body>
  <script type="text/javascript">
    var arr = new Array('item1','item2','item3')
    document.write(arr.valueOf())//item1,item2,item3
  </script>
 </body>
</html>

arr.concat(arr1, arr2) 不改變原來數組的基礎上鏈接2個數組變成一個數組