欢迎光临，了解微信小程序开发，就上易用通！

当前位置： 易用通 > 开发文档 > 入门

使用ES6新特性开发微信小程序（1）

发布：2018-01-24 15:22浏览： 次来源：网络 作者：tianshu

ECMAScript 6（简称ES6）是JavaScript语言的最新标准。因为当前版本的ES6是在2015年发布的，所以又称ECMAScript 2015。
微信小程序支持绝大部分ES6的新增特性。

Constants（常量）

ES6新增了const关键字，用来声明常量，一旦声明，常量的值就不能改变了。


  1. const PI = 3.141593;
  2. console.log(PI);
  3. PI = 3; // 报错: Uncaught TypeError: Assignment to constant variable.
  4. const PI = 3.1; // 报错: Uncaught SyntaxError: Identifier 'PI' has already been declared
const只在声明所在的块级作用域内有效。

Scoping（作用域）

ES6新增了let关键字，用来声明变量，但声明的作用只在代码块内有效。


  1. {
  2.     let a = 10;
  3.     var b = 1;
  4. }
  5. console.log(a); // 报错: Uncaught ReferenceError: a is not defined
  6. console.log(b); // 输出: 1
上面代码在代码块之中，分别用let和var声明了两个变量。然后在代码块之外调用这两个变量，结果let声明的变量报错，var声明的变量返回了正确的值。这表明，let声明的变量只在它所在的代码块有效。
  1. for (let i = 0; i < 5; i++) {
  2.     console.log(i);
  3. }
  4. console.log(i) // 报错: ReferenceError: i is not defined
上面代码的计数器i，只在for循环体内有效。

let为JavaScript新增了块级作用域。
  1. function test() {
  2.     let x = 1;
  3.     let y = 2;
  4.     {
  5.         let x = 10;
  6.         let y = 20;
  7.     }
  8.     console.log(x, y);
  9. }
  10. test(); // 输出: 1 2
上面的函数有两个代码块，都声明了变量x, y，运行后输出1 2。这表示外层代码块不受内层代码块的影响。如果使用var定义变量n，最后输出的值就是10 20。

Arrow Functions（箭头函数）

箭头函数是ES6在语法上提供的一个很好的特性，其特点有：

* 语法更为简洁了。
* 文法上的固定this对象。

一个参数
  1. let square = (x) => x * x;
  2. console.log('5 * 5 = ', square(5)); // 输出: 5 * 5 =  25
多个参数
  1. let add = (x, y) => x + y;    
  2. console.log('2 + 3 = ', add(2, 3)); // 输出: 2 + 3 =  5
  1. let total = () => square(add(5, 3));
  2. console.log(
  3.     '(5 + 3)*(5 + 3) = ', total()); // 输出: (5 + 3)*(5 + 3) =  64
数组遍历
  1. var array = [1, 2, 3];
  2. array.forEach(v => console.log(v)); // 输出: 1 2 3
  1. var bob = {
  2.     _name: "Bob",
  3.     _friends: ['Tom', 'Jerry'],
  4.     printFriends() {
  5.         this._friends.forEach(f =>
  6.             console.log(this._name + " knows " + f));
  7.     }
  8. }
  9. bob.printFriends(); // 输出: Bob knows Tom Bob knows Jerry
Extended Parameter Handling（参数的扩展）

允许为函数的参数设置默认值，即直接写在参数定义的后面。
  1. function logName(name = 'Unknown') {
  2.     console.log('Name: ', name);
  3. }
  4. logName(); // 输出：Unknown
  5. logName('JavaScript'); // 输出：JavaScript
Rest不定参数（用"...."表示）是在函数中使用命名参数同时接收不定数量的未命名参数。
  1. function add(...numArray) {
  2.     let sum = 0;
  3.     for (let num of numArray) {
  4.         sum += num;
  5.     }
  6.     return sum;
  7. }
  8. console.log(add(1, 2, 3)); // 输出：6
  9. console.log(add(1, 2, 3, 4, 5)); // 输出：15
Spread操作符和Rest不定参数一样，都使用 "..." 表示，Spread操作符允许我们将数组中的参数一个一个传入函数中。
  1. function add(x, y, z) {
  2.     return x + y + z;
  3. }
  4. console.log(add(...[1, 2, 3])); // 输出：6
  5. console.log(add(...[3, 4, 5])); // 输出：12


完整代码：https://github.com/guyoung/GyWxappCases/tree/master/ES6



免责声明：本站所有文章和图片均来自用户分享和网络收集，文章和图片版权归原作者及原出处所有，仅供学习与参考，请勿用于商业用途，如果损害了您的权利，请联系网站客服处理。

相关文章
最新文章
推荐文章
随机文章
热门小程序
开发文档 | 运营教程 小程序模板 | 小程序应用 | 标签大全
Copyright © 2017 https://www.yiyongtong.com 易用通 版权所有