ES6的map对象非数组的map（）方法

通俗解释  map是用来存储东西的，类似obj

写法

举例：

var map = new Map();
  map.a = 1
  map.b = 2
 console.log(map) 

 

再回头看看数组，同样的添加属性

var arr = [];
  arr.a = 1
  arr.b = 2
 console.log(arr) 

 

 

两者很相似

 由此得出结论：map对象，作为被new出来的引用值，通过打点的方式添加属性，length却是0，说明属性被直接添加到了map对象上去了，而实际的存储值却没有，

可以理解为，打点添加，只是在给map对象添加属性，但是不作为map对象的子元素

 

关于map对象的增删查改

 var map = new Map(); 
 map.set("a","123");
 map.set("b","456");  //增与改
 console.log(map)    
 console.log(map.get("a")) //查

删

var map = new Map(); 
 map.a = 1
 map.set("a","123");
 map.set("b","456")
 map.delete("a")  //删
 delete map.a  //删属性
console.log(map) 

---

 

map对象的遍历

此对象的遍历用for循环肯定是不可行的

试一下for in

var map = new Map(); 
 map.a = 1
 map.set("a","123");
 map.set("b","456")
for(var key in map){
    console.log(key)  //a
    console.log(map[key]) //1
}

结果表示利用 for in 循环来遍历属性还是挺好用的

---

 

 可以用ES6新增的for of

for of  循环对象的话，浏览器会告诉你，对象不可重复

可以遍历数组的

但是主要是用来循环map对象的

如下：

 var map = new Map(); 
 map.a = 1
 map.set("a","123");
 map.set("b","456")
for(var key of map){
    console.log(key)  //["a", "123"]  ["b", "456"]
}

key值以数组形式返回

 

既然key值是数组，那又有了新玩法： 

var map = new Map(); 
 map.a = 1
 map.set("a","123");
 map.set("b","456")
for(var [key,value] of map.entries()){
    console.log(key)    //a  b
    console.log(value)  //123  456
}

补充 ：map.entries()为map对象的全写

 

如果仅仅只想遍历value呢？

map换map.values()

如下玩法：

 var map = new Map(); 
 map.a = 1
 map.set("a","123");
 map.set("b","456")
for(var val of map.values()){
    console.log(val)  //123  456
}

如果仅仅只想遍历key呢？

map换map.keys()
如下玩法：

var map = new Map(); 
 map.a = 1
 map.set("a","123");
 map.set("b","456")
for(var key of map.keys()){
    console.log(key)  //a b
}

 

calss（类）

传统的javascript中只有对象，没有类的概念。它是基于原型的面向对象语言。原型对象特点就是将自身的属性共享给新对象。

class Person{//定义了一个名字为Person的类
    constructor(name,age){//constructor是一个构造，用来接收参数
        this.name = name;//this代表的是实例对象
        this.age=age;
    }
    say(){//这是一个类的方法，注意千万不要加上function
        return "我的名字叫" + this.name+"今年"+this.age+"岁了";
    }
}

let p1 = new Person("jack",18)  //创建实例对象
console.log(p1.say())    //我的名字叫jack今年18岁了

注意：

1.类声明不需要加function

2.方法不在constructor里

 继承

通过extends来继承

 class Person{//定义了一个名字为Person的类
    constructor(name,age){//constructor是一个构造方法，用来接收参数
        this.name = name;//this代表的是实例对象
        this.age=age;
    }
    say(){      //类的方法
        return  "我的名字叫" + this.name+"今年"+this.age+"岁了";
    }    
}
let p1 = new Person("jack",18)
 class Son extends Person {}
 let son =new Son("tony",20)
 console.log(son.name)  //tony

 继承例子2：

class Person{
    constructor(name,age){
        this.name = name;
        this.age=age;
    }
    say(){
        return  "我的名字叫" + this.name+"今年"+this.age+"岁了";
    }
}
let p1 = new Person("jack",18)

class Son extends Person {
     constructor(name,age,color){
          super();   //写继承，必须加上的，而且是加在this的上面      
      this.name = name;
      this.age = age;
      this.color  = color;

     }
 }
 let son =new Son("tony",20,"black")
 console.log(son.name)  //tony
 console.log(son.say())  //我的名字叫tony今年20岁了