9.第四阶段17 循环数组的方式-数组的判断比较-map的使用-set的使用-解构赋值-1.数组解构-2 对象解构-求最大值-把字符串变成数组

//循环数组的方式  froEach for  , for ..of 
//es6新的数组循环方式 reduce  主要是用在累加上
let arr=[1,2,3,4,5]
let sum=arr.reduce((sum,item)=>{
return sum+item;
},0)
console.log(sum)  //结果15,计算出arr的所有数组相加结果 只能是数字

//对于数组的判断 比较麻烦 判断对象是不是数组
console.log(typeof {}); //结果 对象
console.log(typeof []); //结果 也是对象
console.log(Array.isArray()) //结果false 判断当前是不是一个数组
console.log(Array.isArray([])) //结果true 

let obj={
    1:"1",
    2:"2",
    length:2,
    push:Array.prototype.push,
    pop:Array.prototype.push
}
obj.push("3");
console.log(obj) //给对象添加了一个3

//可迭代的对象
let arr2=[1,2,3,4,5];
let range={
    from:1,
    to:3
}
for (const iterator of arr2) {
    console.log(iterator)
}


//想让对象被迭代,需要写这段才可以
range[Symbol.iterator] = function(){
    return {
        number:this.from,
        last:this.to,
        next(){
            if(this.number<=this.last){
                return {done:false,value:this.number++};
            }else{
                return{done:true}
            }
        }
    }
}
for (const iterator1 of range) {
    console.log(iterator1)
}
//实例2
let arrayLike = {
    0:"hello",
    1:"World",
    length:2
}
let arr1= Array.from(arrayLike);  //必须先转换为数组才可以被迭代
for (const iterator of arr1) {
    console.log(iterator)
}


//map  键值项  item value
let map =new Map();
let john = {name:"john"}
map.set(john,100)
map.set("1","str1");
map.set(1,'num1');
map.set(true,"bool1") ;
console.log(map.get(john)); //结果100
console.log(map.get("1")); //结果str1
console.log(map.get(1)); //结果num1
console.log(map.get(true)); //结果bool1

//对象的属性只能是文本
let obj1={};
obj1[john] =123; //对象的键值会自动转换为文本
console.log(obj1[john])

map.set("11",11).set("22",22)  //map支持链式调用
map.delete("11") //删除掉某个键
map.clear() //清空map
// map.size() //查看有多少成员
map.has("11") //查看键值存在不存在
//map.set(key,value) //创建键值
//map.get(key) //获取键的值
map.keys() //返回所有的键
map.values() //返回所有的值
map.entries() //返回 [key:value]
for (const key of map.keys()) {
    console.log(key)
}
for (const values of map.values()) {
    console.log(values)
}
for (const entries of map.entries()) {
    console.log(entries)
}
map.forEach((value,key)=>{
    console.log(value,key)
}
)
//map 实例1  对象转换为map

let obj2={
    siteName:"小米网",
    host:"www.sh.set"
}
let map1 = new Map(Object.entries(obj2));
console.log(map1.get("siteName"))

//map 实例2
let obj3= Object.fromEntries([["siteName","小米网"],["host","www.sh.net"]])
console.log(obj3)


//set 值类型集合  他的每一值只能出现一次

let set= new Set();
set.add(1);
set.add(2);
set.add(3);
set.add(1);
set.add(3);
console.log(set.size) //结果是3 值是唯一的 新出的东西 以前没有 
//set 实例1 去重函数
let  arr3=[11,2,3,4,564,5,45,3,34,1,3,2,3,4]
function unique(arr3){
    return Array.from(new Set(arr3)) //记得Set S是大写
}
console.log(unique(arr3)) //去重后的结果
//Object.keys()  获取对象所有键
//Object.values()  获取对象所有值
//Object.entries() 获取键值


//解构赋值
//1.数组解构
let arr4=["hello","xiaomi"]
let [name1,name2] = arr4;
let [name3,name4] = "hello xiaomi".split(" ") //原理和上面一样
console.log(name3,name4)

