1.ES6的模块化的基本规则或特点:####
1:每一个模块只加载一次, 每一个JS只执行一次, 如果下次再去加载同目录下同文件,直接从内存中读取。 一个模块就是一个单例,或者说就是一个对象;
2:每一个模块内声明的变量都是局部变量, 不会污染全局作用域;
3:模块内部的变量或者函数可以通过export导出;
4:一个模块可以导入别的模块
5:ES6的import和export被提前到js的最顶层(提升), 在函数或者对象,或者基本值被导出去的时候提前被静态分析过
2.ES6中模块化主要指import ,export####
export可以导出变量,常量,函数,导出多个可以用{};
import可以在export之后进行导入;
3.箭头函数####
箭头函数修复了this的指向,使其永远指向词法作用域:
4.模板字符串####
ES6中只需要将变量放入${}中既可完成字符串的拼接
//不使用
var name = 'Your name is ' + first + ' ' + last + '.'
//使用
var name = `Your name is ${first} ${last}.`
5.函数参数默认值####
function foo(height = 50, color = 'red')
{
// ...
}
//不使用情况
function foo(height, color){
var height = height || 50;
var color = color || 'red';
//...
}
6. 解构赋值####
可以获取或修改数组和对象的值
//数组例:
var foo = ["one", "two", "three", "four"];
var [one, two, three] = foo;
console.log(one); // "one"
console.log(two); // "two"
console.log(three); // "three"
//如果你要忽略某些值,你可以按照下面的写法获取你想要的值
var [first, , , last] = foo;
console.log(first); // "one"
console.log(last); // "four"
//``````````````````````````````````````````````````````````````````````
//你也可以这样写
var a, b; //先声明变量
[a, b] = [1, 2];
console.log(a); // 1
console.log(b); // 2
//对象列:
const student = {
name:'Ming',
age:'18',
city:'Shanghai'
};
const {name,age,city} = student;
console.log(name); // "Ming"
console.log(age); // "18"
console.log(city); // "Shanghai"
//-------------------------------------------------------------
var {
StyleSheet,
Text,
View
} = React;
等同于
var StyleSheet = React.StyleSheet;
var Text = React.Text;
var View = React.Text;
7.延展操作符(Spread operator)####
可用于函数调用,数组拷贝,数组连接,es2018增加了对对象的支持
这个的引入几乎不会用到extend这个函数来。通过它可以将数组作为参数直接传入函数:
var people=['Wayou','John','Sherlock'];
function sayHello(people1,people2,people3){
console.log(`Hello ${people1},${people2},${people3}`);
}
//改写为
sayHello(...people);//输出:Hello Wayou,John,Sherlock
function foo(a, b, ...rest) {
console.log('a = ' + a);
console.log('b = ' + b);
console.log(rest);
}
foo(1, 2, 3, 4, 5);
// 结果:
// a = 1
// b = 2
// Array [ 3, 4, 5 ]
8.对象属性简写
const name='Ming',age='18',city='Shanghai';
const student = {
name,
age,
city
};
console.log(student);//{name: "Ming", age: "18", city: "Shanghai"}
9.Promise
主要解决回调的问题;
var test = (a,b)=>{
return new Promise((reslove,reject)=>{
//异步操作
//...
reslove(resoult)//返回正确结果
//...
reject(err) //出错时的结果
})
}
//使用
test(a,b).then(res=>{
//...promise reslove()返回正确结果后执行到这里
}).catch(err=>{
//前面reject(err)后代码会执行到里
})
//或者
try{
var resoult = await test(a,b)
//...
}catch(er){
//...
}
10.let和const
都是块级作用域;
let 命令也用于变量声明 ;在函数外部可以获取到b,获取不到a,因此例如for循环计数器就适合使用let
{
let a = 10;
var b = 1;
}
const用于声明一个常量,设定后值不会再改变
const PI = 3.1415;
PI // 3.1415
PI = 3; //TypeError: Assignment to constant variable.
网友评论