国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

js不完全入門之數組

bergwhite / 1494人閱讀

摘要:數組是值得有序集合。數組元素甚至可以是對象或其它數組。不同數組自動更新。數組對象繼承上的大量數組操作方法字符串和數組字符串可以理解為類數組,但它不是數組博客地址不完全入門之數組歡迎交流指正

數組是值得有序集合。每個值叫做元素,每個元素在數組中都有數字位置編號,也就是索引。
JS中的數組是弱類型的,數組中可以含有不同類型的元素。
數組元素甚至可以是對象或其它數組。

var arr = [1,true,null,undefined,{x:1},[1,2,3]];

創建數組 1.字面量

注意,數組可以用逗號留空的方式創建,如:

 var commasArr1 = [1,,2]; //1,undefined,2
 var commasArr2 = [,,];//undefined * 2

數組大小限制

size form 0 to 2^23 - 1

2.new Array
  var arr = new Array();
  var arrWithLength = new Array(100); //undefined * 100
  var arrLikesLiteral = new Array(true,false,null,1,2,"hi");
  //等價于[true,false,null,1,2,"hi"];
數組元素讀寫
  var arr = [1,2,3,4,5];
  arr[1]; //2
  arr.length; //5

  arr[5] = 6;
  arr.length; //6

  delete arr[0]; //表現上只是改寫為undefined,但是和直接賦值不同
  arr[0]; //undefined
  arr.length; //6
數組元素增刪

動態的,無需指定大小,數組的length會根據數組動態變化

  var arr = [];
  arr[0] = 1;
  arr[1] = 2;
  arr.push(3);
  arr; //[1,2,3]

  arr[arr.length] = 4; //equal to arr.push(4);
  arr; //[1,2,3,4]

  arr.unshift(0);
  arr; //[0,1,2,3,4];

  delete arr[2];
  arr; //[0,1,undefined,3,4]
  arr.length; //5
  2 in arr; //判斷索引存不存在 false

注:用delete變成的undefined和直接用arr[2] = undefined,是不同的
后者 2 in arr; //true;

  arr.length -= 1;
  arr; //[0,1,undefined,3],4 is removed

  arr.pop(); //3 returned by pop
  arr;//[0,1,undefined],3 is removed

  arr.shift(); //0 returned by shift
  arr; //[1,undefined]
數組迭代
  var i = 0,n = 10;
  var arr = [1,2,3,4,5];

  for(; i < n; i++){
    console.log(arr[i]); //1,2,3,4,5
  }

  for(i in arr){
    console.log(arr[i]); //1,2,3,4,5
  }

注:如果用 for-in 的方式來循環數組的話,那么在原型鏈上的屬性也會被迭代出來,如:

  Array.prototype.x = "inherited";

  for(i in arr){
    console.log(arr[i]); //1,2,3,4,5,inherited
  }

此時可以用hasOwnProperty()方法來判斷是否是數組元素

  for(i in arr){
    if(arr.hasOwnProperty(i)){
      console.log(arr[i]);//1,2,3,4,5
    }
  }

注:for-in循環是不保證順序的!

二維數組
  var arr = [[0,1],[2,3],[4,5]];
  var i = 0, j = 0;
  var row;
  for(; i < arr.length; i++){
    row = arr[i];
    console.log("row" + i);
    for(j = 0; j < row.length; j++){
      console.log(row[j]);
    }
  }
稀疏數組

稀疏數組并不含有從0開始的連續索引。一般length屬性值比實際元素個數大。

  var arr1 = [undefined];
  var arr2 = new Array(1);
  0 in arr1; //true
  0 in arr2; //false
  arr1.length = 100;
  arr1[99] = 123;
  99 in arr1; //true
  98 in arr1; //false
  var arr = [,,];
  0 in arr; //false
數組方法

數組的原型 [] => Array.prototype

1.Array.prototype.join

將數組轉為字符串

 var arr = [1,2,3];
 arr.join(); //"1,2,3"
 arr.join("_");//"1_2_3"

 function repeatString(str,n){
   return new Array(n+1).join(str);
 }
 repeatString("a",3); //"aaa"
 repeatString("Hi",5); //"HiHiHiHiHi"
2.Array.prototype.reverse

將數組逆序(原數組變)

    var arr = [1,2,3];
    arr.reverse(); //[3,2,1]
    arr; //[3,2,1] 原數組被修改!
