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

資訊專欄INFORMATION COLUMN

JS淬煉: Array進階

jimhs / 409人閱讀

摘要:的這種實現方式導致了一些尷尬問題,比如刪除元素元素遍歷。后面的參數被忽略掉了,表示并沒有要插入的元素。其實,的本質是跟蹤中的,并始終保持值是。這時候,雖然不大可能,可能會在中間某個中被用戶重新定義。但是在上進行這種操作是很糟糕的。

在Javascript中,array是一個類數組的object。顧名思義,它能夠在一個變量上存儲多個值。

數組是值的有序集合。每個值叫做一個元素,而每個元素在數組中有一個位置,以數字表示,稱為索引。JavaScript數組是無類型:數組元素可以是任意類型,并且同一個數組中的不同元素也可能有不同的類型。 --《JavaScript權威指南(第六版)》

array在一般Javascript object基礎上,有自己額外的屬性。它采用numbered index作為的key,有一個length property跟蹤數組長度,還有如push/popshift/unshift等數組特有操作。

本質是object

作為一個object,我們可以在array上面進行所有object的合法操作,比如設置一個named key。

var test = [];
test.fruit = "APPLE";
console.log(test.fruit); // APPLE

上面僅僅把array作為一個普通的Javascript object使用,等價于var test = {}。在這種場合,我們應該選擇普通的Javascirpt object,而非array。

Numbered index

Javascript中的 array object 采用了一個很樸素的思想來實現數組 —— 用數字來充當object的keys。這樣在表面上延續了我們在C++/Java上使用數組的編程體驗。

{ 
    0 : item0, 
    1 : item1, 
    2 : item2
}

array的這種實現方式導致了一些尷尬問題,比如刪除元素、元素遍歷。我們會在后面談到這些問題。

刪除元素 delete operator(不推薦)

和一般Javascript object一樣,我們可以使用delete來刪除object中的property。

var arr = ["a", "b", "c", "d"];
delete arr[1];
console.log(arr);
console.log(arr[1]);
// [ "a", , "c", "d" ]
// undefined

當我們使用delete來刪除某一個元素arr[1]時,arr中key 1 和value b之間的連接被切斷,key 1對應的值被重置為undefined。注意,這時候,array中其他元素并沒有改變自身的index來填補這key 1這個空洞,而是保持原值。這樣,key 1就變成了arr中的一個洞了!

除非有特殊需求,比如需要用到sparse array,一般情況下并不推薦使用delete operator來刪除array中的元素。

splice() (推薦)
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(0, 1); // Removes the first element of fruits

第一個參數 (0) 定義新元素要從哪個位置插入。第二個參數 (1) 定義新元素插入位置開始有多少元素要被刪除。后面的參數被忽略掉了,表示并沒有要插入的元素。

filter()(推薦)
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var toDelete = "Apple";
fruits = fruits.filter(function(value) { 
    return value != toDelete;
});
// [ "Banana", "Orange", "Mango" ]
理解length

length是array object的一個property, 根據名字來看,似乎是記錄array的長度。其實,length的本質是跟蹤array中的max_index,并始終保持值是max_index + 1

這和記錄長度有什么區別呢?

還記得使用delete來刪除元素的情形吧?中間元素被刪了,但是其他元素沒有改變自身的index來填補空間。這時候即使delete了多個元素,數組的length可能并沒有發生變化。

var array_object = [1, 2, 3];
console.log(array_object.length); // 3
delete array_object[1];
console.log(array_object.length); // 3!
Array 遍歷

如果array中沒有“洞”, for loop和forEach兩種遍歷方式區別不大。在array有洞的情況下,兩者略有不同,其中forEach會跳過這些洞,而傳統的for loop并不會。

var array_object = [1, 2, 3];
delete array_object[1];

