ES6语法

137 阅读2分钟

解构

数组的解构
// 数组的解构赋值
let info = [18, "wanghaha", "男"]
let [age, name, sex] = info;

console.log(name);
console.log(age);
console.log(sex);

// 效果同上
let language = ["java", "python", "golang"], [java, python, golang] = language;
console.log(java);
console.log(python);
console.log(golang);

// 第三种方式
let [username, phone, money] = ['wanghaha', '18888888888', 9999999];
console.log(username);
console.log(phone);
console.log(money);

// 数组的层次
let [a, b, [c, d]] = [3, 8, [9, 5]];
console.log(a)
console.log(b);
console.log(c);
console.log(d);

// 只需要指定的数据,其它的使用占位符
let [,,email] = [38, 95, '31931727@haha.com'];
console.log(email);

// 默认值, 这里如果k没有解构到值则使用默认值28
let [h, i, j, k=28] = [8, 9, 1];
console.log(h);
console.log(i);
console.log(j);
console.log(k);

// 不定长度
let [nickname, ...params] = ['king', 18, '男', '18888888888', '31931@qx.com']
console.log(nickname);
console.log(params);

// 继续解构
let [newAge, newSex, newPhone, newMail] = params;
console.log(newAge);
console.log(newSex);
console.log(newPhone);
console.log(newMail);
对象的解构
// 对象解构
let obj = {
    name: '王哈哈',
    age: 25
}

let {name, age} = obj;
console.log(name);
console.log(age);

// 默认值, email1没有解构到值则会使用默认值
let info = {
    name: '张三',
    age: 27
}

// let {name, age, email='zhangsan@163.com'} = info;
// console.log(name);
// console.log(age);
// console.log(email);

let {name: myName, age: myAge, email: myEmail='zhangsan@163.com'} = info;
console.log(myName);
console.log(myAge);
console.log(myEmail);

// 嵌套对象解构
let obj2 = {
    email: 'test@test.com',
    info: {
        id: 10001,
        success: 'ok'
    }
}

let {email, info:{id, success}} = obj2;
console.log(email);
console.log(id);
console.log(success);

// 单行简写
let {username, password} = {username: 'zhangsan', password: '111'};
console.log(username);
console.log(password);
常用的解构
// 常用的解构
        
// 两个变量值的交换
let a = 10, b = 20;
console.log("a=", a);
console.log("b=", b);

[a, b] = [b, a];
console.log("a=", a);
console.log("b=", b);

// 解构函数返回值
function func1() {
    return ['王哈哈', 25, '男'];
}

let [name1, age1, sex1] = func1();
console.log(name1);
console.log(age1);
console.log(sex1);

// 解构返回值为对象的函数
function func2() {
    return {
        name: 'wang',
        age: 25,
        email: 'wang@wang.com'
    };
}
let {name, age, email} = func2();
console.log(name);
console.log(age);
console.log(email);

// 也可以这样
let {name: myName, age: myAge, email: myEmail} = func2();
console.log(myName);
console.log(myAge);
console.log(myEmail);

// 数组字面量传参
function func3([name, age]) {
    console.log(name);
    console.log(age);
}

// 方式一
let arr1 = ['zhangsan', 18];
func3(arr1);

// 方式二
func3(['lisi', 27]);

// 对象字面量传参
function func4({name, age}) {
    console.log(name);
    console.log(age);
}

// 方式一
let obj1 = {name: 'wang', age: 25};
func4(obj1);

// 方式二
func4({name: 'wang', age: 25});

// 字符串解构
let [e, f, g, ...other] = 'hello world';
console.log(e);
console.log(f);
console.log(g);
console.log(other);

函数的参数

// 函数的默认值
function fn(name, age=25, sex='男', callback=function(){}) {
    console.log(name);
    console.log(age);
    console.log(sex);
    console.log(callback());
}

fn('zhangsan', 18, '女', function(){
    return 'hello world';
})


// 函数的参数可以是另一个函数的返回值
function fn3 () {
    return 28;
}

function fn2(a, b=fn3()) {
    return a + b;
}

console.log(fn2(9));

// 向第二个参数传递参数, 使用undefined占位
function test1(name='wanghaha', age) {
    console.log(name);
    console.log(age);
}

test1(undefined, 23)

// 使用隔壁参数
function test2(x, y=x) {
    console.log(x);
    console.log(y);
}
test2(3)

// 函数不定参数
function test3(name, ...other) {
    console.log(name);
    console.log(other);
}

test3('wanghaha', 23, '18858585588', 'sss@aa.com')

// 获取函数名
function test4() {

}
console.log(test4.name);
let test5 = function(){}
console.log(test5.name);

// 获取匿名函数的名称
console.log(new Function().name);

// 获取对象的方法名称
let obj = {
    test: function(){}
}

console.log(obj.test.name);