Javascript 数组练习 及 简单总结

       

        简单了解： 数组，就是有序的元素序列，这个序列的顺序由下标来维护的。下面的一些总结和小练习，跟着练一遍即可。

属性

        length 是 array 的实例属性，返回或 设置一个数组的元素个数。

该值是一个有上限的数，一个无符号32位的整数，此值并且总是大于数组最高项的下标。

作为印证，写了以下代码，运行结果，以作印证。

let arrData = [];

console.log(arrData.length);

arrData.length = 22_0000_0000;

console.log(arrData.length);

arrData.length = 48_0000_0000;

console.log(arrData.length);

运行结果：如下：

0
2200000000
D:\all-projects-source\music-web-2021\src\main\webapp\offer\javascript\MyJavascriptArray.js:9
arrData.length = 48_0000_0000;
               ^

RangeError: Invalid array length
    at Object.<anonymous> (D:\all-projects-source\music-web-2021\src\main\webapp\offer\javascript\MyJavascriptArray.js:9:16)
    at Module._compile (internal/modules/cjs/loader.js:1063:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:72:12)
    at internal/main/run_main_module.js:17:47

ps:JS 的Array 在我看来，很类似Java 中在数组为原型的基础上封装的ArrayList 。

学了 length属性 ，我们可以做到什么？  访问最后一个数组的元素，和遍历数组。

let arrData = [];

// 由于 typeof JavaScript运算符 返回 object ， 那么如何知道 某个变量是否是数组呢？
// ECMA5 中，定义了新的方法 Array.isArray(arr);
let isArray = Array.isArray(arrData);
console.log(isArray);

//ECMA5之前的判断方式。（基本不用考虑浏览器不支持JS版本的问题）
console.log(arrData.constructor.toString().indexOf("Array")> -1);


let fruits = ["Banana","Orange","Apple","Mango"];

let first = fruits[0];
let last = fruits[fruits.length-1];


let text,fruitsLength,i;
fruitsLength = fruits.length;

text = "<ul>";
for(i = 0 ;i<fruitsLength;i++){
    text += `
<li>${fruits[i]}</li>`;
}
console.log(text+"</ul>");


//也可以使用Array.foreach() 函数。

let strings = ["1",'2','3','4','5','6'];

let forEachCallback = function(e){
    text += e;
};

strings.forEach(forEachCallback);


console.log(text);

方法

是 不会改变原数组的方法。

/**
 * 方法 ： 不会改变原数组的方法。
 * @type {string[]}
 */
let fruits = ["Banana","Orange","Apple","Mango"];

let numArr = ["1",'2','3','4','5','6'];

let concatArrNoChange = numArr.concat(fruits);
console.log(concatArrNoChange);
console.log("concat 结束，原来的数组不会发生变化。")
console.log(fruits);
console.log(numArr);




// 删除最后一个元素。
let s = numArr.pop();
console.log(s);
console.log(numArr);
//尾部增加元素。
numArr.push("push");
console.log(numArr);



//操作首部元素。
numArr = ["1",'2','3','4','5','6'];
let shiftElement = numArr.shift(); // shift 删除头部元素。
console.log(shiftElement);
console.log(numArr);
numArr.unshift("unshift");
console.log(numArr);



// 从哪里开始删除多少个，然后用什么样的数组来替换。   splice 拼接的意思。
let numArrInit =  ["0","1",'2','3','4','5','6'];
numArrInit.splice(3,2,"123","456","789");
console.log(numArrInit);


console.log("slice函数  相当于一个拍个快照片 不会改变原来的函数。 ")
numArrInit =  ["0","1",'2','3','4','5','6'];
let strings = numArrInit.slice(2,3); // 从offset 2 的位置 ，拍照到 offset 3的位置。
console.log(strings);
console.log(numArrInit);