判斷方法:1、利用Array對象的isArray()函數來判斷變量是不是數組,語法“Array.isArray(obj)”,如果是數組返回true,否則返回false。2、通過“Object.prototype.toString()”來判斷,語法“Object.prototype.toString.apply(a) === '[object Array]'”。

本教程操作環境:windows7系統、ECMAScript 6版、Dell G3電腦。
JS的弱類型機制導致判斷變量類型是初級前端開發者面試時的必考題,一般我都會將其作為考察候選人第一題,然后基于此展開。
在ES5中判斷變量是否為數組
在ES5中,我們至少有如下5種方式去判斷一個值是否數組:
var a = []; // 1.基于instanceof a instanceof Array; // 2.基于constructor a.constructor === Array; // 3.基于Object.prototype.isPrototypeOf Array.prototype.isPrototypeOf(a); // 4.基于getPrototypeOf Object.getPrototypeOf(a) === Array.prototype; // 5.基于Object.prototype.toString Object.prototype.toString.apply(a) === '[object Array]';
以上,除了Object.prototype.toString外,其它方法都不能正確判斷變量的類型。
要知道,代碼的運行環境十分復雜,一個變量可能使用渾身解數去迷惑它的創造者。且看:
var a = { __proto__: Array.prototype }; // 分別在控制臺試運行以下代碼 // 1.基于instanceof a instanceof Array; // => true // 2.基于constructor a.constructor === Array; // => true // 3.基于Object.prototype.isPrototypeOf Array.prototype.isPrototypeOf(a); // => true // 4.基于getPrototypeOf Object.getPrototypeOf(a) === Array.prototype; // => true
以上,4種方法將全部返回true,為什么呢?我們只是手動指定了某個對象的__proto__屬性為Array.prototype,便導致了該對象繼承了Array對象,這種毫不負責任的繼承方式,使得基于繼承的判斷方案瞬間土崩瓦解。
不僅如此,我們還知道,Array是堆數據,變量指向的只是它的引用地址,因此每個頁面的Array對象引用的地址都是不一樣的。iframe中聲明的數組,它的構造函數是iframe中的Array對象。如果在iframe聲明了一個數組x,將其賦值給父頁面的變量y,那么在父頁面使用y instanceof Array ,結果一定是false的。而最后一種返回的是字符串,不會存在引用問題。實際上,多頁面或系統之間的交互只有字符串能夠暢行無阻。
在ES6中判斷變量是否為數組
鑒于數組的常用性,在ES6中新增了Array.isArray方法,使用此方法判斷變量是否為數組,則非常簡單,如下:
Array.isArray([]); // => true Array.isArray({0: 'a', length: 1}); // => false
實際上,通過Object.prototype.toString去判斷一個值的類型,也是各大主流庫的標準。因此Array.isArray的polyfill通常長這樣:
if (!Array.isArray){ Array.isArray = function(arg){ return Object.prototype.toString.call(arg) === '[object Array]'; }; }
【
站長資訊網