JS高阶知识——值传递/引用传递—模板字面量—解构赋值—对象字面量—函数bind()、call()、apply()方法—访问器属性—流程控制/判断语句

值传递&&引用传递

数据类型：值类型和引用类型
值传递：基本数据类型
引用传递：引用类型
函数传参： 无论什么类型，都是值传递
函数中对参数的更新，并不会影响到入参:
    const fn = x => (x = 10);
    let x = 5;
    fn(x);
    console.log(x);
    输出的结果是5；//这表示函数中对参数的更新，不会影响传入的参数在函数外的值
    引用类型的更新，是全新赋值才是更新，修改其中的一项或者几项不算更新了引用类型的值,所以引用类型的参数也属于值传递
    深拷贝： 值的操作
    浅拷贝： 值所在内存地址的操作

模板字面量： 将表达式嵌入到字符串

传统的方式：
    let a =1, b=2;
    let res = a + " + " + b + " = " + (a + b);
模板字面量方式：
    res = `${ a } + ${ b } =  ${a + b}`;
模板字面量的组成
    使用反引号``,
    里面的变量用${}囊括
*模板字面量创建多行字符串可以保留格式
let menu = ['首页', '视频', '文章'];
let htmlStr = `<ul>
    <li>${menu[0]}</li>
    <li>${menu[1]}</li>
    <li>${menu[2]}</li>
</ul>`
输出的就是HTML标签
document.body.insertAdjacentHTML("beforeEnd", htmlStr);    //将标签插入HTML中
自定义模板自变量的行为
    模板自变量可以作为参数，不用写小括号
        作为参数的条件：
            第一个参数： 模板字面量中的字符串字面量组成的数组
            从第二个参数开始，将模板字面量中的变量一次传入

解构赋值

解构赋值： 快速从集合数据（数组/对象）解构出独立变量

数组
[a, b, ...c] = [1, 2, 3, 4, 5];
[,,a,,]  = [1, 2, 3, 4, 5];// a = 3;
console.log((a, b, c));//输出的a是1，b是2，c是[3, 4, 5]的数组
利用解构去掉数组中的a
[a, ...ar] = [1, 2, 4, 4]
console.log(a); //1
console.log(ar); //[2, 4, 4]
对象
let email = "admin@php.cn"
let { role, email: userEmail } = { role: "user", emial: "user@php.cn" }
console.log(userEmail);//输出user@php.cn
console.log(email);//输出admin@php.cn
参数解构
解构是用相同类型的两组进行比较，最后拿到符合条件的一组新的，不改变原有数据
数组传参
let sum = ([a+ b]) => a+b;
console.log(sum([10,20]));
对象传参
let getUser = ({name, email} => [name, email]);
console.log(getUser({email: 'tp@.php.cn', name: '天蓬老师'}));

对象字面量的简化

当属性与同一个作用域中的变量同名时，可以直接用属性来引用变量值
    `let user = {
        userName: '天蓬',
        userEmail: 'admin@php.cn',
        getInfo: function() {
            return `${this.userName}(${this.userEmail})`;
        }
    }
    let {userName, userEmail} = user;
    users = {
        userName,
        userEmail,
        getInfo: function() {
            return `${this.userName}(${this.userEmail})`;
        }
    }
    console.log(users.getInfo());`
函数也可以简写，去掉: function——不用定义直接写函数

this 说明，this指向定义它的函数，不是调用，this存在于作用域中，对象是没有作用域的，只有函数或块是有作用域的；

函数自带的方法

bind()

bind()主要作用是操作this的指向，将一个函数绑定到一个对象上，函数中的this便是绑定的这个对象，而不是函数自身
function hello(name){
    this.name = name;
    console.log(this.name);
}
const obj = {
    name: 'admin',
}
//将hello绑定到obj对象上去
let f = hello.bind(obj,'天蓬老师');
f();

call()/apply()

call用法跟bind()类似，只是call()会立即调用
apply()跟call用法类似，只是apply()仅用于后边传递的参数是数组形式

访问器属性

将方法伪造成一个属性
X对象里面的方法fn()
用get 定义：
    get fn() {}
在调用的时候x.fn，fn是X的属性，而不是一个函数
同理 set 定义也是一样，但是用set定义需要有个参数
用get/set定义的伪属性名字不要跟其他属性重复，会冲突

流程控制——条件判断

if——else
switch:属于严格模式,单值判断
    switch (true/false) {
        case 条件语句 :
            执行语句 ;
            break;
        case 条件语句 :
            执行语句 ;
            break;
        default:  //都不匹配
            执行语句;
    }
三元运算符:
    条件 ? true : false;
    三元运算符可以直接对简单的条件进行判断并处理，但是不适用于复杂的语句，优先级也略差，如果同一行有赋值之类的，最好用小括号括起来三元运算符。