CreateListFromArrayLike called on non-object 報錯的解決方法

作者: Calpa Liu
字數:1263
出版日期:May 1, 2017
更新日期:May 1, 2017

如果你遇到 CreateListFromArrayLike 的報錯的話,那麼可以看看代碼裡面調用 apply 方法的地方,call 是用 0 個或者更多的參數,而 apply 則是用一個數組。

如果你遇到 CreateListFromArrayLike 的報錯的話,那麼可以看看代碼裡面調用 apply 方法的地方,call 是用 0 個或者更多的參數,而 apply 則是用一個數組。

錯誤例子

Math.max.apply(null, 1, 2, 3);
// Uncaught TypeError: CreateListFromArrayLike called on non-object

正確例子

Math.max.call(null, 1, 2, 3); // 3
Math.max.apply(null, [1, 2, 5, 10]); // 10

解釋

當調用 Function.prototype.apply 的時候,它會調用內置抽象操作 CreateListFromArrayLike。

CreateListFromArrayLike

CreateListFromArrayLike ( obj [ , elementTypes ] )

CreateListFromArrayLike 是一個 ECMAScript 的內置抽象操作 (Abstract Operation),用於建立一個 List 的值,它的元素由類似數組的對象的索引屬性提供。elementTypes 是一個 List,只允許自身建立的 list 擁有 ECMAScript Language 類型的值,比如undefined, null, boolean等。在調用的時候,它會執行以下步驟:

  1. 如果沒有定義elementTypes的話,它會被定義為 Undefined, Null, Boolean, String, Symbol, Number, Object 。
  2. 如果Type(obj)的類型不是 Object,拋出 TypeError 錯誤。
  3. 定義lenobj的 length。
  4. 建立一個空的 List list
  5. 定義index為 0
  6. 當 index 小於 len 的時候,重複以下步驟:
    1. 定義indexName為!ToString(index)
    2. 定義next 為?Get(obj, indexName)
    3. 如果Type(next)的類型不存在於elementType裡面,拋出 TypeError 錯誤。
    4. list的最後增加 next (list.push(next))
    5. index的值加 1
  7. 返回list

參考資料

  1. Function.prototype.apply - ECMAScript 2018
感謝您閱讀我的文章。歡迎隨時分享你的想法。
關於 Calpa

Calpa 日常幫助客戶構建一站式網站應用,手機應用,雲端架構

2023 年 9 月,Calpa 應邀出席韓國 Korea Blockchain Week 2023,新加坡 TOKEN 2049。十二月份,Calpa 將參加 Taipei Blockchain Week Hackathon。

Calpa 擅長運用各種前沿技術,包括 TypeScript、React.js 和 Vue.js,開發具有 Responsive Web Design 的網站。另外,他透過運用 aws-cdk 和 TypeScript 技術的融合,實現了基於雲端的「基礎即代碼」(Infrastructure as Code)部署策略,建立了多套高效且具有可伸縮性的全端架構。

同時,Calpa 積極參與各個社群,活躍於香港和台灣的開源社區,分享前沿知識。他曾在 2019 年的香港開源大會中擔任重要講者,為聽眾提供寶貴的工作經驗和深刻見解。此外,Calpa 在 GitHub 上公開分享了個人博客程式碼,已獲得超過 300 顆星星和 60 個分支。