//数据解构 只拿1 2 4
let arr5=["hello","xiaomi","hello2","baidu"]
let [name5,name6,,name7]=arr5;
console.log(name5,name6,name7) //结果

let [a,b,c] = "abc"; //这个可以吗?  可以 不仅限于数组
let [one,two,three] = new Set([1,2,3]) //这个可以吗? 可以 
console.log(a,b,c,one,two,three) //结果 abc123

let map3=new Map();
map3.set("1","1");
map3.set("2","2");
map3.set("3","3")
for (const [key,value]of map3.entries()) {
    console.log(key,value) //结果11 22 33
}

//对象解构
let obj5={
    name:"hello",
    age:17,
    height:178,
    width:180
}
let {name,age} = obj5;
console.log(name,age) //结果 hello 17
//如何用这种方法想重命名键名怎么办?
let {name:a1,age:n1} = obj5;
console.log(a,n1)
let {a1:a2=27,n2="excel"} = obj5; //不仅可以对对象改名,还可以直接赋值的哦
console.log(a2,n2) ;//结果27和excel

let{height} = obj5; //也可以只调用一个值
console.log(height) //结果178

let{width,...obj1111} = obj5;  //obj1111随便定义  可以调用出其他所有
console.log(width)  //结果180
console.log(obj1111) //结果剩余的 { name: 'hello', age: 17, height: 178 }

//例子2
let options = {
    size:{
        width1:100,
        height1:200
    },
    items:["hello","no"],
    extra:true
};
//下来开始拆解  然后分别调用
let {
    size,
  /*   size:{
        width1,
        height1,
    }, //也可以*/ 
    items:[item1,item2],
    extra
} = options;
console.log(size.width1,size.height1,item1,item2,extra) //结果 100 200 hello no true 分别拆解

//解构例子3 计算最高工资  用对象
let salaries ={   //salaries 工资的意思
    "John":100,
    "Pete":300,
    "Mary":250
}
function toSalary(obj){
    let max=0;
    let maxName = null;
    for (let [name,salary] of Object.entries(obj)) {  //把对象变成数组 Object.entries
        if(max<salary){
            max = salary;
            maxName = name;
        }
    }
    return maxName;  //返回最高工资 姓名
};
console.log(toSalary(salaries)) //结果pete工资最高

//解构例子4   我们要实现无限参数的函数 
function sum1(a,b){  //正常加法运算
    return a+b;
};
//如想实现console.log(sum(1,2,3,4,5,6))  等等无限参数怎么办呐
function sum1(...args){
    console.log(args)
    let sum1 = 0;
    for (const iterator of args) {
        sum1+=iterator
    }
    return sum1
}
console.log(sum1(1,2,3,4,5,6))  //结果是21

/* function sum1(a,b...args){
    //这种调用方式也支持,注意...args只能放在最后
    } */

//例子5 求最大数
console.log(Math.max(1,2,3,5,33,2,3)) //能够输出我们当前传入数的最大值  Math.max求最大值
//但是 console.log(Math.max([1,2,3])) 会报NAN错误 我们可以这样
let arr8=[1,2,3];
let arr9 = [-1,10,20]
console.log(Math.max(...arr8)) //结果3 ...arr8会把数组变成Math.max(1,2,3)
console.log(Math.max(...arr8,...arr9))  //结果20
console.log(Math.max(50,...arr8,...arr9))  //结果50 可以很方便最运算
let merged = [0,...arr8,5,6,7,...arr9,2,3,4];
console.log(merged) //结果[0,  1,  2,  3, 5, 6,7, -1, 10, 20, 2, 3,4]
//例子6 把一个字符串变成一个数组
let str="hello"
console.log(...str) //结果是 h e l l o
console.log([...str]) //把str变成数组

let obj8 = {a:1,b:2,c:3};
let objCopy = {...obj8};
console.log(objCopy) //结果是obj8的值  {a:1,b:2,c:3} 简易的拷贝,2个值并不相等哦