|
| 1 | +/* |
| 2 | +Set | Map | WeakSet | WeakMap |
| 3 | +*************MAP********** |
| 4 | +
|
| 5 | + Map is a collection of keyed data items, just like an Object. But the main difference is that Map allows keys of any type. |
| 6 | +
|
| 7 | +Methods and properties are: |
| 8 | +
|
| 9 | + new Map() – creates the map. |
| 10 | + map.set(key, value) – stores the value by the key. |
| 11 | + map.get(key) – returns the value by the key, undefined if key doesn’t exist in map. |
| 12 | + map.has(key) – returns true if the key exists, false otherwise. |
| 13 | + map.delete(key) – removes the element (the key/value pair) by the key. |
| 14 | + map.clear() – removes everything from the map. |
| 15 | + map.size – returns the current element count. |
| 16 | +
|
| 17 | +let map = new Map(); |
| 18 | +map.set("name", "John");//add key value |
| 19 | +map.set(1, "ali"); |
| 20 | +map.delete(1);//delete elemenet by key |
| 21 | +console.log(map); // |
| 22 | +console.log(map.size); //return size of map |
| 23 | +
|
| 24 | +
|
| 25 | +********************iteration over map************************ |
| 26 | +
|
| 27 | + For looping over a map, there are 3 methods: |
| 28 | +
|
| 29 | + map.keys() – returns an iterable for keys, |
| 30 | + map.values() – returns an iterable for values, |
| 31 | + map.entries() – returns an iterable for entries [key, value], it’s used by default in for..of. |
| 32 | +
|
| 33 | + For instance: |
| 34 | +
|
| 35 | +let recipeMap = new Map([ |
| 36 | + ['cucumber', 500], |
| 37 | + ['tomatoes', 350], |
| 38 | + ['onion', 50] |
| 39 | +]); |
| 40 | +
|
| 41 | + iterate over keys (vegetables) |
| 42 | +for (let vegetable of recipeMap.keys()) { |
| 43 | + alert(vegetable); // cucumber, tomatoes, onion |
| 44 | +} |
| 45 | +
|
| 46 | + iterate over values (amounts) |
| 47 | +for (let amount of recipeMap.values()) { |
| 48 | + alert(amount); // 500, 350, 50 |
| 49 | +} |
| 50 | +
|
| 51 | + iterate over [key, value] entries |
| 52 | +for (let entry of recipeMap) { // the same as of recipeMap.entries() |
| 53 | + alert(entry); // cucumber,500 (and so on) |
| 54 | +} |
| 55 | +
|
| 56 | +
|
| 57 | + *********************************SET**************************** |
| 58 | +
|
| 59 | + A Set is a special type collection – “set of values” (without keys), where each value may occur only once. |
| 60 | +
|
| 61 | +Its main methods are: |
| 62 | +
|
| 63 | +new Set([iterable]) – creates the set, and if an iterable object is provided (usually an array), copies values from it into the set. |
| 64 | +set.add(value) – adds a value, returns the set itself. |
| 65 | +set.delete(value) – removes the value, returns true if value existed at the moment of the call, otherwise false. |
| 66 | +set.has(value) – returns true if the value exists in the set, otherwise false. |
| 67 | +set.clear() – removes everything from the set. |
| 68 | +set.size – is the elements count. |
| 69 | +
|
| 70 | +let set = new Set(); |
| 71 | +
|
| 72 | +let john = { name: "John" }; |
| 73 | +let pete = { name: "Pete" }; |
| 74 | +let mary = { name: "Mary" }; |
| 75 | +
|
| 76 | + visits, some users come multiple times |
| 77 | +set.add(john); |
| 78 | +set.add(pete); |
| 79 | +set.add(mary); |
| 80 | +set.add(john); |
| 81 | +set.add(mary); |
| 82 | +
|
| 83 | + set keeps only unique values |
| 84 | +alert(set.size); // 3 |
| 85 | +
|
| 86 | +for (let user of set) { |
| 87 | + alert(user.name); // John (then Pete and Mary) |
| 88 | +} |
| 89 | +
|
| 90 | +
|
| 91 | +********************iteration over set****************** |
| 92 | +let set1 = new Set(["oranges", "apples", "bananas"]); |
| 93 | +
|
| 94 | +for (let value of set) alert(value); |
| 95 | +
|
| 96 | + the same with forEach: |
| 97 | +set.forEach((value, valueAgain, set) => { |
| 98 | + alert(value); |
| 99 | +}); |
| 100 | +
|
| 101 | + ****************************** WEAKMAP ******************************* |
| 102 | +
|
| 103 | + The first difference between Map and WeakMap is that keys must be objects, not primitive values: |
| 104 | +
|
| 105 | +let weakMap = new WeakMap(); |
| 106 | +
|
| 107 | +let obj = {}; |
| 108 | +
|
| 109 | +weakMap.set(obj, "ok"); // works fine (object key) |
| 110 | +
|
| 111 | +can't use a string as the key |
| 112 | +weakMap.set("test", "Whoops"); |
| 113 | +
|
| 114 | +WeakMap does not support iteration and methods keys(), values(), entries(), so there’s no way to get all keys or values from it. |
| 115 | +
|
| 116 | +WeakMap has only the following methods: |
| 117 | +
|
| 118 | +weakMap.set(key, value) |
| 119 | +weakMap.get(key) |
| 120 | +weakMap.delete(key) |
| 121 | +weakMap.has(key) |
| 122 | +
|
| 123 | +*************************** WEAKSET ******************************************* |
| 124 | + WeakSet behaves similarly: |
| 125 | +
|
| 126 | +It is analogous to Set, but we may only add objects to WeakSet(not primitives). |
| 127 | +
|
| 128 | +An object exists in the set while it is reachable from somewhere else. |
| 129 | +
|
| 130 | +Like Set, it supports add, has and delete, but not size, keys() and no iterations. |
| 131 | +
|
| 132 | + For instance, we can add users to WeakSet to keep track of those who visited our site: |
| 133 | +
|
| 134 | +let visitedSet = new WeakSet(); |
| 135 | +let john = { name: "John" }; |
| 136 | +let pete = { name: "Pete" }; |
| 137 | +let mary = { name: "Mary" }; |
| 138 | +
|
| 139 | +visitedSet.add(john); // John visited us |
| 140 | +visitedSet.add(pete); // Then Pete |
| 141 | +visitedSet.add(john); // John again |
| 142 | +
|
| 143 | + visitedSet has 2 users now |
| 144 | +
|
| 145 | + check if John visited ? |
| 146 | + alert(visitedSet.has(john)); // true |
| 147 | +
|
| 148 | +check if Mary visited ? |
| 149 | + alert(visitedSet.has(mary)); // false |
| 150 | +
|
| 151 | +john = null; |
| 152 | +
|
| 153 | +
|
| 154 | + ---------------------------------------------------------------------- |
| 155 | +********************************************Date Object******************************** |
| 156 | +
|
| 157 | +To create a new Date object call new Date() with one of the following arguments: |
| 158 | +
|
| 159 | +new Date() |
| 160 | +
|
| 161 | +ex=> |
| 162 | + let x= new Date(); |
| 163 | + console.log("Current date:",x);// Current date |
| 164 | +
|
| 165 | +****there are methods to access day,month and year from the date |
| 166 | +
|
| 167 | +getFullYear() |
| 168 | + Get the year (4 digits) |
| 169 | + let x=new Date(); |
| 170 | + console.log(x.getDay()); |
| 171 | +
|
| 172 | +getMonth() |
| 173 | + Get the month, from 0 to 11. |
| 174 | +getDate() |
| 175 | + Get the day of month, from 1 to 31, the name of the method does look a little bit strange. |
| 176 | +getHours(), getMinutes(), getSeconds(), getMilliseconds() |
| 177 | + Get the corresponding time components. |
| 178 | +
|
| 179 | +
|
| 180 | +
|
| 181 | +-------------------------------------------------------------------- |
| 182 | +**************************************JSON OBJECT****************************** |
| 183 | +
|
| 184 | +
|
| 185 | +JSON is java script object notation |
| 186 | +JSON is text formating for storing and transporing data |
| 187 | +JSON is language independant |
| 188 | +
|
| 189 | +=>This example is a JSON string: |
| 190 | +'{"name":"John", "age":30, "car":null}' |
| 191 | +
|
| 192 | +JSON Values |
| 193 | +
|
| 194 | +=>In JSON, values must be one of the following data types: |
| 195 | +
|
| 196 | +a string |
| 197 | +a number |
| 198 | +an object |
| 199 | +an array |
| 200 | +a boolean |
| 201 | +null |
| 202 | +
|
| 203 | +JavaScript provides methods: |
| 204 | +
|
| 205 | +JSON.stringify to convert objects into JSON. |
| 206 | +JSON.parse to convert JSON back into an object. |
| 207 | +
|
| 208 | +
|
| 209 | +=> Example - Parsing JSON |
| 210 | +
|
| 211 | +Imagine we received this text from a web server: |
| 212 | +'{"name":"John", "age":30, "city":"New York"}' |
| 213 | +
|
| 214 | +Use the JavaScript function JSON.parse() to convert text into a JavaScript object: |
| 215 | +const obj = JSON.parse('{"name":"John", "age":30, "city":"New York"}'); |
| 216 | +
|
| 217 | +=>JSON.parse()=> mathod in js |
| 218 | +
|
| 219 | +When receiving data from a web server, the data is always a string. |
| 220 | +Parse the data with JSON.parse(), and the data becomes a JavaScript object. |
| 221 | +
|
| 222 | +use JSON.parse method to convert string into obj |
| 223 | +
|
| 224 | +let x='{"name":"John", "age":30, "city":"New York"}'; |
| 225 | +let y=JSON.parse(x); |
| 226 | +console.log(y); |
| 227 | +
|
| 228 | +=> convert date |
| 229 | +let x='{"name":"John", "date":"2012-5-14", "city":"New York"}'; |
| 230 | +let y=JSON.parse(x ); |
| 231 | +y.date=new Date(y.date) |
| 232 | +console.log(y); |
| 233 | +
|
| 234 | +Or, you can use the second parameter, of the JSON.parse() function, called reviver. |
| 235 | + let x='{"name":"John", "date":"2012-12-14", "city":"New York"}'; |
| 236 | +
|
| 237 | +let y=JSON.parse(x, function(key,value){ |
| 238 | + if(key=="date"){ |
| 239 | + return new Date(value); |
| 240 | + } |
| 241 | + else{ |
| 242 | + return value; |
| 243 | + } |
| 244 | +}); |
| 245 | +console.log(y); |
| 246 | +
|
| 247 | +=>JSON.stringify method=> |
| 248 | +
|
| 249 | +When sending data to a web server, the data has to be a string. |
| 250 | +Convert a JavaScript object into a string with JSON.stringify(). |
| 251 | +
|
| 252 | +const obj = {name: "John", age: 30, city: "New York"}; |
| 253 | +const myJSON = JSON.stringify(obj); |
| 254 | +
|
| 255 | +console.log(myJSON); |
| 256 | +
|
| 257 | +=>Stringify Dates |
| 258 | +
|
| 259 | +In JSON, date objects are not allowed. The JSON.stringify() function will convert any dates into strings. |
| 260 | +
|
| 261 | +Example=> |
| 262 | +
|
| 263 | +const obj = {name: "John", today: new Date(), city : "New York"}; |
| 264 | +const myJSON = JSON.stringify(obj); |
| 265 | +
|
| 266 | +=> we can conver function to string => |
| 267 | +
|
| 268 | +const obj = {name: "John", age: function () {return 30;}, city: "New York"}; |
| 269 | +obj.age = obj.age.toString(); |
| 270 | +const myJSON = JSON.stringify(obj); |
| 271 | +
|
| 272 | +*/ |
| 273 | + |
| 274 | + |
| 275 | + |
0 commit comments