JS——数组

数组：

• 声明可跨多行
• 不要再最后一个元素后面写逗号，可能存在跨浏览器兼容性问题。
• 访问方式和python中的列表一样
• 是特殊的对象，使用typeof时，会返回“object”
• 数组是特殊类型的对象。
• 可以在数组中保存对象，函数，数组也可以。

var array-name = [item1, item2, ...];
                  
var cars = [
    "Saab",
    "Volvo",
    "BMW"     //这里请不要使用逗号
];

数组访问：

var name = cars[0];

遍历数组元素：

fruits = ["Banana", "Orange", "Apple", "Mango"];
fLen = fruits.length;
text = "<ul>";
for (i = 0; i < fLen; i++) {
     text += "<li>" + fruits[i] + "</li>";
} 

也可使用foreach函数

var fruits, text;
fruits = ["Banana", "Orange", "Apple", "Mango"];

text = "<ul>";
fruits.forEach(myFunction);
text += "</ul>";

function myFunction(value) {
  text += "<li>" + value + "</li>";
}

 添加元素：

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Lemon");                // 向 fruits 添加一个新元素 (Lemon)

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length] = "Lemon";     // 向 fruits 添加一个新元素 (Lemon)

Const

• 用const定义的数组不能重新赋值
• 它不定义常量数组，它定义的是对数组的常量引用。
• 但任然可以更改常量数组的元素
• const变量在声明时，必须赋值
• 是块级作用域
• 不允许在同一作用域或同一块中将数组重新命名和重新赋值给const
• 但允许另一个作用域或块中进行const重新命名数组。

const cars = ["Saab", "Volvo", "BMW"];
cars = ["Toyota", "Volvo", "Audi"];    // ERROR

// 您可以创建常量数组：
const cars = ["Saab", "Volvo", "BMW"];

// 您可以更改元素：
cars[0] = "Toyota";

// 您可以添加元素：
cars.push("Audi");

方法：

• Array.isArray（判断是否为数组）

Array.isArray(fruits);     // 返回 true

• join（合并）

将所有数组元素结合为一个字符串

var fruits = ["Banana", "Orange","Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.join(" * "); 

//Banana * Orange * Apple * Mango

• pop（删除末位）

从最后一个位开始删除，返回删除的值。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x = fruits.pop();      // x 的值是 "Mango"

• shift（删除首个）

删除首个数组元素，并把所有其他元素“移位”到更低的索引。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.shift();            // 从 fruits 删除第一个元素 "Banana"

• push（向后添加） 

插入到最后一个位置中，并返回整体个数。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x =  fruits.push("Kiwi");   //  x 的值是 5

• unshift（向前添加）

向数组0位置添加元素，并向后推原有元素。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon");    // 向 fruits 添加新元素 "Lemon"

• splice（拼接）

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 0, "Lemon", "Kiwi");

//第一个参数（2）定义了应添加新元素的位置（拼接）。
//第二个参数（0）定义应删除多少元素。
//其余参数（“Lemon”，“Kiwi”）定义要添加的新元素。
//splice() 方法返回一个包含已删除项的数组

用splice来删除元素

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(0, 1);        // 删除 fruits 中的第一个元素

• concat（合并）

合并两个数组，并创建一个新的数组。

var arr1 = ["Cecilie", "Lone"];
var arr2 = ["Emil", "Tobias", "Linus"];
var arr3 = ["Robin", "Morgan"];
var myChildren = arr1.concat(arr2, arr3);   // 将arr1、arr2 与 arr3 连接在一起

•  slice（切片）

将数组的某个片段切出新的数组。不会从源数组中删除任何元素。

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(3); //从3号开始后面所有元素

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1, 3); //表示1-3，不包括3号元素

•  sort（正排序）

字符串是以字母顺序对数组进行排序

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();            // 对 fruits 中的元素进行排序

数字的正排序

var points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return a - b}); 

查找最高或最低的数组值：

var points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return a - b});

// 现在 points[0] 包含最低值
// 而 points[points.length-1] 包含最高值

• reverse（反排序）

 字符串以降序对数组进行排序

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();            // 对 fruits 中的元素进行排序
fruits.reverse();         // 反转元素顺序

 数字的降序排序：

var points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return b - a}); 

使用Math.max.apply和Math.min.apply在查找数组中的最高和最低值。

function myArrayMax(arr) {
    return Math.max.apply(null, arr);
}
//Math.max.apply([1, 2, 3]) 等于 Math.max(1, 2, 3)。

function myArrayMin(arr) {
    return Math.min.apply(null, arr);
}
//Math.min.apply([1, 2, 3]) 等于 Math.min(1, 2, 3)。

数组迭代

1. 即对每一个数组内的元素进行一次操作。

• Array.forEach

为每个元素调用一次函数（回调函数）

var txt = "";
var numbers = [45, 4, 9, 16, 25];
numbers.forEach(myFunction);

function myFunction(value, index, array) {  //三个值项目值，项目索引，数组本身
  txt = txt + value + "<br>"; 
}

• Array.map()

  1. 通过对每个数组元素执行函数来创建新的数组
  2. 不会对没有值的数组元素执行函数
  3. 不会更改原始数组

<body>

<h1>JavaScript Array.map()</h1>

<p>通过对每个数组元素执行函数来创建新数组。</p>

<p id="demo"></p>

<script>
var numbers1 = [45, 4, 9, 16, 25];
var numbers2 = numbers1.map(myFunction);

document.getElementById("demo").innerHTML = numbers2;

function myFunction(value, index, array) {  //项目值 项目索引 数组本身，当回调函数只有value时，可以省略索引。
  return value * 2;
}
</script>

</body>

• Array.filter()

  1. 进行筛选，并创建新的数组。
  2. some，every性质一样。

var numbers = [45, 4, 9, 16, 25];
var over18 = numbers.filter(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

• Array.indexOf()

  1. 在数组中搜索元素值并返回其位置
  2. 从0位开始。如果未找到返回-1
  3. 如果项目出现多次，那么只返回第一次命中位置。
  4. Array.lastindexOf()是从后开始搜索。

var fruits = ["Apple", "Orange", "Apple", "Mango"];
var a = fruits.indexOf("Apple");

• Array.find()

  1. 返回通过测试函数的第一个数组元素的值
  2. Array.findIndex（）是返回第一个数组的索引

var numbers = [4, 9, 16, 25, 29];
var first = numbers.find(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}