JavaScript基础与进阶

基本概念

1.数组是值的有序集合
每个值叫做一个元素，而每个元素在数组中有一个位置，以数字表示，称为索引。

2.数组是无类型的
数组元素可以是任意类型，并且同一个数组中的不同元素也可能有不同的类型。

3.数组是动态的
根据需要它们会增长或缩减，并且在创建数组时无须声明一个固定的大小或者在数组大小变化时无须重新分配空间。

4.数组可以是稀疏的

• 数组元素的索引不一定要连续的，它们之间可以有空缺。
• 每个JavaScript数组都有一个length属性。
• 针对非稀疏数组，该属性就是数组元素的个数。
• 针对稀疏数组，length比实际元素个数要大。

操作数组

创建数组

1.数组字面量

let empty = [];
let primes = [2, 3, 5, 7, 11];
let misc = [1.1, true, "a"];
let base = 10;
let numbers = [base, base + 1, base++, ++base];
let b = [
  [1, { x: 1, y: 2 }],
  [2, { x: 3, x: 4 }],
];
let count = [1, , 3];//[1,空位,3]
let others = [, ,];

2.构造函数Array( )

let a1 = new Array(); //相当于[]
let a2 = new Array(10);//括号里为长度
let a3 = new Array(1, 2, 3, "四", "五", "六");
//括号里为数组的参数

读写数组元素

使用[ ]操作符来访问数组中的一个元素。

• 方括号中是一个返回非负整数值的任意表达式。
• 使用该语法既可以读又可以写数组的一个元素。

let a = ["world"];
let value = a[0];
a[1] = 3.14;
i = 2;
a[i] = 3;
a[i + 1] = 4;
a[a[i]] = a[0];
a["10"] = "hi";//从4到9会有6个空位
a["ten"] = "hoo";//属性的扩展
a[-2] = -2;
a[1.11] = 1.11;

稀疏数组

• 包含从0开始的不连续索引的数组。
• 可以用Array()构造函数或简单地指定数组的索引值大于当前的数组长度来创建稀疏数组。

let a1 = [, , ,];
  let a2 = new Array(4);
  console.log(1 in a1, 1 in a2);//用in检测，空位是不存在的
  a1[10] = 100;
  a1[8] = undefined;
  for (let a in a1) {//不遍历空位，循环变量是索引
    console.log(a, a1[a]);
  }
  //for (let b of a1) {//遍历空位,循环变量是值本身，空索引为undefined
    //console.log(b);
  //}

数组长度

每个数组有一个length属性，代表数组中元素的个数。

• 设置为一个小于当前长度的非负整数n时，当前数组中那些索引值大于或等于n的元素将从中删除。
• 设置为大于其当前的长度，会在数组尾部创建一系列空的区域(为empty)。
• 可以用Object.defineProperty()让数组的length属性变成只读的。

let arr=[1,2,3];
arr.length=5;
console.log(arr);//长度为5
Object.defineProperty(arr,"length",{
   writable:false,//修改为只读
   configurable:false,
});
arr.length=3;//赋值是无效的，没有成功
console.log(arr);//长度依然为5

// arr.push(1000);//报错，不成功
// console.log(arr);
Object.defineProperty(arr,"length",{
   writable:true   //报错，不能进行配置了
);

数组元素的添加和删除

let arr=[1,2,3];
arr[arr.length]=4;
arr.push(5);//尾部追加元素
arr.unshift(0);//在头部追加元素，之前的索引会依次往后排
console.log(arr);//[0,1,2,3,4,5]

delete arr[1];//将1的位置制为空
console.log(arr);//数组长度不变

arr.pop();//在尾部删除元素，返回
arr.shift();//在头部删除元素，返回
console.log(arr);

arr.splice(1,2,...[22,33]);//从1开始删除两个，换成22,33
console.log(arr);

arr.splice(1,0,...[222,333]);//从1位置插入
console.log(arr);

arr.splice(1,2);//从1开始。删除不替换
console.log(arr);

数组遍历

let arr=[1,2,3,4,5];
console.log(Object.keys(arr));//keys是获取索引
arr.test='hello';
console.log(Object.keys(arr));
console.log(Object.values(arr));
// for(let k in arr){
//     console.log(k,arr[k]);
// }
arr[8]=9;
for(let k in arr){//因为会有扩展值，所以不能修改
    console.log(k,arr[k]);//会放过空位，但扩展属性也会被遍历到
}
for(let d of arr){//只是将元素值赋值给d，不能修改
    console.log(d);//虽然不放过空位，但只遍历出数值，遍历不到扩展值，空位全部理解为undefined
}

//要对数组进行修改，只能用传统的for循环
arr[7]=undefined;
for(let i=0;i<arr.length;i++){
    if(i in arr)
    console.log(arr[i]);
}

数组方法

实例方法

1.join( )

• 将数组中所有元素都转化为字符串并连接在一起，返回最后生成的字符串。
• 可以指定一个可选的字符串在生成的字符串中来分隔数组的各个元素。如果不指定分隔符，默认使用逗号。

let arr = [1, 2, 3, 4, 5];
console.log(arr.join("-"), arr.join());

2.reverse( )

• 将数组中的元素颠倒顺序，返回逆序的数组。

let r_arr = arr.reverse();
console.log(r_arr, arr);

3.sort( )

• 将数组中的元素排序并返回排序后的数组。默认按照字符顺序(Unicode编码)排序。
• 当不带参数调用sort()时，数组元素以字母表顺序排序(如有必要将临时转化为字符串进行比较)。

let data = [22, 4, 111, 30];
let sdata = data.sort();
console.log(data, sdata);

• 给sort()方法传递一个比较函数。该函数决定了它的两个参数在排好序的数组中的先后顺序。

sdata = data.sort(function (a, b) {//传入数值进行比较
    return a - b;//a-b的值做比较的依据(从小到大)
    return b - a;//b-a的值做比较的依据(从大到小)
});
console.log(sdata);

4.concat( )

• 创建并返回一个新数组，原数组不变，它的元素包括调用concat()的原始数组的元素和concat()的每个参数。

let a1 = arr.concat(10, 20);
let a2 = arr.concat([10, 20]);
let a3 = arr.concat([10, 20], [30, 40]);
let a4 = arr.concat([10, [20, 30]]);
console.log(a1);
console.log(a2);
console.log(a3);
console.log(a4);
console.log([...arr, 10, 20]);

5.slice( )

• 返回指定数组的一个片段或子数组。
• 它的两个参数分别指定了片段的开始和结束的位置，不包括结束索引。

let sub_arr = arr.slice(3, 8);
console.log(sub_arr);
sub_arr = arr.slice(1, -1);
console.log(sub_arr);

6.splice( )

• 是在数组中插入或删除元素的通用方法。
• 不同于slice()和concat()，splice()会修改调用的数组。

7.push( )和pop( )

• push()和pop()方法允许将数组当做栈来使用。
• push()方法在数组的尾部添加一个或多个元素，并返回数组新的长度。
• pop()方法则相反：它删除数组的最后一个元素，减小数组长度并返回它删除的值。
  注意，两个方法都修改并替换原始数组而非生成一个修改版的新数组。

8.unshift()和shift()

• unshift()在数组的头部添加一个或多个元素，并将已存在的元素移动到更高索引的位置来获得足够的空间，最后返回数组新的长度。
• shift()删除数组的第一个元素并将其返回，然后把所有随后的元素下移一个位置来填补数组头部的空缺。