JavaScript ES6 (也称为 ECMAScript 2015 或 ECMAScript 6 )是2015年推出的JavaScript的较新版本。
ECMAScript 是JavaScript编程语言使用的标准。 ECMAScript提供了有关JavaScript编程语言应如何工作的规范。
本教程简要概述了ES6的常用函数,以便您可以快速开始使用ES6。
JavaScript let
用于声明变量。以前,变量是使用var
关键字声明的。
要了解有关let
和var
之间的区别的更多信息,请访问 JavaScript let vs var 。
使用let
声明的变量是 block-scoped 。这意味着它们只能在特定的块内访问。例如,
// 使用 let 声明的变量
let name = 'Sara';
{
//只能在里面访问
let name = 'Peter';
console.log(name);//Peter
}
console.log(name);//Sara
const
语句用于在JavaScript中声明常量。例如,
// 用 const 声明的名称不能更改
const name = 'Sara';
声明后,您将无法更改const
变量的值。
在 ES6 版本中,您可以使用箭头函数来创建函数表达式。例如, 该函数
// 函数表达式
let x = function(x, y) {
return x * y;
}
可以写成
// 使用箭头函数的函数表达式
let x = (x, y) => x * y;
要了解有关箭头函数的更多信息,请访问 JavaScript 箭头函数.
JavaScript类用于创建对象。类似于 构造函数。例如,
class Person {
constructor(name) {
this.name = name;
}
}
关键字class
用于创建一个类。这些属性是在构造函数中分配的。
现在您可以创建一个对象。例如,
class Person {
constructor(name) {
this.name = name;
}
}
const person1 = new Person('John');
console.log(person1.name);//John
要了解有关class 类的更多信息,请访问 JavaScript class 类.
在ES6版本中,可以在函数参数中传递默认值。例如,
function sum(x, y = 5) {
//take sum
//the value of y is 5 if not passed
console.log(x + y);
}
sum(5);//10
sum(5, 15);//20
在上面的示例中,如果未传递 y
的参数,则默认情况下取值 5 。
要了解有关默认参数的更多信息,请访问 JavaScript函数默认参数。
模板文字使在字符串中包含变量变得更加容易。例如,在您必须做之前:
const first_name = "Jack";
const last_name = "Sparrow";
console.log('Hello ' + first_name + ' ' + last_name);
可以通过以下方式使用模板文字来实现:
const first_name = "Jack";
const last_name = "Sparrow";
console.log(`Hello ${first_name} ${last_name}`);
要了解有关模板文字的更多信息,请访问 JavaScript模板文字。
解构语法使更容易将值分配给新变量。例如,
链接:https://www.learnfk.comhttps://www.learnfk.com/es6/ES6.html
来源:LearnFk无涯教程网
// 在你做这样的事情之前
const person = {
name: 'Sara',
age: 25,
gender: 'female'
}
let name = person.name;
let age = person.age;
let gender = person.gender;
console.log(name);//Sara
console.log(age);//25
console.log(gender);//female
使用ES6 Destructuring语法,上面的代码 可以写成:
const person = {
name: 'Sara',
age: 25,
gender: 'female'
}
let { name, age, gender } = person;
console.log(name);//Sara
console.log(age);//25
console.log(gender);//female
要了解有关destructuring的更多信息,请访问 JavaScript 解构.
您可以导出(export)函数或程序,然后通过导入(import)将其用于其他程序。这有助于制造可重复使用的组件。例如,如果您有两个名为contact.js和home.js的JavaScript文件。
在contact.js文件中,您可以export contact()函数:
// export
export default function contact(name, age) {
console.log(`The name is ${name}. And age is ${age}.`);
}
然后,当您想在另一个文件中使用contact()函数时,只需导入 import 该函数即可。例如,在home.js文件中:
import contact from './contact.js';
contact('Sara', 25);
// The name is Sara. And age is 25
Promise用于处理异步任务。例如,
// 返回一个Promise
let countValue = new Promise(function (resolve, reject) {
reject('Promise rejected');
});
// 当 promise 成功解决时执行
countValue.then(
function successValue(result) {
console.log(result);
},
)
要了解有关promises的更多信息,请访问 JavaScript promise.
您可以使用 rest parameter 将不确定数量的参数表示为数组。例如,
function show(a, b, ...args) {
console.log(a);//one
console.log(b);//two
console.log(args);//["three", "four", "five", "six"]
}
show('one', 'two', 'three', 'four', 'five', 'six')
您使用 ...
语法传递其余参数。因此,名称为rest parameter。
您使用spread语法 ...
将项目复制到单个数组中。例如,
let arr1 = ['one', 'two'];
let arr2 = [...arr1, 'three', 'four', 'five'];
console.log(arr2);//["one", "two", "three", "four", "five"]
要了解有关spread操作符的更多信息,请访问 JavaScript Spread 操作符。
祝学习愉快!(内容编辑有误?请选中要编辑内容 -> 右键 -> 修改 -> 提交!)