js數組知識點總結及經典筆試題

1.判斷數組

這是筆試裏常常會出現的知識考察點，總結一下

（1）Array.isArray（）方法判斷

var a=[];
Array.isArray(a)    //返回true

var b='hello world';
Array.isArray(b)       //返回false

這個方法簡單有效，缺點是IE8及如下版本瀏覽器不兼容

 

（2）用instanceof判斷

var a=[];
console.log(a instanceof Array)   //返回true

obj instanceof Object 判斷 Object.prototype 是否存在在 obj 的原型鏈上，所以 a instanceof Object 也會返回 true

 

（3）根據對象的constuctor屬性判斷

var a=[];

console.log(a.constructor==Array）; //返回true

在javascript中，每一個對象都有一個constructor屬性，它引用了初始化該對象的構造函數

一般會將這個判斷方法封裝爲一個判斷數組的方法

function isArray(obj) {
    return typeof obj == 'object' && obj.constructor == Array
}

 

（4）終極判斷方法

第二第三種方法也有列外狀況，好比在跨框架iframe的時候使用頁面中的數組時會失敗，由於在不一樣的框架iframe中，建立的數組是不會相互共享其prototype屬性的；當第二第三種方法也不能用時，可使用最通用的方法 Object.prototype.toString.call()

function isArray(obj) {
    return Object.prototype.toString.call(obj) == '[object Array]';
}//僅判斷Array

function isType(data,type) {
    return Object.prototype.toString.call(data) === "[object "+type+"]";
} //通用判斷方法

 

方法中的call（）能夠換成apply（），不能直接用toString調用，由於從原型鏈的角度講，全部對象的原型鏈最終都指向了 Object， 按照JS變量查找規則，其餘對象應該也能夠直接訪問到 Object 的 toString方法，可是大部分的對象都實現了自身的 toString 方法，這樣就可能會致使 Object 的 toString 被終止查找，所以要用 call或apply 來強制調用Object 的 toString 方法。

 

（5）typeof的一些坑

typeof 判斷Array和null等特殊類型都會輸出Object，typeof 返回值有六種可能： "number"、 "string"、 "boolean"、 "object" 、"function" 和 "undefined"。

 

2.數組的經常使用方法

（1）push()、pop()和unshift()、shift()

push()，在數組的尾部添加新元素，可同時放多個參數,原數組被改變，返回添加後的數組

pop()刪除數組的最後一個元素，原數組被改變，返回被刪除的項

unshift()添加新元素到數組頭部，原數組被改變，返回添加後的數組

shift()刪除數組的第一個元素，原數組被改變，返回被刪除的項

var numArray=[2,45,12,-7,5.6,-3.4,50,132];
var arr=numArray.push(23,7);
console.log(arr);//[2,45,12,-7,5.6,-3.4,50,132,23,7]
console.log(numArray);//[2,45,12,-7,5.6,-3.4,50,132,23,7]

var num=numArray.pop();
consoleog(num);//7
console.log(numArray);//[2,45,12,-7,5.6,-3.4,50,132,23]

var num=numArray.shift();
console.log(num);//2
console.log(numArray);//[45,12,-7,5.6,-3.4,50,132,23]

var arr=numArray.unshift(1,2);
console.log(numArray);//[1,2,45,12,-7,5.6,-3.4,50,132,23]

 

（2）sort()排序方法

sort排序，默認按字母編碼規則排序，原數組被改變，返回排序後的數組

var numArray=[2,45,12,-7,5.6,-3.4,50,132];
console.log(numArray);
console.log(numArray.sort());

console.log(numArray.sort(function(a,b){return a-b;}));//按數字升序
//tip：要使回調函數中的a排在b前面，返回小於0的數
console.log(numArray);

 

 （3）slice和splice

a.slice(),返回截取的數組，原數組不改變

1個參數a：返回數組從a索引開始的部分

2個參數a,b：返回數組從a索引開始到b(不包括b)的部分

若參數不合適致使截取部分爲空，則返回空數組

 

b.splice(start,deleteAccount,value,...),返回截取的數組，改變原數組

1個參數：截取從start開始到末尾的數組

2個參數：截取從start開始deleteAccount位的數組

更多參數：截取後，將第三及以後的參數插入截取的位置

deleteAccount爲負，返回空數組

//清空數組

//numArray.splice(0);

 

兩個方法中表示索引的參數爲負數時，識別爲length+(負參數)；

var a=[1,2,3];
a.slice(-2,3);//至關於a.slice(1,3)

 

更多數組方法 http://www.runoob.com/jsref/jsref-obj-array.html

 

3.相關筆試題目

（1）有一個長度未知的數組a，若是它的長度爲0就把數字1添加到數組裏面，不然按照先進先出的隊列規則讓第一個元素出隊

a.length === 0 ? a.push(1) : a.shift();

（2）編寫一個帶參數（m,n）的函數，產生一個m個n的數組，不用循環（答案介紹了3種方法，使用時要將其餘2種方法去掉）

function mnArr(m,n){
//第一種方法
var newArr=new Array(m);
newArr.fill(n);
return newArr;

//第二種,from方法
var arr = Array.from({length:m}, (v)=> n);
return arr;

//第三種，遞歸
var arr=[];
if(arr.length<m)
{
arr[arr.length]=n;
mnArr(m,n);
}
return arr;
}
console.log(mnArr(6,4));

（3）將數組處理成嵌套對象

示例：

[{id:1,parent:null},
{id:2,parent:1},
{id:3,parent:2}];

　　變成

{
    id:1,
    parent:null,
    child:{
            id:2,
            parent:1,
            child:{
                      id:3,
                      parent:2
                    }
            }
}                

答案：

var arr=[{id:1,parent:null},
{id:2,parent:1},
{id:3,parent:2},
{id:4,parent:3},
{id:5,parent:4}];

function change(arr,index)
{
　　if(index===arr.length-1)
　　{
　　　　return arr[index];
　　}
　　else if(index>=0)
　　{
　　　　arr[index].child=change(arr,index+1);
　　　　return arr[index];
　　　　//return arr[index].child=change(arr,index+1);//child一直是最後一個
　　}
}
console.log(change(arr,0))；

代碼中註釋掉的那一行，直接運行的話只有一個child，緣由還不清楚

運用遞歸的方法，從數組的第一項開始遍歷，若是是數組除最後一項的其餘項，就將後一項做爲前一項的child

（4）將字符串數組變成整數數組

 

var arr = ['1', '2', '3'];
var r = arr.map(parseInt);//[1, NaN, NaN]
var m = arr.map(x=>parseInt(x));//[1, 2, 3]