let用来定义块变最。ES6新增了块作用域 如if {}
const 用来定义恒量，恒量不能重新赋值。
- ES6的字符模板：
用·符号包含
let dessert="cake", drink="tea"; let breakfast= kitchen`今天的早餐是 ${dessert} 与 ${drink} !` //键盘上波浪符下面的符号 function kitchen(strings,...values){ //string指的这模板标签里面的字符，value指的是模板标签面的值 //console.log(strings); //console.log(values); let result=''; for(var i=0;i<values.length;i++) { result+=strings[i]; result+=values[i]; } }
- 新增的字符串方法如：
str.startWith("a") 字符串以a开头
str.endWidht("a") 字符串以a结尾
str.includes("a") 字符串中是否包"a"
- ES6里面可以给定义的函数设置默认的值
function breakfast(dessert='cake',drink='tea'){ //默然值 return `${dessert} ${drink}` } console.log(breakfast()} //cake teak
- ES6新增操作符 ...
//展开
let fruits=["apple","tea"], foots=["banana',"cake',...fruits]; console.log(fruits); //输出 [ "apple','tea"] console.log(...fruits); //输出 "apple','tea" console.log(foods);//输出 ["banana", "cake", "apple','tea"]
//rest
function breakfast(dessert,drink,...foods){ //意思是说函数除了指定dessert drink参数以外，其它的参数都会放在foods参数里面
console.log(dessert,drink,foods);
}
breakfast("cake","tea","apple","banana"); //输出 "cake" "tea" ["apple","banana"]
- ES6可以用对象作为函数的参数
function breakfast(dessert,drink,{location,restaurant}={}) //参数给了一个默认的值，一个空{} { console.log(dessert,drink,location,restaurant); } breakfast("cake","tea",{location:"江苏",restaurant:"董小姐"}) //输出cake tea 江苏 董小姐
- ES6给函数新增了一个name属性
let breakfast=function(argument){ //... } console.log(breakfast.name); //输出 breakfast let breakfast=function superBreakfast(argument){ //... } console.log(breakfast.name); //输出 superBreakfast
- ES6新增了一种定义函数的方法 Arrow Functions
'user strict' let breakfast=(dessert,drink)=>dessert+drink; let breakfast=(dessert,drink)=>{dessert+drink} ; //大括号里面可以有更复杂的操作 //等于 var breakfast =function(desset,drink){ return dessert+drink }
- ES6定义属性
值和属性一样时可以简写
'use strict' let dessert="cake",drink="tea"; let food={ dessert:dessert, //属性和值是一样的时候可以简写 drink:drink， breakfast:function(){} } //可以简写成 let food={ dessert, drink, breakfast(){} } console.log(food); //输出{dessert: "cake", drink: "tea"}
如果属性名不包括空格可以用“. ”号来调用，如果包含空格只能用“[ ]”号来调用
'use strict' let food={}; foot.dessert="cakc"; offd['hot drink']="tea"; console.log(food);
- ES6 新增的Object.assign可以把一个对象的属性复制到另一个对象里面
'use strict' let breakfast={}; Object.assign{ breakfast, {drink:"beer"} }; console.log(breakfast); //输出{drink:"beer"}
- ES6 新增的Object.setPrototypeOf可以在创建对象以后改变对象
let breakfast={ getDrink(){ return "tea"; } }; let dinner={
getDrink(){
return "beer";
}
} let sunday=Object.create(breakfast);
console.log(sunday.getDrink()); //输出 tea
console.log(Ojbect.getPrototypeof(sunday)===breakfast);//输出true
Object.setPrototypeOf(sunday,dinner);
- ES6的 _proto_ 可以设置对象的prototype
let breakfast={ getDrink(){ return "tea"; } }; let dinner={ getDrink(){ return "beer"; } let sunday={ _proto_:breakfast, getDrink(){ //重新定义一个getDrink方法
return super.getDrink()+"milk"; } } //super的意思是执行一下_proto_里抽breakfast的getDrink
console.log(Object.getPrototypeOf(sunday)===breakfast); //输出true
sunday._proto_=dinner;
console.log(Object.getPrototypeOf(sunday)===dinner); //输出true
console.log(sunday.getDrink()); // 输出 tea milk
- ES6的Iterators迭代，指轮流交换的意思
{value:"", done:true/false } true指完成了迭代；Generators可以生成这种迭代器
'use strict' function chef(foods){ let i=0; return{ next(){ let done=(i>=foods.length); let value=!done?foods[i++]:undefined; return { value:value, done:done } } } } let John=chef(["tomato","egg"]); console.log(John.next()); //输出{value: "tomato", done: false} console.log(John.next());//输出{value: "egg", done: false} console.log(John.next()); //{value: undefined, done: true}
Generators生成器
let chef=function*(foods){
for(var i=0;i<foods.length,i++)
{
yield foods[i];
} } let John=chef(["tomato","egg"]); console.log(John.next()); //{value: "tomato", done: false} console.log(John.next()); //{value: "egg", done: false} console.log(John.next()); //{value: undefined, done: true}
- ES6的类 class
'use strict' class Chef{ constructor(food){ this.food=food; this.dish=[]; } get menu(){ return this.dish; } set menu(dish){ this.dish.push(dish); } cook(){ console.log(this.food); } } //let John=new Chef('tomato'); //John.cook(); tomato let John=new Chef(); console.log(John.menu="apple"); console.log(John.menu="orange"); console.log(John.menu) //["apple","orange"]
- ES6新增的 static指的是静态的，不需要实例化就可以便用
'use strict' class Chef{ static cook(food){ console.log(food); } } //let John=new Chef('tomato'); //John.cook(); tomato Chef.cook("tomato"); //tomato
- ES6新增extends
'use strict' class Person{ constructor(name,birthday){ this.name=name; this.birthday=birthday; } intro(){ return `$(this.name),$(this.birthday)` } } class Chef extends Person{ constructor(name,birthday){ super(name,birthday); } let John=new Chef("John',"1999-9-9"); }
- ES6的set有点像数姐，set和数组不同的是不能有重复的内容
'use strict' let dessert=new Set('cake apple'); dessert.add("orange"); console.log(dessert);//{"c", "a", "k", "e", " ", …} console.log(dessert.size);//8 长度 console.log(dessert.has("c")); // true console.delete("c") //删除 dessert.forEach(index=>{ //遍历 console.log(index); })
for (let i of dessert) //set内部的元素可以遍历for...of...
{
console.log(i);
}
dessert.clear(); //清空
- ES6中的用Map组织名值对的数据
Map结构提供了“值—值”的对应，是一种更完善的Hash结构实现。如果你需要“键值对”的数据结构，Map比Object更合适。它类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，各种类型的值（包括对象）都可以当作键。
注意，只有对同一个对象的引用，Map结构才将其视为同一个键。这一点要非常小心。
'use strict' let food=new Map(); let fruit={},cook=function(){},dessert="sweet"; food.set(fruit,"apple"); food.set(cook,"cook"); food.set(dessert,"cake"); console.log(food);//Map(3) {{…} => "apple", ƒ => "cook", "sweet" => "cake"} console.log(food.size) //长度3 console.log(food.get(fruit)); // 获取apple food.delete(dessert); console.log(food.has(dessert)) //删除false food.forEach((value,key)=>{ console.log(`${value}=${key}`); }) //遍历 food.clear(); //清空
- ES6中的Module导入导出模块
'use strict'; let fruit="apple"; expert let dessert="cake"
expert default function dinner(fruit,dessert){ //加入expert default指模块默认导出的东西
console.log(`今天的早餐是 ${fruit}与 ${dessert}`)
}
expert{fruit,dessert} //导出的可以是函数、类、变量
expert{dinner as default} //也可以表示模板默认导出的东西 import {fruit,dessert as dinner } from './modul/chef'; //用来更变导入模块的名字 as import * as chef from './modul/chef'; //导入所有的模块
import dinner from'./modul/chef'; //默认导出的模块导入
console.log(fruit,dinner);
console.log(chef.fruit,chef.dessert);