JS学习小结（值传递与引用传递、数组和对象解构、访问器属性、call\apply\bind、多分支与switch、三元运算符）

1.变量值传递与引用传递的区别

变量值传递与引用传递的应用场景有两个，一是赋值，二是传参。赋值时，原始类型的数据用的是值传递，引用类型的数据用的是引用传递。传参时不论什么类型的数据都是采用值传递。

一、原始类型赋值时采用值传递

原始类型有 string number boolean，举例如下

let a = 1;
let b = a;
a = 5;
console.log(b);
console.log(a);

打印出来b = 1, a = 5
b在赋值后，a重新赋值，并不影响b的值。

二、引用类型赋值时采用引用传递

引用类型的对象和数组，举例如下

let zhangSan ={
    name:"张三",
    age: 24,
};
let xiaoZhang = zhangSan;
console.log(zhangSan);
console.log(xiaoZhang);
zhangSan.name = "小张";
console.log(zhangSan);
console.log(xiaoZhang);

第一次打印zhangSan = xiaoZhang
当改变zhangSan的name属性后，
第二次打印zhangSan的内容依然和xiaoZhang一样

2.数组和对象解构的常用方法和函数传参

数组和对象解构就是将数组中的值或者对象中的属性值赋值给变量。

一、数组解构

变量数和数组元素个数一一对应

let a =["张三","李四","王五"];
let[zhangsan,lisi,wangwu] = a;
console.log(zhangsan,lisi,wangwu);

打印出来的值为张三李四王五

变量数>数组元素个数，多出的变量没有得到赋值，会打印出undefined

let a =["张三","李四","王五"];
let[zhangsan,lisi,wangwu,maliu] = a;
console.log(zhangsan,lisi,wangwu,maliu);

打印出来的值为张三李四王五 undefined
undefined 表示声明未被赋值（初始化）的变量

变量数<数组元素个数，前面的数组元素会被赋值给变量，剩下的不会

let a =["张三","李四"];
let[zhangsan,lisi] = a;
console.log(zhangsan,lisi);

打印出来的值为张三李四

二.对象解构赋值

对象解构赋值时定义的变量名要和属性同名

let {name,age} = {name:"张三",age:24};
console.log(name,age);

打印出来为张三 24
还有一种情况，如果对象的属性名和之前的变量重名，需要在定义变量时使用别名得到赋值，打印变量时要使用别名

let name;
let {name:xiaozhang,age} = {name:"张三",age:24};
console.log(xiaozhang,age);

参数解构

数组传参

let sum =([a,b]) => a + b;
console.log(sum([100,200]));

对象传参

let student = ({name,age}) => `学生的姓名为${name}，年龄为${age}`;
console.log(student({name:"张三",age:24}));

3.call apply bind的区别

先举例子，再说明区别，例子如下

let student = {
    name:"张三",
    age:24,
    zuhe:function(banji){
        return `该学生的姓名是${this.name}，年龄是${this.age},年级是${banji}`;
    }
};
let lisi = {
    name:"李四",
    age:28,
};
console.log(student.zuhe.call(lisi,"三年级"));
console.log(student.zuhe.apply(lisi,["三年级"]));
console.log(student.zuhe.bind(lisi,"三年级")());

1、call,apply,bind三个均是函数的原型方法，作用是改变this的指向对象
2、三个方法的第一个参数是指向对象，后面的参数为实参列表，没有可以不写
3、apply的传入参数需要通过数组的方式传入
4、bind方法只是返回函数，不会立即调用，如果需要调用后面加小括号()

4.访问器属性的原理

访问器属性的本质是对象的方法（函数），伪造成对象的属性进行调用。

let student = {
    name:"张三",
    age:24,
    get zuhe(){
        return `该学生的姓名是${this.name}，年龄是${this.age}`;
    },
    set xiugai(name){
        return this.name = name;
    }
};
console.log(student.zuhe);
student.xiugai = "李四";
console.log(student.zuhe);

get关键字是获取对象属性值，如果访问器属性仅仅是为了使用属性值，采用该关键字
set关键字是设置或者修改对象的属性值，需要修改属性值，采用该关键字

5.多分支与swith

一、swith用于多个单值判断，单值数量>=3

let louceng = 3;
switch(true){
    case louceng == 1:
        console.log("1楼");
        break;
    case louceng == 2:
        console.log("2楼");
        break;
    case louceng == 3:
        console.log("3楼");
        break;
    case louceng == 4:
        console.log("4楼");
        break;
    default:
        console.log("未知错误");
}

二、区间判断多个数值，应用if判断语句

let fenShu = 82;
if(fenShu <0){
    console.log("超出范围");
}else if(fenShu <60){
    console.log("不及格");
} else if(fenShu >=60 && fenShu <80){
    console.log("合格");
} else if(fenShu >=80 && fenShu <90){
    console.log("良好");
} else if(fenShu >=90 && fenShu <=100){
    console.log("优秀");
} else if(fenShu >100){
    console.log("超出范围");
}else{
    console.log("未知错误");
}

6.三元运算符可以解决双分支判断的问题

条件？ true : false
实例如下

let xingbie = "男";
xingbie == "女" ? console.log("女") : console.log("男");