1、ECMAScript 6
1.1什么是 ECMAScript 6
ECMAScript 6.0(简称 ES6)是 JavaScript 语言的下一代标准, 2015 年 6 月正式发布。它的目标,是使得 JavaScript 语言可以用来编写复杂的大型应用程序,成为企业级开发语言。
1.2 ECMAScript 和 JavaScript 的关系
一个常见的问题是,ECMAScript 和 JavaScript 到底是什么关系?
要讲清楚这个问题,需要回顾历史。1996 年 11 月,JavaScript 的创造者 netscape 公司,决定将 JavaScript 提交给标准化组织 ECMA,希望这种语言能够成为国际标准。次年,ECMA 发布 262 号标准文件(ECMA-262)的第一版,规定了浏览器脚本语言的标准,并将这种语言称为 ECMAScript,这个版本就是 1.0 版。
因此,ECMAScript 和 JavaScript 的关系是,前者是后者的规格,后者是前者的一种实现(另外的 ECMAScript 方言还有 Jscript 和 ActionScript)
2 基本语法
ES6相对之前的版本语法更严格,新增了面向对象的很多特性以及一些高级特性。本部分只学习项目开发中涉及到ES6的最少必要知识,方便项目开发中对代码的理解。
2.1 let声明变量
//定义 变量
//let有作用范围
{
var a = 1;
let b = 2;
}
// console.log(a)
//无法显示
// console.log(b)
//let定义只能有一次
{
var m = 1;
var m = 2;
let n = 10;
let n = 4;
}
// console.log(m);
// console.log(n);
2.2 const声明常量(只读变量)
//定义常量const
PI = 3.14
// PI = 3;
//定义之后不能改变
2.3 解构赋值
创建 03-解构赋值-数组解构.js
解构赋值是对赋值运算符的扩展。
他是一种针对数组或者对象进行模式匹配,然后对其中的变量进行赋值。
在代码书写上简洁且易读,语义更加清晰明了;也方便了复杂对象中数据字段获取。
let a = 1, b = 2, c = 3
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 //注意:结构的变量必须是user中的属性
console.log(name, age)
2.4 模板字符串
模板字符串相当于加强版的字符串,用反引号 `,除了作为普通字符串,还可以用来定义多行字符串,还可以在字符串中加入变量和表达式。
//字符串插入变量和表达式。变量名写在 ${} 中,${} 中可以放入 JavaScript 表达式。
let name = "lucy"
let age = 20
let info = `My name is ${name} ,I am ${age + 1}`
console.log(info)
2.5声明对象简写
// 传统方式定义对象
const name = "lanalan";
const age = 28;
const user1 = { name: name, age: age }
console.log(user1);
// es6
const user2 = {name,age}
console.log(user2);
2.6对象拓展运算符
拓展运算符(…)用于取出参数对象所有可遍历属性然后拷贝到当前对象。
//对象拓展运算符
let person1 = { name: "Amy", age: 15 }
let someone = { ...person1 }
console.log(someone)
let age = { age: 15 }
let name = { name: "lanlan" }
let person2 = { ...age, ...name }
console.log(person2)
2.7箭头函数
参数 => 函数体
//传统方式定义函数
var f1 = function (a) {
return a;
}
console.log(f1(3));
//es6使用箭头函数定义
//参数=>函数体
//函数名 参数 返回值
var f2 = a => a
console.log(f2(4));
var f3 = (m, n) => m + n;
console.log(f3(2,3));
使用箭头函数
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。