- let 块作用域
if(true){
let a='a';
}
//定义一个块 用{ let a='a'}
- const 恒量
//不能重复声明
const b='b';
const b='e';//报错
//可以用push往变量里增加
const f=[]
f.push('e')
f.push('j')
- Array Destructuring 结构数组
function a(){
return ['2','4','6']
}
<!--var tmp = a(),d=tmp[0],e=tmp[1],f=tmp[2];-->
let [d,e,f] =a();
- Object Destructuring 结构对象
function a(){
return [d:'2',e:'4',f:'6']
}
let {d:'2',e:'4',f:'6'}=a();
- Template String模板字符串
let d='2',e='5';
let a ='这是'+'d'+'和'+'e'
//或
let a =`这是 ${d} '和' ${e}`
- Tagged Template 带标签的模板字符串
let d='2',e='5';
let a =tag`这是 ${d} '和' ${e}`;
function tag(string,...value){
//body
//console.log(string)
//congsole.log(value)
let result ='';
for(var i=0;i<value.length;i++){
result +=string[i];
result +=value[i];
}
result += string[string.length-1];
return result;
}
- startWith()/endWith()判断字符串里是否包含其它字符串
let a =`这是 ${d} '和' ${e}!`;
console.log(a.startWith('这是'))
//true
console.log(a.endWith('!'));
//true
- Default Parameter Value默认参数
function a(d='2',c='3'){
return `${d} ${c}`
}
console.log(a())
//2，3
console.log(a('5','6'))
//5，6
- spread展开操作符/reset剩余操作符 =>[...]
let f=['q','w']
fo=['r',...f]
console.log(f)//['q','w']
console.log(...f)//q,w
console.log(fo)//['r',q','w']
//剩余操作符，d接收p,dr接收0，剩下的生成数组由fo接收
function a(d,dr,...fo){
console.log(a,dr,fo)
//p,o,['i','u']
//展开
console.log(a,dr,...fo)
//p,o,i,u
}
a('p','o','i','u')
- Destructuring Parameter解构参数
function a(d,dr,{lo,re}={}){
console.log(d,dr,lo,re)
}
a('m','b',{lo:"哈哈"，re:"嗯哼"})
- name 函数的名字
function a(arg){
//body
}
console.log(a.name)//a
let br=function (arg){
//body
}
console.log(a.name)//br
let br=function b(arg){
//body
}
console.log(b.name)//b
12.Arroe Functions箭头函数 ()=>{}
let br = de => de;
//相当于
var be=function br(de){
return de
}；
//多个参数可以加（）
let br = (dr,fo) => de + fo;
//相当于
var be=function br(de,fo){
return de + fo
}；
- 对象表达式/对象属性名
let de='2' ,dr='5';
let fo ={
de:de,
dr:dr
}
console(fo);//Object{de:'2',dr:'5'}
let de='2' ,dr='5';
let fo ={
de,
dr
}
console(fo);//Object{de:'2',dr:'5'}
//添加方法
let fo ={
de,
dr,
br:function(){}
}
//对象属性名
let fo ={}
fo.de ='2'
fo.ho dr ='4'//报错，不能含空格
fo['ho dr'] ='4'//正确写法
let fo={}
let dr='ho dr'
fo[dr]='5';//正确
- Object.is() 对比两个值是否相等
==
===
+0=-0//true
NaN==NaN//false
Object.is(NaN,NaN)//true
Object.is(+0,-0)//false
- Object.assign()把对象的值复制到另一个对象里
let br ={}
Object.assign(br,{dr:'33'})
//Object.assign(接收，复制的源)
- 设置对象的prototype => [Object.setPrototypeOf()/Object.getPrototypeOf()]
let br ={
getDr(){
return '44'
}
}
let di ={
getDr(){
return '55'
}
}
let su = Object.create(br);
console.log(sun.getDr());//55
console.log(Object.getPrototypeOf(su) === br)；//true
Object.setPrototypeOf(
"要设置的对象","要设置成的prototype对象");
Object.setPrototypeOf(su,di);
console.log(su.getDrink());//44
console.log(Object.getPrototypeOf(su) === di)；//true
-
__proto__方法可以得到或者设置得到的prototype
let br ={
getDr(){
return '44'
}
}
let di ={
getDr(){
return '55'
}
}
let su ={
__proto__:br
}
console.log(su.getDrink());//44
console.log(Object.getPrototypeOf(su) === br)；//tru
let su ={
__proto__:di
}
console.log(su.getDrink());//55
console.log(Object.getPrototypeOf(su) === di)；//tru
- super 子类调用父类的方法
let br ={
getDr(){
return '44'
}
}
let di ={
getDr(){
return '55'
}
}
let su ={
__proto__:br,
getDrink(){
return super.getDrink()+'33'
}
}
console.log(su.getDrink());//4433
- Iterators 迭代器（交换轮流代替）
特点：返回(1)value值/对象，(2)done,完成迭代返回的true(无迭代则done为false),如：{value:xx,done:true/false} (3)next方法。执行next()方法会返回一个对象，对象的内容就是value和done两个属性，如果没有迭代的东西的话执行next()方法后,value为undifined,done为true
(4)Ganerators 生成Iterators
function chef（foods）{
let i =0;
return{
next(){
let done =(i>=foods.length);
let done = !done?foods[i++]:undefined
return{
value:value,
done:done
}
}
}
}
let wh =chef(['to','mo'])
console.log(wh.next());
//Object{value:"to",done:false}
console.log(wh.next());
//Object{value:"mo",done:false}
console.log(wh.next());
//Object{value:undifined,done:true}
- Ganerators 生成器
function chef(){
yield 'mo';
yield:'to'
}
let wh=chef()
console.log(wh.next());
//Object{value:"mo",done:false}
console.log(wh.next());
//Object{value:"to",done:false}
console.log(wh.next());
//Object{value:undifined,done:true}
//改造
let chef =function (foods){
for(var i=0;i<foods.length;i++){
yield foods[i]
}
}
let wh=chef('mo','to')
console.log(wh.next());
//Object{value:"mo",done:false}
console.log(wh.next());
//Object{value:"to",done:false}
console.log(wh.next());
//Object{value:undifined,done:true}
- classes 类
class Chef{
constructor(food){
this.food=food;
}
cook(){
console.log(this.food)
}
}
let wh = new Chef('mo');
wh.cook();//回调
//console打印出 mo
- static静态类(静态不需要实例化就能使用的方法)
class Chef{
constructor(food){
this.food=food;
}
static cook(food){
console.log(food)
}
}
Chef.cook('mo')
//console打印出 mo
- get/set得到和设置的方法
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 wh =new Chef('mo');
console.log(wh.menu ='ve'); //ve
console.log(wh.menu ='or'); //0r
console.log(wh.menu); //['ve','or']
- extends继承
class Person{
constructor(name,age){
this.name=name;
this.age=age;
}
intro(){
return `${this.name},${this.age}`
}
}
class Chef extends Persom{
constructor(name,age){
super(name,age)
}
}
let wh =new Chef('wh',18);
console.log(wh.intro())
//wh,18
- Set函数 （一堆数据的集合，类似数组，但它不能有重复的数据）
let des =new Set('mo','to','ve')
des.add('or');
des.add('ap');
console.log(des);
console.log(des.size);
console.log(des.has('to'));
des.delete('to');
console.log(des);
des.forEach(des=>{
console.log(des)
});
//清空Set()方法
des.clear();
console.log(des);
- Map函数
let food = new Map();
let fr ={} ,cook=function(){},des ='or'
food.set(fr,'ve');
food.set(cook,'mo');
food.set(des,'ap');
console.log(food);
console.log(food.size);
console.log(food.get(fr));
console.log(food.get(cook));
foos.delete(des)
console.log(food.has(des));//false
food.forEach((value,key)=>{
console.log(`${key} = ${value}`);
})
food.clear()；//清除
- Module
//结合webpack或者ispm等工具应用
Modules模块
- 重命名导入导出的相关知识
重命名 可以命名后加as 来重命名
import {} from './'
export ...
- 导出和导入默认
//default默认
export default function di(){
}
网友评论