Vue提高篇-ES6基础语法

1.变量定义:const-常量定义;let-变量定义

2.箭头函数:let fn=(a,b)=>{alert(a+b)}

(a)箭头函数可以替换函数表达式,不可替换函数声明;

(b)箭头函数中不存在 this 对象,其使用时一般this都指向外层的this对象;

(c)箭头函数没有argument伪数组的参数集合;

3.模板字符串:字符串或表达式的拼接。

let a = 1; 
let b = 2; 
let strAll=`${a}+${b}=${a+b}`;    //``-数字1左边的键;${}-盛放变量或表达式  
console.log(strAll)    // "1+2=3"

 4.解构:对象&数组的简易写法

//对象的解构
let obj={
    name:"yin",
    age:10
};
let { name="admin",age }=obj;    //name变量给出一个默认值,对象根据属性名一一对应,这是一个无序的对应关系。
console.log(name);    // "yin"
console.log(age);     // 10

//数组的解构
let arr=[1,2,3];
let [a,b,c]=arr;    //数组以序列号一一对应,这是一个有序的对应关系。
console.log(b);    // 2

5.函数默认参数赋值

function add(x = 20, y = 30) {
    return x + y;
}
console.log(add());        // 50
console.log(add(1,2));     // 3

6.展开运算符:三个点 ...

//数组
let arr1=[1,2];
let arr2=[...arr1,3,4];
console.log(arr2);    //[1,2,3,4]

//对象
let obj1={name:"Yin"};
let obj2={...obj1,age:20};
console.log(obj2);    //{name:"Yin",age:20}

//函数里使用
let fn=(a,b,...other)=>{
    return other
}
console.log(fn(1,2,3,4,5,6));    //[3,4,5,6]

7.导入导出:import  export

//导入导出基本使用
    //child.js文件
let obj={
    name:"Yin",
    age:20
};
export {obj00:obj};

    //main.js文件
import { obj00 } from './child';
console.log(obj00);    //{name:"Yin",age:20}

//导出默认对象
    //child.js文件
export default "stringDemo";

    //main.js文件
import str from './child';
console.log(str);    // "stringDemo"

猜你喜欢

转载自blog.csdn.net/qq_35892039/article/details/84137955