vue之es6语法

1.背景

2.let与var与const的区别

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>vue18-es6语法之let与var与const的区别</title>
</head>
<body>
<h3>let与var的区别</h3>
<pre>
块级作用域
JS中使用var来声明一个变量时, 变量的作用域主要是和函数的定义有关.
针对于其他块定义来说是没有作用域的，比如if/for等，这在我们开发中往往会引起一些问题。

 const
在JavaScript中也是如此, 使用const修饰的标识符为常量, 不可以再次赋值.
</pre>

<h4>总结</h4>
变量建议使用let
常量使用 const
<h4>区别</h4>
var设计的作用域是一个函数,函数外不生效
let具有严谨的块级作用域,定义在一个大括号内,就只能在大括号内使用
const定义的常量不可用修改
<h4>建议</h4>
在ES6开发中,优先使用const, 只有需要改变某一个标识符的时候才使用let.


</body>

</html>

View Code

3.es6中对象增强写法

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>对象增强写法</title>
</head>
<body>
<h3>对象增强写法</h3>
<script>
  /*  1.对象*/
  let name = '李东平'
  let age = 18
  // 正常的写法
  let obj1 = {
    name: name,
    age: age
  }
  // es6的增强写法
  console.log("obj1=" + obj1)
  let obj2 = {
    name, age
  }
  console.log("obj2=" + obj2)

  /*  1.方法*/
  // 之前的写法
  let obj3 = {
    f1: function () {
      console.log("-----f1------")
    }
  }
  obj3.f1();
  // es6增强写法
  let obj4 = {
    f2() {
      console.log("----f2----------")
    }
  }
  obj4.f2();
</script>
</body>
</html>

View Code

完美！