Javascript數(shù)組及類數(shù)組相關(guān)原理詳解

更新時間：2020年10月29日 14:47:03 作者：杰哥之家

這篇文章主要介紹了Javascript數(shù)組及類數(shù)組相關(guān)原理詳解,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下

數(shù)組創(chuàng)建方式有兩種

1. var arr = []

2. var arr = new Array()

如果只有一個參數(shù)會指定數(shù)組的長度，當(dāng)一個參數(shù)時只能是整形，如下例子

var arr = new Array(10)
var arr = new Array(10.2) //會報錯
var arr = new Array(1, 2, 3) //arr = [1, 2, 3]

數(shù)組常用方法

改變原數(shù)組 push pop shift unshift sort reverse splice

不改變原數(shù)組 concat join ---> split toString slice

比如 push 函數(shù)，看一下例子

var arr = [1, 2, 3]
arr.push(4, 5) //arr = [1, 2, 3, 4, 5] 向數(shù)組最后一位添加元素，參數(shù)可以多個
//實現(xiàn)原理
Array.prototype.push = function() {
　　for(var i = 0; i < arguments.length; i++) {
　　　　this[this.length] = arguments[i]
　　}
}

其中函數(shù)功能，如下

arr.pop()  //arr = [1, 2, 3, 4] 刪除數(shù)組最后一位
arr.unshift(-1, 0) //arr = [-1, 0, 1, 2, 3, 4] 向數(shù)組最前面一位添加元素， 參數(shù)也可以多個
arr.shift() //arr = [0, 1, 2, 3, 4] 刪除數(shù)組最前面一位
arr.reverse() //arr = [4, 3, 2, 1, 0] 數(shù)組取反，倒序
arr.splice(0, 3, 2, 2) //arr = [2, 2, 1, 0] 參數(shù)1(可以為負(fù)數(shù), 從倒數(shù)第幾位起)，從第參數(shù)1位開始，參數(shù)2，刪除參數(shù)2位， 參數(shù)3后面的， 從刪除處添加參數(shù)3及后面的參數(shù)數(shù)據(jù)
arr.sort(function(a, b) { //排序 參數(shù)時一個函數(shù)，函數(shù)參數(shù)1為數(shù)組前一個，參數(shù)2為數(shù)組后一個， 返回 小于0，前面數(shù)放前面 返回大于0，前面數(shù)放后面 返回0，不用動
　　return a > b //升序
  // return a < b //降序
})

看以下例子是實現(xiàn)一個數(shù)組亂序

var arr = [1, 2, 3, 4, 5, 6, 7]
arr.sort(function(a, b) {
　　return Math.random() - 0.5
})
console.log(arr)

看一下例子是求一串字符串的字節(jié)數(shù)

function retBytes(str) {
　　var num = str.length
　　for(var i = 0; i < str.length; i++) {
　　　　if(str.charCodeAt(i) > 255) num++
　　}
　　return num
}

再看以下例子

var arr = [1, 2, 3]
console.log(arr.concat(4, 5))
console.log(arr.concat([4, 5])) //一樣 ，拼接兩個數(shù)組返回新的數(shù)組，不改變原數(shù)組

console.log(arr.toString()) //1, 2, 3 字符串化

console.log(arr.slice(0, 2)) //[1, 2] 參數(shù)1，從參數(shù)1截取， 參數(shù)2，截取到參數(shù)2位
console.log(arr.slice(1))  //從第1位開始截取到最后一位

console.log(arr.slice()) //不變， 但是用于將一個類數(shù)組截取為一個數(shù)組， 比如arguments

console.log(arr.join(',')) //1,2,3 以參數(shù)1相連形成字符串

var str = '1,2,3'
console.log(str.split(',')) //[1,2,3] 以參數(shù)1分割成數(shù)組，與join互逆

var arr = [str, str1, str2, str3] //多個str相連 散列
arr.join('')

類數(shù)組

例如arguments

看一個類數(shù)組的例子

var obj = {
　　'0': 'a',
　　'1': 'b',
　　'2': 'c',
　　'length': 3,
　　'push': Array.prototype.push,
　　'splice': Array.prototype.splice
}
//屬性要為索引（數(shù)字）屬性，必須有l(wèi)ength屬性，最好有push方法

看一個類數(shù)組操作例子

var obj = {
　　'2': 'a',
　　'3': 'b',
　　'length': 2,
　　'push': Array.prototype.push
}
obj.push('c')   //obj[obj.length] = 'c' -> 此時 屬性'2'的值被覆蓋為 'c', length變成3
obj.push('d')　　　//obj[obj.length] = 'd' -> 此時 屬性'3'的值被覆蓋為 'd', length變成4
console.log(obj) //{2: 'c', 3: 'd', length: 4, push: Array.prototype.push}

類數(shù)組也能添加其他屬性，如下

var obj = {
　　'0': 'a',
　　'1': 'b',
　　'2': 'c',
　　'length': 3,
　　'push': Array.prototype.push,
　　'splice': Array.prototype.splice,
　　'name': 'lyj',
　　'age': 18
}

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章: