对象数据类型

创建对象

字面量创建

var obj={}

内置构造函数创建

var obj=new Object()

对象的操作方法

语法

点语法：对象名.成员名=值
数组关联语法：对象名[成员名]=值

对象两种语法的区别

点语法：不能使用变量、不能拼接字符串
数组关联语法：可以使用变量、可以拼接字符串

操作方法

增：对象名.成员名=值 或 对象名[成员名]=值
删：delete 对象名.成员名 或 delete 对象名[成员名]
查：对象名.成员名 或 对象名[成员名]
改：对象名.成员名=值 或 对象名[成员名]=值

遍历对象 for in

for ( var 变量名 in 对象 ) { 重复执行的代码 }

var obj={
name:'Bob',
age:18
}
for（var key in obj）{
    console.log(key) //分别打印 name 和 age
    console.log(obj[key])//分别打印 Bob 和 18
}

对象内有多少个成员就执行多少次，循环的每一次，key分别是是对象的成员名称（字符串类型可以利用key和数组关联法来获取每个成员的值）

判断一个成员是否存在对象里

成员名 in 对象名

var obj={
name:'Bob',
age:18
}
console.log('name' in obj) //true

注：若成员名称为字符串，需加上''引号。

拓展

window 的 name 属性

是一个全局天生自带的属性
作用：在iframe标签和name属性合作进行跨域的
特点：被固定为字符串了

函数也是一个对象

函数保存一段代码，可保存一堆数据，当定义好一个函数后函数就有两个功能：

函数名() 这是在执行函数
函数名.成员名=值 这是存储数据

function fn()={
    console.log(123)
}
fn() //这是在执行函数，打印 123

//下面两行代码为把函数当做对象进行操作
fn.age=18
fn['gender']='男'

对象的内存存储

栈内存

基本数据类型的存储（Number、Srting、Boolean、Null、Undefined、Symbol），是有序的

堆内存

复杂数据类型的存储（Object、Array、Function、Date、RegExp、Class、Map和Set），是无序的。先在堆中开辟空间，把内容放进空间里，再把这个空间地址给到变量，变量名存储在栈中

数组数据类型

可存储任意数据类型

创建数组

字面量创建

var arr=[]

内置构造函数创建

var arr=new Array()

两种创建数组方式的区别：

字面量创建：直接加入数组成员
内置构造函数创建：当不传参时为空数组；传一个参数时为这个数组的长度；传多个参数时全是数组成员

var arr=new Array(10) //表示长度为10的空数组，结果为[,,,,,,,,,]
var arr=new Array(10,'Rose') //传多个参数时全是数组成员，结果为[10,Rose]

数组的操作

length属性

可读写

读：获取数组的长度
写：设置数组的长度（注：当设置长度比本身数组的长度小，则相当于删除掉多出来的部分；当设置长度比本身数组的长度大，则多出来的部分用空补齐）

数组排列

按索引排列，从 0 开始，依次加 1 ，到 length-1 结束。可读写：

读：如有这个索引，则为该位置的数据值；如没有这个索引，则为 undefined
写：设置指定索引位置的数据值。如有，直这个索引接更改数据值；如没有这个索引，则添加数据值；如设置索引大于 length-1 ，用空补齐

遍历数组 for

数组也是一个对象，使用点语法存储一些数据，成员不占用length位置，若用for in 循环遍历数组时，里面每一个索引位置、每一个key都会遍历出来

var arr1=new Array(10,'Rose')
for(var i=0;i<=arr1.length-1;i++){
  console.log(i) //打印arr1的索引：0 和 1
  console.log(arr1[i]) //打印arr1的数据值：10 和 Rose
}
for(key in arr1){
  console.log(key) //打印arr1的索引：0 和 1
  console.log(arr1[key]) //打印arr1的数据值：10 和 Rose

}

两种经典排序

冒泡排序

口诀：双层for循环，一层减一次，里层减外层，变量相交换。

var arr=[3,2,10,5,0]
for(var i=0;i<arr.length-1;i++){
  for(var j=0;j<arr.length-1-i;j++){
    if(arr[j]>arr[j+1]){
      var temp=arr[j]
      arr[j]=arr[j+1]
      arr[j+1]=temp
    }
  }
}
console.log(arr) //[0,2,3,5,10]

选择排序

每次找到一个最小的数字放在前面

如何找到数组里最小的数字？

循环遍历数组
假设索引 [0] 位置的数字最小
如有数字比 [0] 的数字小，则交换索引

重复步骤1

第二次假设 [1] 位置的数字最小
重复 length-1 遍总结：外层循环遍历索引 i 代表假设的最小的数字索引，里层从 i+1 开始循环

for(var i=0;i<arr.length;i++){
  var minIndex=i
  for(var j=i+1;j<arr.length;j++){
    if(arr[j]<arr[minIndex]){
      minIndex=j
    }
  }
   var temp=arr[i]
   arr[i]=arr[minIndex]
   arr[minIndex]=temp
}
console.log(arr) //[0,2,3,5,10]

数组的常用方法

push()

语法：数组.push(数据1,数据2,数据3,......)
作用：把所有参数按照顺序追加到数组的末尾
返回值：追加后数组的长度

const array = [1, 2, 3, 4];

const newLength = array.push(5);
console.log(newLength);  // 输出: 5
console.log(array);  // 输出: [1, 2, 3, 4, 5]

注意：push() 方法会修改原始数组，并返回新的长度

pop()

语法：数组.pop()
作用：删除数组最后一个数据
返回值：被删除的数据

const array = [1, 2, 3, 4, 5];

const lastElement = array.pop();
console.log(lastElement);  // 输出: 5
console.log(array);  // 输出: [1, 2, 3, 4]

注意：pop() 方法会修改原始数组，并返回被删除的元素

unshift()

语法：数组.unshift(数据1,数据2,数据3,......)
作用：把所有参数按照顺序追加到数组的最前
返回值：追加后数组的长度

const array = [2, 3, 4, 5];

const newLength = array.unshift(1);
console.log(newLength);  // 输出: 5
console.log(array);  // 输出: [1, 2, 3, 4, 5]

注意：unshift() 方法会修改原始数组，并返回新的长度

shift() 直接操作原数组

语法：数组.shift()
作用：删除数组最前面的数据
返回值：被删除的数据

const array = [1, 2, 3, 4, 5];

const firstElement = array.shift();
console.log(firstElement);  // 输出: 1
console.log(array);  // 输出: [2, 3, 4, 5]

注意：shift() 方法会修改原始数组，并返回被删除的元素

reverse()

语法：数组.reverse()
作用：反转数组
返回值：反转后的数组

onst array = [1, 2, 3, 4, 5];

array.reverse();
console.log(array);  // 输出: [5, 4, 3, 2, 1]

注意：reverse() 方法会原地修改数组，并返回反转后的数组

sort()

语法：

数组.sort() 默认情况下按照每一个数据的ASCII码进行排列；
不默认的话可以自定义排序函数，如下代码块：

数组.sort(function(a,b){
    return a-b //升序
})

数组.sort(function(a,b){
    return b-a //降序
})

作用：数组排序
返回值：排序后的数组

const array = [5, 1, 3, 2, 4];

// 默认按照 Unicode 编码排序
array.sort();
console.log(array);  // 输出: [1, 2, 3, 4, 5]

// 自定义排序函数
array.sort((a, b) => a - b);
console.log(array);  // 输出: [1, 2, 3, 4, 5]

注意：sort() 方法会原地修改数组，并返回排序后的数组

splice()

语法：

数组.splice(开始索引,截取个数) 从开始索引开始，截取多少个，若第二个参数不写，默认截取到末尾；
数组.splice(开始索引,截取个数,替换数据1,替换数据2,......) 把替换数据按顺序插入到截取的位置（注：从哪个索引开始删除，替换数据的第一个就插到哪个位置；若截取个数为0，则只插入不删除）

作用：
1.截取数组
2.替换新的内容
返回值：一定是一个数组，返回一个包含被删除元素的新数组。如截取0个，则返回空数组

const array = ['a', 'b', 'c', 'd', 'e'];

const deleted = array.splice(2, 2);  // 删除从索引位置2开始的2个元素
console.log(array);  // 输出: ['a', 'b', 'e']
console.log(deleted);  // 输出: ['c', 'd']

array.splice(2, 0, 'x', 'y', 'z'); // 在索引位置2插入新元素
console.log(array);  // 输出: ['a', 'b', 'x', 'y', 'z', 'e']

注意：splice() 方法会修改原始数组，并返回一个包含被删除元素的新数组。

slice()

语法： 数组.slice(开始索引,结束索引)
包前不包后。若开始索引不写，表示从头截取；若结束索引不写，表示默认为原始数组的长度
作用：获取数组里的某些数据
返回值：一个数组，返回截取的值，若一个都不获取，则返回空数组，不改变原数组

const array = [1, 2, 3, 4, 5];

const newArray = array.slice(1, 4); //截取索引位置 1 到索引位置 4（不包括索引位置 4）之间的元素
console.log(newArray);  // 输出: [2, 3, 4]

const array = [1, 2, 3, 4, 5];

const newArray = array.slice(2); //省略结束索引，则提取从开始索引位置到数组末尾的所有元素：
console.log(newArray);  // 输出: [3, 4, 5]

注意：slice() 方法不会修改原始数组，而是返回一个新的数组

concat()

语法： 数组.concat(数组1,数组2,......)
作用：如参数是数组，则把数组拆开，里面每一项追加到原数组后面；如参数是数据，则直接追加在原数组后面
返回值：追加后的数组，不改变原数组

const array2 = [4, 5, 6];

const newArray = array1.concat(array2);
console.log(newArray);  // 输出: [1, 2, 3, 4, 5, 6]

const array1 = [1, 2, 3];
const array2 = [4, 5, 6];
const array3 = [7, 8, 9];

const newArray = array1.concat(array2, array3);
console.log(newArray);  // 输出: [1, 2, 3, 4, 5, 6, 7, 8, 9]

注意：concat() 方法不会修改原始数组，而是返回一个新的数组

join()

语法： 数组.join(‘连接符号’) 不传参默认用 ,号隔开
作用：把数组拆开里面每个数据用连接符号连接在一起
返回值：连接号的内容，是一个Srting类型，不改变原数组

const array = [1, 2, 3, 4, 5];

const joinedString = array.join();
console.log(joinedString);  // 输出: "1,2,3,4,5"

const array = [1, 2, 3, 4, 5];

const joinedString = array.join("-");
console.log(joinedString);  // 输出: "1-2-3-4-5"

注意：join() 方法不会修改原始数组，而是返回一个新的字符串

indexOf()

从左到右依次查找

语法：
1.数组.indexOf(数据)
2.数组.indexOf(数据,开始索引)
作用：查找数组里指定数据的索引
返回值：如有这个数据，则返回第一个满足条件的索引；如没有这个数据，则返回 -1

const array = [1, 2, 3, 4, 3, 5];

const index = array.indexOf(3);
// 如果要查找的元素在数组中多次出现，`indexOf()` 方法只返回第一个匹配的索引值
console.log(index);  //输出: 2

const array = [1, 2, 3, 4, 5];

const index = array.indexOf(6);
 //如果要查找的元素不存在于数组中，则 `indexOf()` 方法返回 -1
console.log(index);  //输出: -1

注意:indexOf() 方法对于数组和字符串都适用，但对于字符串来说，它查找的是字符而不是元素。

lastIndexOf()

从右到左依次查找

语法：
1.数组.lastIndexOf(数据)
2.数组.lastIndexOf(数据,开始索引)
作用：反向查找数组里指定数据的索引
返回值：如有这个数据，则返回第一个满足条件的索引；如没有这个数据，则返回 -1

const array = [1, 2, 3, 4, 3, 5];

const lastIndex = array.lastIndexOf(3);
console.log(lastIndex);  // 输出: 4

const array = [1, 2, 3, 4, 3, 5];

const lastIndex = array.lastIndexOf(3);
//如果要查找的元素在数组中多次出现，`lastIndexOf()` 方法只返回最后一个匹配的索引值
console.log(lastIndex);  // 输出: 4

const array = [1, 2, 3, 4, 5];

const lastIndex = array.lastIndexOf(6);
//如果要查找的元素不存在于数组中，则 `lastIndex()` 方法返回 -1
console.log(lastIndex);  // 输出: -1

forEach()

语法：数组.forEach(function(item,index,arr){})
item：数组里的每一项
index：数组里的每一项的索引
arr：原始数组
作用：取代for循环的作用，遍历数组
返回值：没有返回值

const array = [1, 2, 3, 4, 5];

array.forEach(function(item, index, arr) {
  console.log(item); //1 2 3 4 5 
  console.log(index); //0 1 2 3 4
  console.log(arr);//打印5次 1,2,3,4,5
});

注意：使用 forEach() 方法时，无法使用 break 或 return 来提前终止循环。如果需要在特定条件下终止循环，可以考虑使用 for 循环或 some() 方法。

map()

语法：数组.map(function(item,index,arr){})
item：数组里的每一项
index：数组里的每一项的索引
arr：原始数组
作用：对数组中的每个元素进行处理
返回值：返回一个新数组，对原始数组中的每个元素都执行回调函数，并将处理结果存储在新数组中，不会修改原始数组

const array = [1, 2, 3, 4, 5];

const newArray = array.map(function(item) {
  //将每个元素乘以 2，然后将处理结果存储在新数组 newArray 中
  return item * 2;
});
console.log(newArray);  // 输出: [2, 4, 6, 8, 10]

const array = [1, 2, 3, 4, 5];

const newArray = array.map(function(item, index, array) 
  return item * index;
});
console.log(newArray);  // 输出: [0, 2, 6, 12, 20]

注意：与 forEach() 方法不同，map() 方法返回一个新数组，因此它常用于对原始数组的转换和处理操作。如果在 map() 方法的回调函数中省略 return 语句，那么回调函数的执行结果将默认为 undefined，并且新数组中对应位置的元素将是 undefined。复制

const array = [1, 2, 3];

const newArray = array.map(function(item) {
  item * 2;
});
console.log(newArray);  // 输出: [undefined, undefined, undefined]

filter()

语法：数组.filter(function(item,index,arr){})
item：数组里的每一项
index：数组里的每一项的索引
arr：原始数组
作用：对原始数组进行过滤，把满足条件的数据放在新数组里
返回值：返回一个新数组，数组里是所有原始数组中满足条件的项，不会修改原始数组

const array = [1, 2, 3, 4, 5];

const newArray = array.filter(function(item) {
 //将满足条件 item % 2 === 0 的元素添加到新数组 newArray 中
  return item % 2 === 0;
});
console.log(newArray);  // 输出: [2, 4]

const array = [1, 2, 3, 4, 5];

const newArray = array.filter(function(item, index, array) {
  return index % 2 === 0;
});
console.log(newArray);  // 输出: [1, 3, 5]

every()

语法：数组.every(function(item,index,arr){})
item：数组里的每一项
index：数组里的每一项的索引
arr：原始数组
作用：判断原始数组是不是每一项都满足条件
返回值：返回一个布尔值。若原始数组每一项都满足条件返回true；若原始数组只要有一项不满足条件返回false

const array = [2, 4, 6, 8, 10];

const allEven = array.every(function(item) {
  return item % 2 === 0;
});
console.log(allEven);  // 输出: true

注意：every() 方法在遇到第一个不满足条件的元素时就会停止遍历，并返回 false。这意味着如果数组中的任何一个元素不满足条件，every() 方法将立即返回 false，无需继续遍历剩余的元素。

some()

语法：数组.some(function(item,index,arr){})
item：数组里的每一项
index：数组里的每一项的索引
arr：原始数组
作用：判断原始数组是不是有某一项都满足条件
返回值：返回一个布尔值。若原始数组只要有任意一项满足条件返回true；若原始数组所有项都不满足条件返回false

const array = [1, 2, 3, 4, 5];

const hasEven = array.some(function(item, index, array) {
  return index % 2 === 0;
});
console.log(hasEven);  // 输出: true

注意：some() 方法在遇到第一个满足条件的元素时就会停止遍历，并返回 true。这意味着如果数组中的任何一个元素满足条件，some() 方法将立即返回 true，无需继续遍历剩余的元素。

reduce()

语法：数组.some(function(result,item,index,arr){},初始值)
result：累积值（上一次回调函数的返回值或初始值）
item：数组里的每一项
index：数组里的每一项的索引
arr：原始数组
作用：对数组中的元素进行累积计算，并返回最终的结果
返回值：返回新的累积值

const array = [1, 2, 3, 4, 5];

const sum = array.reduce(function(result, item) {
  return result + item;
}, 0);
console.log(sum);  // 输出: 15
//1.第一次迭代：累积值为 `0`，当前元素为 `1`，计算结果为 `0 + 1 = 1`
//2.第二次迭代：累积值为 `1`，当前元素为 `2`，计算结果为 `1 + 2 = 3`
//3.第三次迭代：累积值为 `3`，当前元素为 `3`，计算结果为 `3 + 3 = 6`
//4.第四次迭代：累积值为 `6`，当前元素为 `4`，计算结果为 `6 + 4 = 10`
//5. 第五次迭代：累积值为 `10`，当前元素为 `5`，计算结果为 `10 + 5 = 15`

注意：如果不提供初始值参数，则将使用数组的第一个元素作为初始值，并从数组的第二个元素开始迭代。如果数组为空且没有提供初始值，则会抛出一个错误。reduce() 方法可以用于各种累积计算。

第一篇基础知识点整理完毕，接下来会陆续进行后面的梳理，敬请期待吧！！！啾咪~

js入门基础知识自我梳理第一篇之对象数据类型、数组数据类型