学习前端第三十四天（call，apply，函数绑定；箭头函数；对象属性配置）

一、call、apply

function fn(x, y) {

console.log("hello", x, y, this)

};

1.call方法

作用：调用后执行函数，可以给“this”传参数

fn.call({ a: 1 }, 1, 2,);

2.apply方法

第一个给“this”传参数，第二个参数需要是数组形式，然后与形式参数一一对应赋值

fn.apply({ a: 2 }, [9, 3, 4, 5]);

3.区别

call可以传多个参数，apply只能传两个参数，一个对象一个数组

4.借用

利用传对象的特性用call方法对可迭代对象使用数组方法

        const str = "hello";let str2 = [].join.call(str, "-");console.log(str2); // h-e-l-l-o

二、函数绑定bind

1.复制函数，绑定参数

        'use strict'function fn(x, y) {console.log("hello", this, x, y)}const fn2 = fn.bind({ a: 1 })const fn3 = fn.bind({ a: 1 }, 1)const fn4 = fn.bind({ a: 1 }, 1, 2)fn(1, 2);  // 未进行绑定fn1(3, 4); // 绑定好了this参数，传入的值会被赋值给x，yfn2(5);    // 绑定好了this参数和x的值，传入的值会被赋值给yfn3();     // 绑定好了this参数，x的值，y的值

2.复制join方法并绑定方法的this

        const join = [].join.bind("abc");console.log(join("-"));  // a-b-cconsole.log(join("，"));  // a，b，cconsole.log(join(";"));   // a;b;c

绑定join处理的字符串，自定义用何种方式连接字符串

三、箭头函数

面试题：

// 箭头函数没有局部变量“this”，this会向上层找

// 箭头函数没有“arguments”(收集实际参数)

// 不能使用new调用

四、对象配置属性

1.属性标志和属性描述符

Object.getOwnPropertyDescriptor 方法允许查询有关属性的完整信息。

Object.getOwnPropertyDescriptors(obj) 方法，一次获取所有属性描述符

writable — 如果为 true，则值可以被修改，否则它是只可读的。
enumerable — 如果为 true，则会被在循环中列出，否则不会被列出。
configurable — 如果为 true，则此属性可以被删除，这些特性也可以被修改，否则不可以。

        const user = {username: "jack",age: 20,};// 对对象的一个属性细节修改，给不存在的属性进行修改会新增改属性Object.defineProperty(user, "username", {value: "ll",writable: false,configurable: false,enumerable: false,})Object.defineProperty(user, "uname", {value: "llwe",writable: false,configurable: false,enumerable: false,})// 可写性；可遍历性；可删除性   console.log(Object.getOwnPropertyDescriptor(user, "username")); // 一次获取所有属性描述符

Object.defineProperties(obj, descriptors)，允许一次定义多个属性。

        // 对当前对象进行批量修改，添加Object.defineProperties(user, {size: {value: 20,writable: false,configurable: true,enumerable: false,},hobby: {value: ["css", "html"]},});

Object.freeze(obj),禁止添加/删除/更改属性。为所有现有的属性设置 configurable: false, writable: false。

2.属性的 getter 和 setter

有两种类型的对象属性。

第一种是 数据属性。

第二种类型的属性。 访问器属性。用于获取和设置值的函数，但从外部代码来看就像常规属性。

get —— 一个没有参数的函数，在读取属性时工作，
set —— 带有一个参数的函数，当属性被设置时调用，

let user = {name: "John",surname: "Smith",get fullName() {return `${this.name} ${this.surname}`;},set fullName(value) {[this.name, this.surname] = value.split(" ");}
};// set fullName 将以给定值执行
user.fullName = "Alice Cooper";alert(user.name); // Alice
alert(user.surname); // Cooper

实际应用：

        const user = {gender: 2,get cnGender() {const obj = { 1: "男", 2: "女" };return obj[this.gender]},set cnGender(value) {const obj = { 男: 1, 女: 2 }this.gender = obj[value];}}console.log(user.cnGender);user.cnGender = "男";console.log(user.cnGender);

当读取cnGender时，会根据gender的值输出cnGender；

修改cnGender时，会通过函数对应关系修改gender值，然后输出cnGender时，会根据gender修改的值输出cnGender。