es6--Map,相关购物车设计,Set

1)Map

map是一种数据容器,Map 对象保存键值对。任何值(对象或者原始值) 都可以作为一个键或一个值。 使用set存(已有的就修改)get取 

1、Map中的key 可以是任何值(如字符串,数字,函数,对象,NaN)

var myMap = new Map();
var keyString = "a string"; 
 
myMap.set(keyString, "和键'a string'关联的值");
 
myMap.get(keyString);    // "和键'a string'关联的值"
myMap.get("a string");   // "和键'a string'关联的值"
                         // 因为 keyString === 'a string'
var myMap = new Map();
var keyObj = {}, 
 
myMap.set(keyObj, "和键 keyObj 关联的值");

myMap.get(keyObj); // "和键 keyObj 关联的值"
myMap.get({}); // undefined, 因为 keyObj !== {}
var myMap = new Map();
var keyFunc = function () {}, // 函数
 
myMap.set(keyObj, "和键 keyObj 关联的值");
 
myMap.get(keyFunc); // "和键 keyFunc 关联的值"
myMap.get(function() {}) // undefined, 因为 keyFunc !== function () {}
var myMap = new Map();
myMap.set(NaN, "not a number");
 
myMap.get(NaN); // "not a number"
 
var otherNaN = Number("foo");
myMap.get(otherNaN); // "not a number"
 var mymao=new Map()
        mymao.set(NaN,1242)
        mymao.set(String,1343)
        mymao.set(Function,1432)
        console.log(mymao) //Map(3) {NaN => 1242, 'AF' => 1343, ƒ => 1432}

注意:当get取一个不存在的值时会返回undefined,也可以使用delete删除,clear清空

2、Map特点:有序、键值对(键可以是任意类型)、键名不能重复(如果重复,那么覆盖)

map的遍历

forEach() ,for...of

var myMap = new Map();
myMap.set(0, "zero");
myMap.set(1, "one");
 
// 将会显示两个 logs。 一个是 "0 = zero" 另一个是 "1 = one"
myMap.forEach(function(value, key) {
  console.log(key + " = " + value);
}, myMap)

购物车相关问题

	var mycar = {
				data: new Map(),
				clear:function(){
					this.data.clear()
				},
				jianshao:function(id){
					let obj=this.data.get(id)
					if(obj){
						obj.count--
						if(obj.count<=0){
							this.data.delete(id)
						}
					}
				},
				add: function(id) {
					let obj = this.data.get(id)
					if (obj) {
						// console.log(obj)
						obj.count++
						this.data.set(id, obj)
					}
				},
				total: function() {
					var result = 0;
					this.data.forEach(function(el) {
						console.log(el)
						result += el.count * el.price
					})
					return result
				},
				network: function() {
					var jiashuju = [{
						id: 435123,
						title: "鱼香肉丝",
						price: 18,
						count: 1
					}, {
						id: 435124,
						title: "东坡肉",
						price: 28,
						count: 1
					}, {
						id: 435125,
						title: "米饭",
						price: 2,
						count: 2
					}];
					// this.data.set(jiashuju[0].id,jiashuju[0])
					// this.data.set(jiashuju[1].id,jiashuju[1])
					// this.data.set(jiashuju[2].id,jiashuju[2])
					var self = this
					jiashuju.map(function(el) {
						self.data.set(el.id, el)
					})
				}
			}
			mycar.network()
			mycar.add(435123)
			mycar.add(435125)
			mycar.add(435125)
			mycar.add(435125)
			mycar.add(435125)
			mycar.add(435125)
			mycar.jianshao(435124)
			console.log(mycar.data)
			var re1 = mycar.total()
			console.log(re1)
			mycar.clear()
			console.log(mycar.data)

Set(一般用于数组去重)

Set对象允许你存储任何类型的唯一值,无论是原始值或者是对象引用。

1、作用

数组去重 

var mySet = new Set([1, 2, 3, 4, 4]);
[...mySet]; // [1, 2, 3, 4]

并集

 

var a = new Set([1, 2, 3]);
var b = new Set([4, 3, 2]);
var union = new Set([...a, ...b]); // {1, 2, 3, 4}

交集

 

var a = new Set([1, 2, 3]);
var b = new Set([4, 3, 2]);
var intersect = new Set([...a].filter(x => b.has(x))); // {2, 3}

差集 

var a = new Set([1, 2, 3]);
var b = new Set([4, 3, 2]);
var difference = new Set([...a].filter(x => !b.has(x))); // {1}

2、Set中的特殊值

Set 对象存储的值总是唯一的,所以需要判断两个值是否恒等。有几个特殊值需要特殊对待:

+0 与 -0 在存储判断唯一性的时候是恒等的,所以不重复;
undefined 与 undefined 是恒等的,所以不重复;
NaN 与 NaN 是不恒等的,但是在 Set 中只能存一个,不重复。

let mySet = new Set();
 
mySet.add(1); // Set(1) {1}
mySet.add(5); // Set(2) {1, 5}
mySet.add(5); // Set(2) {1, 5} 这里体现了值的唯一性
mySet.add("some text"); 
// Set(3) {1, 5, "some text"} 这里体现了类型的多样性


var o = {a: 1, b: 2}; 
mySet.add(o);
mySet.add({a: 1, b: 2}); 
// Set(5) {1, 5, "some text", {…}, {…}} 
// 这里体现了对象之间引用不同不恒等,即使值相同,Set 也能存储


        let s = new Set();
        s.add([1]);
        s.add([1]);
        console.log(s.size);数组属于引用数据所以,size为2

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值