欢迎来到258分享网,纯净的网络源码分享基地!

258资源分享网

全部作品
全部作品
网站源码
微信源码
素材特效
源码插件
视频教程
建站学院
热门搜索: 织梦  农业种植  农业  安全设置  官方
258资源分享 > 建站学院 > 微信开发 > guyoung:使用ES6新特性开发微信小程序(1)

推荐下载

HTML5响应式自适应网咯设计

2020-05-12   浏览:740

高端HTML5响应式企业通用网

2020-05-06   浏览:521

html5响应式外贸网站英文版

2020-05-08   浏览:510

HTML5自适应律师工作室类网

2020-04-04   浏览:504

HTML5影视传媒文化公司类网

2020-05-12   浏览:500

guyoung:使用ES6新特性开发微信小程序(1)

发布时间:2020-12-08  
原文链接:?__biz=MzI0ODU5Mzg0NA==&mid=2247483658&idx=1&sn=5461f829c6bca653d2c1aea04dbf924d&chksm=e99f2dd1dee8a4c7113906a7b9b345c96dfca401e40bbd44e04e0dc70913099cfa48a906a11c#rd

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

Constants(常量)

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

const PI = 3.141593;

console.log(PI); PI = 3; // 报错: Uncaught TypeError: Assignment to constant variable. const PI = 3.1; // 报错: Uncaught SyntaxError: Identifier 'PI' has already been declared


const只在声明所在的块级作用域内有效。

Scoping(作用域)

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

{

    let a = 10;     var b = 1; } console.log(a); // 报错: Uncaught ReferenceError: a is not defined console.log(b); // 输出: 1

上面代码在代码块之中,分别用let和var声明了两个变量。然后在代码块之外调用这两个变量,结果let声明的变量报错,var声明的变量返回了正确的值。这表明,let声明的变量只在它所在的代码块有效。

for (let i = 0; i < 5; i++) {

    console.log(i); } console.log(i) // 报错: ReferenceError: i is not defined


上面代码的计数器i,只在for循环体内有效。

let为JavaScript新增了块级作用域。

function test() {

    let x = 1;     let y = 2;     {         let x = 10;         let y = 20;     }     console.log(x, y); } test(); // 输出: 1 2

上面的函数有两个代码块,都声明了变量x, y,运行后输出1 2。这表示外层代码块不受内层代码块的影响。如果使用var定义变量n,最后输出的值就是10 20。

Arrow Functions(箭头函数)

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

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

一个参数

let square = (x) => x * x;

console.log('5 * 5 = ', square(5)); // 输出: 5 * 5 =  25


多个参数

let add = (x, y) => x + y;    

console.log('2 + 3 = ', add(2, 3)); // 输出: 2 + 3 =  5


 

let total = () => square(add(5, 3)); console.log(     '(5 + 3)*(5 + 3) = ', total()); // 输出: (5 + 3)*(5 + 3) =  64


数组遍历

 

var array = [1, 2, 3]; array.forEach(v => console.log(v)); // 输出: 1 2 3


var bob = {

    _name: "Bob",     _friends: ['Tom', 'Jerry'],     printFriends() {         this._friends.forEach(f =>             console.log(this._name + " knows " + f));     } } bob.printFriends(); // 输出: Bob knows Tom Bob knows Jerry



Extended Parameter Handling(参数的扩展)

允许为函数的参数设置默认值,即直接写在参数定义的后面。

function logName(name = 'Unknown') {

    console.log('Name: ', name); } logName(); // 输出:Unknown logName('JavaScript'); // 输出:JavaScript


Rest不定参数(用"...."表示)是在函数中使用命名参数同时接收不定数量的未命名参数。

 

function add(...numArray) {     let sum = 0;     for (let num of numArray) {         sum += num;     }     return sum; } console.log(add(1, 2, 3)); // 输出:6 console.log(add(1, 2, 3, 4, 5)); // 输出:15


Spread操作符和Rest不定参数一样,都使用 "..." 表示,Spread操作符允许我们将数组中的参数一个一个传入函数中。

function add(x, y, z) {

    return x + y + z; } console.log(add(...[1, 2, 3])); // 输出:6 console.log(add(...[3, 4, 5])); // 输出:12