3.Array.prototype.sort

排序(默認是按照字母排序,原數組變)

 var arr = ["a","d","c","b"];
 arr.sort(); //["a","b","c","d"]

 arr = [13,24,51,3];
 arr.sort(); //[13,24,3,51] 轉換成字符串,按開頭數字排序
 arr; //[13,24,3,51] 原數組被修改!

 /* 數字排序 */
 arr.sort(function(a,b){
   return a - b;
 }) //[3, 13, 24, 51]

 /* 對象排序 */
 arr = [{age:25},{age:39},{age:99}];
 arr.sort(function(a,b){
   return a.age - b.age;
 })
 arr.forEach(function(item){
   console.log("age",item.age);
 }) //age 25 age 39 age 99
4.Array.prototype.concat

數組合并(原數組不變)

 var arr = [1,2,3];
 arr.concat(4,5); //[1,2,3,4,5]
 arr; //[1,2,3] 原數組未被修改!

 arr.concat([10,11],13); //[1,2,3,10,11,13]

 arr.concat([1,[2,3]]); //[1,2,3,1[2,3]]

注:當合并的為數組時,會拉平成元素,但合并的數組中還有數組的話,不能拉平數組中的數組

5.Array.prototype.slice

返回部分數組(原數組不變)

    var arr = [1,2,3,4,5];
    arr.slice(1,3); //[2,3] 左閉右開
    arr.slice(1); //[2,3,4,5] 一個參數,從索引開始到最后
    arr.slice(1,-1); //[2,3,4] 負數索引,從后往前數,最后一個為-1
    arr.slice(-4,-3); //[2]
6.Array.prototype.splice

數組拼接(原數組變)

 var arr = [1,2,3,4,5];
 /* 一個參數:索引 */
 arr.splice(2); //returns [3,4,5]
 arr; //[1,2]

 arr = [1,2,3,4,5];
 /* 兩個參數:索引 | 個數 */
 arr.splice(2,2); //returns [3,4]
 arr; //[1,2,5];

 arr = [1,2,3,4,5];
 /* 多個參數:索引 | 個數 | 待插入元素 */
 arr.splice(1,1,"a","b"); //returns [2]
 arr; //[1,"a","b",3,4,5]
7.Array.prototype.forEach

數組遍歷

    var arr = [1,2,3,4,5];
    arr.forEach(function(x, index, a){
      console.log(x + "|" + index + "|" + (a === arr));
    })
8.Array.prototype.map

數組映射(原數組不變)

    var arr = [1,2,3];
    arr.map(function(x){
      return x + 10;
    }); //[11,12,13]
    arr; //[1,2,3]
9.Array.prototype.filter

數組過濾(原數組不變)

    var arr = [1,2,3,4,5,6,7,8,9,10];
    arr.filter(function(x, index){
      return index % 3 === 0 || x >= 8;
    });// returns [1,4,7,8,9,10]
    arr; //[1,2,3,4,5,6,7,8,9,10]
10.Array.prototype.every & some

數組判斷

    var arr = [1,2,3,4,5];
    arr.every(function(x){
      return x < 10;
    }); //true
    arr.every(function(x){
      return x < 3;
    }); //false
    arr.some(function(x){
      return x === 3;
    }); //true
    arr.some(function(x){
      return x === 100;
    }); //false
11.Array.prototype.reduce & reduceRight
 var arr = [1,2,3];
 var sum = arr.reduce(function(x, y){
   return x + y;
 },0); //6
 arr; //[1,2,3]

 arr = [3,9,6];
 var max = arr.reduce(function(x, y){
   console.log(x + "|" + y);
   return x > y?x:y;
 });
 // 3 | 9
 // 9 | 6
 max; //9

注:計算邏輯,當有第二個可選參數時,也就是上面的0,第一次計算 0+1,第二次將上一次結果1和數組中第二個元素相加,第三次將上次結果和下一個元素相加;若沒有第二個參數,則第一次取前兩個,所得結果和下一個元素進行下一次運算

     max = arr.reduceRight(function(x, y){
      console.log(x + "|" +y);
      return x > y?x:y;
     });
     // 6 | 9
     // 9 | 3
     max; //9

注:從右向左傳參

12.Array.prototype.indexOf & lastIndexOf

