Es6语法,VUE快速入门(一)

ES6

JavaScript的下一代标准

与JavaScript的关系

Es6是js的规格标准,js是Es6的一种实现

ES6和ES5

1. ES6代码简洁,es5的代码复杂
2. ES6的浏览器兼容性很差,ES5的代码浏览器兼容性很好

<script>
    //let为局部变量定义
    {
   
        var a = 0;
        let b = 1;
    }
    console.log(a);
    console.log(b);
</script>

<script>
    // var 可以声明多次
    // let 只能声明一次
    var m = 1
    var m = 2
    let n = 3
    let n = 4
    console.log(m)  // 2
    console.log(n)  // Identifier 'n' has already been declared
</script>

// 1、声明之后不允许改变
const PI = "3.1415926"
PI = 3  // TypeError: Assignment to constant variable.
// 2、一但声明必须初始化，否则会报错
const MY_AGE  // SyntaxError: Missing initializer in const declaration

<script>
   //1.数组解构
   let a =1,b=2,c=3;
   console.log(a,b,c);
   //es6
   let [x,y,z]=[1,2,3]
   console.log(x,y,z)
   
   //2.对象解构
   let user = {
   name: 'Helen',age: 18}
   let name1 = user.name
   let age1 = user.age
   console.log(name1,age1)
   //ES6
   let {
   name,age} =user
   console.log(name,age)
</script>

<script>
  //1.多行字符串
    let string1 = `HEY,
    CAN I happy now`
    console.log(string1)
    //2、字符串插入变量和表达式。变量名写在 ${} 中，${} 中可以放入 JavaScript 表达式。
    let name = "mike"
    let age = 27
    let info = `my name is ${
     name},I am ${
     age+3} years old next year`
    console.log(info)
    //3.字符串中调用函数
    function f(){
   
        return "have fun!"
    }
    let string2 = `game start,${
     f()}`
    console.log(string2);
</script>

<script>
    //声明对象简写
    const age =12
    const name ="AMY"
    //传统
    const person1 = {
   age:age,name:name}
    console.log(person1)
    //ES6
    const person2={
   age,name}
    console.log(person2)
</script>

<script>
    //定义方法简写
    const person1