// 不跳過洞
for(var i=0; i

遍歷array的方法還有其他,更多方法可以參考這篇StackOverflow問答。

[] vs. new Array( )

當新建一個array時候,我們有下面兩種方式: array literal [] 或 array constructor new Array(arg)

var arrayA = [];
var arrayB = new Array();

當使用[]時候, JS engine會直接調用global Array的constructor新建一個array變量并返回。當使用new Array()時候, JS engine會沿著Execution Context往上追溯到名為Array的constructor function,并據此生成一個object。這時候,雖然不大可能,Array可能會在中間某個Execution Context中被用戶重新定義。下面是coderjoe在StackOverflow中提出的例子。在例子中,我們最后得到的并不是我們期待的原生Array。

function Array() { 
    this.is = "SPARTA";
}
var a = new Array();
var b = [];
alert(a.is); 
// => "SPARTA"
alert(b.is); 
// => undefineda.push("Woa"); 
// => TypeError: a.push is not a functionb.push("Woa"); 
// => 1 (OK)

大部分Javascirpt社區推薦使用[]來新建array。

You never need to use new Object() in JavaScript. Use the object literal {} instead. Similarly, don’t use new Array(), use the array literal [] instead. Arrays in JavaScript work nothing like the arrays in Java, and use of the Java-like syntax will confuse you. LINK

Array 復制 淺度復制
var arr1 = ["a", "b", "c"];
var arr2 = arr1; 
arr2[0] = 1; // 對數組arr2的元素進行修改
console.log(arr1); // [1, "b", "c"]
深度復制
var arr1 = ["a", "b", "c", "d", "e"];
var arr2 = arr1.concat(); // 使用concat()方法,返回新的數組
arr2[0] = 1; 
console.log(arr1); // => ["a", "b", "c", "d", "e"]:數組arr1的元素沒變更
console.log(arr2); // => [ 1, "b", "c", "d", "e"]:數組arr2的元素發生了變更
Associate Array

在計算機科學中,采用named index而非numbered index的數組被稱為Associative Array。

var associative_array = new Array();
associative_array["one"] = "Lorem";
associative_array["two"] = "Ipsum";
associative_array["three"] = "dolor";

for (i in associative_array) { 
    console.log(i);
};
// one two three 

上面操作可以應用在任何Javascript object上,array object也不例外。但是在Javascript array上進行這種操作是很糟糕的。當需要使用named string作為key時候,我們應該使用一般的object,而非array。

Javascript里面并不支持named index的array。

If you use a named index, JavaScript will redefine the array to a standard object. After that, all array methods and properties will produce incorrect results... In JavaScript, arrays always use numbered indexes. LINK

Reference

Iterating over an array with “holes” in JavaScript

Create an empty object in JavaScript with {} or new Object()?

What’s the difference between “Array and “[]” while declaring a JavaScript array?

JavaScript Array對象

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

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

相關文章

  • JS淬煉: Syntax Parser

    摘要:語法分析利用詞法分析的結果建立上下文關系語法樹。一般情況下,我們不會直接和語法樹打交道,但會在進行代碼壓縮語法高亮重編譯關鍵字匹配和作用域判斷時間接涉及到。傳統的引擎直接根據語法樹的的結果進行解釋執行,導致效率比較為低下。 一門語言的執行,大致經歷下面這些過程:詞法分析 -- 語法分析 -- 語義分析 -- 中間代碼生成 -- 優化代碼 -- 代碼生成。 在Javascript中,Sy...

    wuaiqiu 評論0 收藏0
  • JS淬煉: Primitive vs. Object

    摘要:值傳遞引用傳遞是值傳遞,是引用傳遞。但這影響會根據父類是屬于還是而有微妙差別。我們設想有一個父類,和兩個繼承了他的子類和。這時,子類修改該不會影響到父類本身,更不會傳遞到其他子類上。 Javascript有兩種基本數據類型,Primitive和Object。Object是properties的聚合,其property可以是Object也可以是Primitive。Primitive只有v...

    Hancock_Xu 評論0 收藏0
  • 進階3-3期】深度解析 call 和 apply 原理、使用場景及實現

    摘要:之前文章詳細介紹了的使用,不了解的查看進階期。不同的引擎有不同的限制,核心限制在,有些引擎會拋出異常,有些不拋出異常但丟失多余參數。存儲的對象能動態增多和減少,并且可以存儲任何值。這邊采用方法來實現,拼成一個函數。 之前文章詳細介紹了 this 的使用,不了解的查看【進階3-1期】。 call() 和 apply() call() 方法調用一個函數, 其具有一個指定的 this 值和分...

    godlong_X 評論0 收藏0
  • js基礎進階--編碼實用技巧(一)

    摘要:我的個人博客前言在平時的開發中,編碼技巧很重要,會讓你少寫很多代碼,起到事倍功半的效果。下面總結幾種簡單的技巧,大家共同學習一下利用將字符串轉換為整數型這個方法試用于將字符串類型的數字轉換為整數型,如果帶字母就會返回。 我的個人博客:http://www.xiaolongwu.cn 前言 在平時的開發中,編碼技巧很重要,會讓你少寫很多代碼,起到事倍功半的效果。 下面總結幾種簡單的技巧,...

    U2FsdGVkX1x 評論0 收藏0
  • JS進階篇5---JS數組去重的n種方式

    1、利用 indexOf() 方法之一 Array.prototype.unique = function(){ var temp = []; for (var i = 0;i < this.length;i++){ // 如果當前數組的第 i 項已經保存到了臨時數組,那么跳過 if(temp.indexOf( this[i] ) == -1){ ...

    baihe 評論0 收藏0

發表評論

0條評論

jimhs

|高級講師

TA的文章

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