數組檢索

    var arr = [1,2,3,2,1];
    //查找元素2
    arr.indexOf(2); //1
    //查找元素99
    arr.indexOf(99); //-1
    //查找元素1,從第二個元素開始
    arr.indexOf(1,1); //4
    //查找元素1,從倒數第三個元素開始
    arr.indexOf(1,-3); //4
    //查找元素2,從最后一個元素開始
    arr.indexOf(2,-1); //-1
    //查找元素2,從右向左找
    arr.lastIndexOf(2); //3
    //查找元素2,從右向左找,從倒數第二個元素開始
    arr.lastIndexOf(2,-2); //3
    //查找元素2,從右向左找,從倒數第三個元素開始
    arr.lastIndexOf(2,-3); //1

注:不知道看到上面這8個示例是不是暈了,理一理:
①兩個方法都可以接收兩個參數,第一個為要查找的元素(必選),第二個為開始位置索引(可選)
②所得結果為元素的索引(也稱下標),正數即索引(無論怎么找,都是從左向右,從0開始!),-1即未找到
③方法的第二個參數:若為正數,從前往后索引(0開始);若為負數,從后往前索引(-1開始)

13.Array.isArray

判斷是否為數組

    Array.isArray([]); //true
    //另外幾種
    [] instanceof Array; //true
    ({}).toString.apply([]) === "[object Array]"; //true
    [].constructor === Array; //true (這種不可靠,如繼承)
數組小結 數組 VS 一般對象

相同:都可以繼承。數組是對象,對象不一定是數組。都可以當做對象添加刪除屬性。
不同:數組自動更新length。按索引訪問數組常常比訪問一般對象屬性明顯迅速。
數組對象繼承Array.prototype上的大量數組操作方法

字符串和數組

字符串可以理解為類數組,但它不是數組

 var str = "hello world";
 str.charAt(0); //"h"
 str[1]; //e

 Array.prototype.join.call(str,"_");
 //"h_e_l_l_o_ _w_o_r_l_d"

博客地址:js不完全入門之數組

歡迎交流指正~

文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。

轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/80113.html

相關文章

  • vue.js入門教程基礎語法

    摘要:與綁定數據綁定一個常見需求是操作元素的列表和它的內聯樣式。兩者只能選其一對象語法我們可以傳給一個對象,以動態地切換。注意不支持語法。相比之下,簡單得多元素始終被編譯并保留,只是簡單地基于切換。這意味著將分別重復運行于每個循環中。 vue Class 與 Style 綁定 數據綁定一個常見需求是操作元素的 class 列表和它的內聯樣式。因為它們都是屬性,我們可以用 v-bind 處理...

    pumpkin9 評論0 收藏0
  • D3js入門

    摘要:子選集直接通過返回,和子選集分別通過和返回。截止上面也并不是非得用不可,就是一些插入操作,原生也是可以實現的。 相對于echart, highchart等其他圖表庫算是一個比較底層的可視化工具,簡單來講他不提供任何一種現成的圖表,所有的圖表都是我們在它的庫里挑選合適的方法構建而成。 基于上面的理解,d3無疑會復雜很多但是也強大自由的多,另外因為d3基于svg所以修改圖表的樣式和結構也會...

    guqiu 評論0 收藏0
  • 前端文檔收集

    摘要:系列種優化頁面加載速度的方法隨筆分類中個最重要的技術點常用整理網頁性能管理詳解離線緩存簡介系列編寫高性能有趣的原生數組函數數據訪問性能優化方案實現的大排序算法一怪對象常用方法函數收集數組的操作面向對象和原型繼承中關鍵詞的優雅解釋淺談系列 H5系列 10種優化頁面加載速度的方法 隨筆分類 - HTML5 HTML5中40個最重要的技術點 常用meta整理 網頁性能管理詳解 HTML5 ...

    jsbintask 評論0 收藏0
  • 前端文檔收集

    摘要:系列種優化頁面加載速度的方法隨筆分類中個最重要的技術點常用整理網頁性能管理詳解離線緩存簡介系列編寫高性能有趣的原生數組函數數據訪問性能優化方案實現的大排序算法一怪對象常用方法函數收集數組的操作面向對象和原型繼承中關鍵詞的優雅解釋淺談系列 H5系列 10種優化頁面加載速度的方法 隨筆分類 - HTML5 HTML5中40個最重要的技術點 常用meta整理 網頁性能管理詳解 HTML5 ...

    muddyway 評論0 收藏0

發表評論

0條評論

bergwhite

|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<