譯文： JavaScript中類數組對象

lbool 發布于2019-08-21 10:55 / 618人閱讀

摘要：所以我說的這些類數組對象是什么它們有一些，其中包括是一個很特殊的變量，你再所有函數體內都可以訪問到。讓類數組對象成為一個數組當然這個標題是不太準確的，假如我們需要將這些類數組對象變成數組一樣，我們需要建立一個新的數組。

它看起來像是一個數組，而且它有一個length屬性，然而它并不是一個數組。JavaScript有時候是一門很怪異的語言，因為你很難定義一個數組的概念而沒有什么例外的。
所以我說的這些類數組對象是什么？它們有一些，其中包括arguments,arguments是一個很特殊的變量，你再所有函數體內都可以訪問到。

1. arguments

假如你在一個工具（firebug）中檢查arguments這個變量,你會注意到它打印出來像是一個數組。它有按次序排列的元素，還有一個length屬性。

var testFunction = function() {
  console.log(arguments);
  console.log(arguments.length);
};

所以我在抱怨什么？嘗試arguments.shift(),報錯顯示arguments.shift() isn"t a function,但是shift（）是數組的一個函數。嘗試console.log(arguments.constructor),它會打印Object(),同時假如你輸入的是[].constructor,它會打印Array[]。這是不是很奇怪？
這當然不僅局限于arguments，看起來很多DOM集合都會返回這種對象，例如document.getElementsByTagName(), document.images, document.childNodes.在某些情況下，這些類似數組的更適合轉變為一個數組。

讓類數組對象成為一個數組

當然這個標題是不太準確的，假如我們需要將這些類數組對象變成數組一樣，我們需要建立一個新的數組。

var testFunction = function() {
  // Create a new array from the contents of arguments
  var args = Array.prototype.slice.call(arguments);

  var a = args.shift();
  console.log("The first argument is: %s", a);

  // send the remaining arguments to some other function
  someOtherFunction(args);
};

顯然，關鍵的地方在Array.prototype.slice.call(arguments),拆開它仔細每個部分。

Array 這是我們想要的base object的名稱

prototype 這可以被認為是一個數組實例方法的命名空間

slice 提取一個數組的一部分，并返回一個新的數組，沒有一個開始和結束索引，它只返回數組的副本.

call 這是一個非常有用的函數，允許你在調用一個對象的函數，然后在另一個函數的上下文中使用

另一個方面，如果你曾經使用原型框架，你可以通過$A()轉化這些類數組對象成為數組。
談到$A,如果你不喜歡打上面那么長的字符串代碼，并且你不使用Prototype。然后，你可以創建一條捷徑，就像Prototype folks：

var $A = function(obj) {
  return Array.prototype.slice.call(obj);
};

// Example usage:
$A(document.getElementsByTagName("li"));

原文地址：Array-like Objects in JavaScript

云服務器 GPU云服務器 javascript對象數組中類對象類型的轉化 php中類與對象定義譯文

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

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

[譯文] JavaScript工作原理：V8引擎內部+5條優化代碼的竅門

摘要：本文將會深入分析的引擎的內部實現。該引擎使用在谷歌瀏覽器內部。同其他現代引擎如或所做的一樣，通過實現即時編譯器在執行時將代碼編譯成機器代碼。這可使正常執行期間只發生相當短的暫停。原文 How JavaScript works: inside the V8 engine + 5 tips on how to write optimized code 幾周前我們開始了一個系列博文旨在深入...

dreamans 2019-08-23 18:18 評論0 收藏0
JavaScript如何工作：V8引擎深入探究 + 優化代碼的5個技巧（譯文）

摘要：引擎可以是一個標準的解釋器，也可以是一個將編譯成某種形式的字節碼的即時編譯器。和其他引擎最主要的差別在于，不會生成任何字節碼或是中間代碼。不使用中間字節碼的表示方式，就沒有必要用解釋器了。原文地址：https://blog.sessionstack.com... showImg(https://segmentfault.com/img/bVVwZ8?w=395&h=395); 數周之...

William_Sang 2019-08-22 11:12 評論0 收藏0
不再彷徨：完全弄懂JavaScript中的this（譯文總結）

摘要：至于，其只是以數組的方傳入參數，其它部分是一樣的，如下它們也可用于在中的類繼承中，調用父級構造器。間接調用，調用了父級構造器對比方法和，它倆都立即執行了函數，而函數返回了一個新方法，綁定了預先指定好的，并可以延后調用。其實this是一個老生常談的問題了。關于this的文章非常多，其實我本以為自己早弄明白了它，不過昨天在做項目的過程中，還是出現了一絲疑惑，想到大概之前在JavaScri...

YanceyOfficial 2019-08-21 10:56 評論0 收藏0
[譯文] JavaScript工作原理：內存管理+如何處理4種常見的內存泄露

摘要：本系列的第一篇文章著重提供一個關于引擎運行時和調用棧的概述。在硬件層面，計算機內存由大量的觸發器組成。每個觸發器包含幾個晶體管能夠存儲一個比特譯注位。可以通過唯一標識符來訪問單個觸發器，所以可以對它們進行讀寫操作。比特稱為個字節。原文 How JavaScript works: memory management + how to handle 4 common memory lea...

adam1q84 2019-08-26 10:33 評論0 收藏0
TypeScript入門學習之路

摘要：學習之路學習之路安裝環境起步開發工具自動編譯文件中的數據類型中的函數中類的定義繼承中的繼承中的繼承類的靜態屬性和靜態方法類的多態的抽象類中的接口中的泛型學習之路安裝環境查看版本起步新建通過命令編譯此時路徑下 ...

jemygraw 2021-11-22 09:34 評論0 收藏0