ES6 -- symbol() and map()

Tips ： When the article is finished , Directories can be generated automatically , How to generate it, please refer to the help document on the right

List of articles

• Catalog

  List of articles

  1.symbol()

  2.Map

   （1） Take the data

   （2） Save the data

   （3） Delete data

   （4） Clear data

   （5） utilize Map Program of writing shopping cart

  ---

1.symbol()

        es6 New basic data : Symbol

        symbol() It is a built-in global function , Generate a unique data

        symbol The instance of is unique and immutable , Used to ensure that the properties of the object are not repeated

         Usage mode : call Symbol( identification ) function Returns a symbol

for example ：

            var a=new Number(200)
			var b=100
			b.age=20                //new Number(100) 
			console.log(b.age)      //new Number(100)

Running results ：

there a It's reference data 、 object ;b It's basic data

symbol() Case study ：

           	let s1=Symbol(100)
			let s2=Symbol(100)
			console.log(s1,s2,s1==s2)

Running results ：

give an example ：

//1. New basic data

            var s1=Symbol(100)

            var s2=Symbol(100)

            console.log(s1,s2,s1==s2,typeof(s1))

Running results ：

 

2.Map

        es6 New data container technology

        map() Method returns a new array , The element in the array is the value after the original array element calls the function .

        map() Method to process elements in the order of the original array elements .

Be careful ： map() Empty arrays are not detected .

Be careful ： map() It doesn't change the original array .

Access data of array

            var  arr=[100,200]                //new Array(100,200)        // Initialization data

            arr.push(300)                       // add to

            var b=arr[0]                         // Take the data

            arr.map(function(el){})         // Take the data

（1） Take the data

            var a=["key"]
			var m1=new Map([["age",100],[20,"hello"],[a,90]])// initialization 

			// Take the data 
			var re1=m1.get("age")
			var re2=m1.get(20)
			var re3=m1.get(["key"])
			var re4=m1.get(a)
			console.log(re1,re2,re3,re4)

Running results ：

（2） Save the data

            var a=["key"]
			var m1=new Map([["age",100],[20,"hello"],[a,90]])// initialization 

            // Save the data 
			m1.set("life",1)
			m1.set("age",1)
			console.log(m1)
			console.log(m1.size)

Running results ：

 （3） Delete data

            var a=["key"]
			var m1=new Map([["age",100],[20,"hello"],[a,90]])// initialization 

            m1.delete(20)
			var re5=m1.delete("age")
			var re6=m1.delete("age")
			console.log(m1,re5,re6)

Running results ：

 （4） Clear data

            var a=["key"]
			var m1=new Map([["age",100],[20,"hello"],[a,90]])// initialization 

           	m1.clear()
			console.log(m1)

Running results ：

 （5） utilize Map Program of writing shopping cart

                 The amount data retrieved from the back end First parse it and then save it to a data container in the front end

            var mycar = {
				data: new Map(),    //map() Represents the data container 

				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: 1,
						title: " fried eggs with tomatoes ",
						price: 10,
						count: 1
					}, {
						id: 2,
						title: " Grilled fish ",
						price: 38,
						count: 1
					}, {
						id:3,
						title: " Steamed Rice ",
						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(3)
			mycar.add(2)
			mycar.add(2)
			mycar.add(1)
			mycar.add(1)
			mycar.add(2)

			mycar.jianshao(2)
			console.log(mycar.data)

			var re1 = mycar.total()
			console.log(re1)

			mycar.clear()
			console.log(mycar.data)

Running results ：