एक बच्चे ने जावास्क्रिप्ट में सब कुछ लिखा, और ग्राहक और सर्वर ने कहा कि उसे यह पसंद आया, आसानी से, आसानी से। तब वह निश्चित रूप से, दुर्खी ले जाया गया।
- इंटरनेट से

सामग्री, या जो हमें आउटपुट में मिलती है:

• दृष्टिकोण

• भाग एक: बैसाखी

  
  
  • ECMAScript 5
  • ECMAScript 6
  • ECMAScript 6: प्रतीक
  • ECMAScript 6: संग्रह
  • ईसीएमएस्क्रिप्ट 6: Iterators
  • ECMAScript 6: वादा करता है
  • मोज़िला जावास्क्रिप्ट: ऐरे तरीकों के स्टेटिक संस्करण
  • विलंबित निष्पादन: setTimeout, setInterval, setImmediate
  • कंसोल
  
  

• भाग दो: साइकिलें

  
  
  • डेटा वर्गीकरण
  • शब्दकोशों
  • आंशिक आवेदन
  • दिनांक स्वरूपण
  • ऑब्जेक्ट एपीआई
  • सरणियों
  • संख्या
  • विशेष पात्रों को बचाना
  
  

• निष्कर्ष

# दृष्टिकोण

• मानक पुस्तकालय में आरामदायक काम के लिए सभी न्यूनतम आवश्यक होने चाहिए, न कि किसी विशिष्ट प्लेटफॉर्म के एपीआई के साथ काम करने की क्षमता सहित।
• मानक हमारे सब कुछ हैं। पुस्तकालय का मुख्य भाग पॉलीफ़ाइल्स है। यह सिर्फ सभी आवश्यक कार्यक्षमता मानकीकृत नहीं है।
• यदि सिस्टम में उपलब्ध कार्यक्षमता को विनिर्देश या वास्तविक मानक के अनुसार लागू किया जाता है, तो हम इसे देशी छोड़ देते हैं, लेकिन यदि कार्यक्षमता को मानकीकृत नहीं किया जाता है, तो भविष्य के टकराव से बचने के लिए, हम इसे बल द्वारा प्रतिस्थापित करते हैं।
• पुस्तकालय कॉम्पैक्ट होना चाहिए और अच्छी तरह से संपीड़ित होना चाहिए।
• प्रतिरूपकता, केवल आवश्यक कार्यक्षमता को इकट्ठा करने की क्षमता।
• अंतिम आवेदन लिखें - आप राजा और भगवान हैं, और एक पुस्तकालय का उपयोग करने का हर अधिकार है जो मूल वस्तुओं का विस्तार करता है। मुख्य बात यह है कि केवल एक पुस्तकालय ऐसा करेगा।
• एक पुस्तकालय या एनपीएम मॉड्यूल लिखें - आप किसी भी मामले में देशी वस्तुओं का विस्तार करने वाले पुस्तकालय का उपयोग नहीं कर सकते हैं। अंतिम आवेदन लिखने वाले प्रोग्रामर के संघर्षों को जोखिम में डालते हुए। इस मामले में, उनका विस्तार किए बिना निर्माण करना संभव है।

 console.log(Array.from(new Set([1, 2, 3, 2, 1]))); // => [1, 2, 3] console.log('*'.repeat(10)); // => '**********' Promise.resolve(32).then(console.log); // => 32 setImmediate(console.log, 42); // => 42 

 var log = core.console.log; log(core.Array.from(new core.Set([1, 2, 3, 2, 1]))); // => [1, 2, 3] log(core.String.repeat('*', 10)); // => '**********' core.Promise.resolve(32).then(log); // => 32 core.setImmediate(log, 42); // => 42 

 npm i core-js 

 //  : require('core-js'); //     : var core = require('core-js/library'); // ,   : require('core-js/shim'); 

• अधिकतम: विकास , उत्पादन (21.8 kb gzip को छोड़कर)
• देशी वस्तुओं के विस्तार के बिना: विकास , उत्पादन (21.8 kb gzip को छोड़कर)
• पॉलीफिल्स केवल: विकास , उत्पादन (16.7 kb छोड़कर gzip)

 npm i -g grunt-cli npm i core-js cd node_modules/core-js && npm i grunt build:date,console,library --path=custom uglify 

# भाग एक: बैसाखी

# ECMAScript 5

# ऐरे तरीके

 [1, 2, 3, 2, 1].indexOf(2); // => 1 [1, 2, 3, 2, 1].lastIndexOf(2); // => 3 [1, 2, 3].forEach(function(val, key){ console.log(val); // => 1, 2, 3 console.log(key); // => 0, 1, 2 }); [1, 2, 3].map(function(it){ return it * it; }); // => [1, 4, 9] [1, 2, 3].filter(function(it){ return it % 2; }); // => [1, 3] function isNum(it){ return typeof it == 'number'; } [1, '2', 3].every(isNum); // => false [1, '2', 3].some(isNum); // => true function add(a, b){ return a + b; } [1, 2, 3].reduce(add); // => 6 [1, 2, 3].reduceRight(add, ''); // => '321' 

 Array.prototype.map.call('123', function(it){ return it * it; }); // => [1, 4, 9] Array.prototype.slice.call('qwe', 1); // => ['w', 'e'] Array.prototype.join.call('qwe', '|'); // => 'q|w|e' 

 Array.isArray([1, 2, 3]); // => true Array.isArray(Object.create(Array.prototype)); // => false 

# ऑब्जेक्ट एपीआई

 function Parent(/*...*/){ /*...*/ } Parent.prototype = {constructor: Parent /*, ... */} function Child(/*...*/){ Parent.call(this /*, ...*/); // ... } //   ES3 (  inherit  extend'): function Tmp(){} Tmp.prototype = Parent.prototype; Child.prototype = new Tmp; Child.prototype.constructor = Child; //   ES5: Child.prototype = Object.create(Parent.prototype, {constructor: {value: Child}}); var dict = Object.create(null); dict.key = 42; console.log(dict instanceof Object); // => false console.log(dict.toString) // => undefined console.log(dict.key) // => 42 

 var parent = {foo: 'bar'} , child = Object.create(parent); console.log(Object.getPrototypeOf(child) === parent); // => true function F(){} console.log(Object.getPrototypeOf(new F) === F.prototype); // => true F.prototype = {constructor: F /*, ...*/}; console.log(Object.getPrototypeOf(new F) === F.prototype); // => true F.prototype = {}; console.log(Object.getPrototypeOf(new F) === F.prototype); //  IE8-    

 console.log(Object.keys({q: 1, w: 2, e: 3})); // => ['q', 'w', 'e'] console.log(Object.keys([1, 2, 3])); // => ['0', '1', '2'] console.log(Object.getOwnPropertyNames([1, 2, 3])); // => ['0', '1', '2', 'length'] 

Object.freeze, Object.preventExtensions, Object.seal, के साथ, eval
पागल बकवास है कि आप शायद कभी नहीं की आवश्यकता होगी। इससे दूर रहें।
- फेलिक्स गिसेन्ड्रॉफ़र

# अन्य

 var fn = console.log.bind(console, 42); fn(43); // => 42 43 

 Date.now(); // => 1400263401642 

 '\n  \n'.trim(); // => '' 

# ECMAScript 6

• फ़ायरफ़ॉक्स समर्थन के साथ सभी का सबसे अच्छा - एक बहुत पहले से ही उपलब्ध है।
• # V8 में (Chrome, Opera, Node.js) काफी उपलब्ध है, लेकिन विकल्पों का एक महत्वपूर्ण हिस्सा डिफ़ॉल्ट रूप से अवरुद्ध है, उन्हें ब्राउज़र में सक्रिय करने के लिए आपको बॉक्स को चेक करने की आवश्यकता है "प्रयोगात्मक जावास्क्रिप्ट सक्षम करें" (पार्सर लिंक chrome://flags/#enable-javascript-harmony खाता है chrome://flags/#enable-javascript-harmony ), और Node.js - --harmony ध्वज के साथ --harmony । ध्वज के बिना भी कुछ उपलब्ध है, उदाहरण के लिए, Promise , WeakMap और WeakSet , और क्रोम 38 Symbol , Map , Set , WeakSet साथ भी उपलब्ध हैं। इस संबंध में Node.js पिछड़ जाता है, चूंकि, विशेष रूप से एक स्थिर शाखा में, v8 को शायद ही कभी अपडेट किया जाता है। लेकिन यह, उपयोगकर्ता के ब्राउज़र के विपरीत, कोई भी आपको ध्वज के साथ चलने के लिए परेशान नहीं करता है।
• IE , हमेशा की तरह, बुरा है, लेकिन 11 वें संस्करण के संग्रह और एक जोड़े में अधिक विशेषताएं जोड़ी गईं। निकट भविष्य में, वे बहुत वादा करते हैं ।
• उन्होंने सफारी में ईएस 6 कार्यक्षमता जोड़ने की कोशिश की। यह लगभग सब कुछ है जो उन्होंने जोड़ा है, मानक को पूरा नहीं करता है और अनावश्यक समस्याओं का कारण बनता है, इसलिए इसे जोड़ना बेहतर नहीं होगा। लिंक समस्याओं का एक छोटा सा हिस्सा है।

प्रीप्रोसेसर के बारे में थोड़ा सा ECMAScript 6+

# ऑब्जेक्ट.बेसिन

 var foo = {q: 1, w: 2} , bar = {e: 3, r: 4} , baz = {t: 5, y: 6}; Object.assign(foo, bar, baz); // => foo = {q: 1, w: 2, e: 3, r: 4, t: 5, y: 6} 

# वस्तु

 NaN === NaN // => false 0 === -0 // => true,   : 1/0 === 1/-0 // => false 

 Object.is(NaN, NaN); // => true Object.is(0, -0); // => false Object.is(42, 42); // => true,  '===' Object.is(42, '42'); // => false,  '===' 

# Object.setPrototypOf

 function Parent(){} function Child(){} Object.setPrototypeOf(Child.prototype, Parent.prototype); new Child instanceof Child; // => true new Child instanceof Parent; // => true function fn(){} Object.setPrototypeOf(fn, []); typeof fn == 'function'; // => true fn instanceof Array; // => true var object = {}; Object.setPrototypeOf(object, null); object instanceof Object; // => false 

 var setPrototypeOf = Function.call.bind(Object.getOwnPropertyDescriptor(Object.prototype, '__proto__').set); 

इसलिए हम जीते हैं:

• IE10 के लिए- अनुकरण Object.setPrototypeOfपूरी तरह से अनुपस्थित है, क्योंकि यह असंभव है।
• पुराने संस्करणों में v8 Object.setPrototypeOfकाम नहीं करेंगे लक्ष्यों की श्रृंखला में प्रोटोटाइप अनुपस्थित Object.prototypeया संपत्ति __proto__के माध्यम से अधिरोहित, उदाहरण के लिए Object.defineProperty।

# ऐरे तरीके

 Array.from(new Set([1, 2, 3, 2, 1])); // => [1, 2, 3] Array.from({0: 1, 1: 2, 2: 3, length: 3}); // => [1, 2, 3] Array.from('123', Number); // => [1, 2, 3] Array.from('123', function(it){ return it * it; }); // => [1, 4, 9] 

 Array.of(1); // => [1] Array.of(1, 2, 3); // => [1, 2, 3] 

 function isOdd(val){ return val % 2; } [4, 8, 15, 16, 23, 42].find(isOdd); // => 15 [4, 8, 15, 16, 23, 42].findIndex(isOdd); // => 2 [4, 8, 15, 16, 23, 42].find(isNaN); // => undefined [4, 8, 15, 16, 23, 42].findIndex(isNaN); // => -1 

 Array(5).map(function(){ return 42; }); // => [undefined × 5],   .map  ""   Array(5).fill(42); // => [42, 42, 42, 42, 42] 

# स्ट्रिंग के तरीके

 'foobarbaz'.includes('bar'); // => true 'foobarbaz'.includes('bar', 4); // => false 'foobarbaz'.startsWith('foo'); // => true 'foobarbaz'.startsWith('bar', 3); // => true 'foobarbaz'.endsWith('baz'); // => true 'foobarbaz'.endsWith('bar', 6); // => true 

 'string'.repeat(3); // => 'stringstringstring' 

# संख्याओं के साथ काम करें

# ECMAScript 6: प्रतीक

 var Person = (function(){ var NAME = Symbol('name'); function Person(name){ this[NAME] = name; } Person.prototype.getName = function(){ return this[NAME]; }; return Person; })(); var person = new Person(''); console.log(person.getName()); // => '' console.log(person['name']); // => undefined console.log(person[Symbol('name')]); // => undefined,   Symbol    for(var key in person)console.log(key); // =>  'getName',       console.log(typeof Symbol()); // => 'symbol' 

 window.Symbol || (function(){ var id = 0; window.Symbol = function(description){ if(this instanceof Symbol)throw new TypeError('Symbol is not a constructor'); var symbol = Object.create(Symbol.prototype) , tag = 'Symbol(' + description + ')_' + (++id + Math.random()).toString(36); symbol.tag = tag; Object.defineProperty(Object.prototype, tag, { configurable: true, set: function(it){ Object.defineProperty(this, tag, { enumerable : false, configurable: true, writable : true, value : it }); } }); return symbol; } Symbol.prototype.toString = function(){ return this.tag; } })(); 

• सेटर इसमें लिखते हैं Object.prototype: विशेष रूप से इसका दुरुपयोग न करें, यह प्रदर्शन को प्रभावित कर सकता है।
• : IE8- ( # Object.defineProperty ), Object.prototype , «» .
• , Object.prototype (, Object.create(null) ), «» .
• Symbol() in {} true — .
• typeof Symbol() 'object' — JavaScript .
• Object.getOwnPropertySymbols — Object.getOwnPropertyNames , , Object.getOwnPropertyNames , , «».

 var Person = function(){ var NAME = Symbol.pure('name'); function Person(name){ Symbol.set(this, NAME, name); } Person.prototype.getName = function(){ return this[NAME]; }; return Person; }(); 

 var O = {a: 1}; Object.defineProperty(O, 'b', {value: 2}); O[Symbol('c')] = 3; Reflect.ownKeys(O); // => ['a', 'b', Symbol(c)] 

 var symbol = Symbol.for('key'); symbol === Symbol.for('key'); // true Symbol.keyFor(symbol); // 'key' 

# ECMAScript 6: संग्रह

• # संग्रह का विवरण
• # इंजन का समर्थन
• # कार्यान्वयन MapऔरSet
• # शिथिल युग्मित संग्रह को लागू करना

 var a = [1]; var map = new Map([['a', 1], [42, 2]]); map.set(a, 3).set(true, 4); console.log(map.size); // => 4 console.log(map.has(a)); // => true console.log(map.has([1])); // => false console.log(map.get(a)); // => 3 map.forEach(function(val, key){ console.log(val); // => 1, 2, 3, 4 console.log(key); // => 'a', 42, [1], true }); map.delete(a); console.log(map.size); // => 3 console.log(map.get(a)); // => undefined console.log(Array.from(map)); // => [['a', 1], [42, 2], [true, 4]] 

 var set = new Set(['a', 'b', 'a', 'c']); set.add('d').add('b').add('e'); console.log(set.size); // => 5 console.log(set.has('b')); // => true set.forEach(function(it){ console.log(it); // => 'a', 'b', 'c', 'd', 'e' }); set.delete('b'); console.log(set.size); // => 4 console.log(set.has('b')); // => false console.log(Array.from(set)); // => ['a', 'c', 'd', 'e'] 

 var a = [1] , b = [2] , c = [3]; var wmap = new WeakMap([[a, 1], [b, 2]]); wmap.set(c, 3).set(b, 4); console.log(wmap.has(a)); // => true console.log(wmap.has([1])); // => false console.log(wmap.get(a)); // => 1 wmap.delete(a); console.log(wmap.get(a)); // => undefined //      var Person = (function(){ var names = new WeakMap; function Person(name){ names.set(this, name); } Person.prototype.getName = function(){ return names.get(this); }; return Person; })(); var person = new Person(''); console.log(person.getName()); // => '' for(var key in person)console.log(key); // =>  'getName' 

 var a = [1] , b = [2] , c = [3]; var wset = new WeakSet([a, b, a]); wset.add(c).add(b).add(c); console.log(wset.has(b)); // => true console.log(wset.has([2])); // => false wset.delete(b); console.log(wset.has(b)); // => false 

• में फ़ायरफ़ॉक्स वहाँ भरा हुआ है Map, Setऔर WeakMap। रात में बिल्ड अप दिखाई दिया WeakSet। Mapऔर Setचलने योग्य वस्तु ले लो। Mapऔर Setपुनरावृत्तियों और एक विधि है .forEach।
• v8 — Chrome, Opera Node.js , 4 . Chrome 38, . WeakMap WeakSet . # . v8 , Map Set .forEach , Map Set , .
• IE11 Map, Set WeakMap . . Map Set , .forEach .
• Safari , . Map, Set WeakMap . . , , , , , next . forEach , 3 , , 1 Set 2 Map .

# मानचित्र और सेट का कार्यान्वयन

 var array = []; for(var i = 0; i < 100000; i++)array.push([{}, {}]); array = array.concat(array); console.time('Map test'); var map = new Map(array); console.timeEnd('Map test'); console.log('Map size: ' + map.size); 

 Map test:   Map test: 46.25 Map size: 100000 

 Map test:   Map test: 506823.31 Map size: 100000 

 function fastKey(key){ if(typeof key === 'string')return '$' + key; else if(typeof key === 'number')return key; return null; }; 

 var STOREID = Symbol('storeId') , id = 0; function fastKey(it){ //    'S'      'P'    if(it !== Object(it))return (typeof it == 'string' ? 'S' : 'P') + it; //      -  if(!Object.hasOwnProperty.call(it, STOREID))it[STOREID] = ++id; //     'O' return 'O' + it[STOREID]; } 

 Map test:   Map test: 669.93 Map size: 100000 

# शिथिल युग्मित संग्रह को लागू करना

 window.WeakMap || (function(){ var id = 0 , has = Function.call.bind(Object.prototype.hasOwnProperty) , WEAKDATA = Symbol('WeakData') , ID = Symbol('ID'); window.WeakMap = function(){ if(!(this instanceof WeakMap))throw TypeError(); this[ID] = id++; } Object.assign(WeakMap.prototype, { 'delete': function(key){ return this.has(key) && delete key[WEAKDATA][this[ID]]; }, has: function(key){ return key === Object(key) && has(key, WEAKDATA) && has(key[WEAKDATA], this[ID]); }, get: function(key){ if(key === Object(key) && has(key, WEAKDATA))return key[WEAKDATA][this[ID]]; }, set: function(key, value){ if(key !== Object(key))throw TypeError(); if(!has(key, WEAKDATA))key[WEAKDATA] = {}; key[WEAKDATA][this[ID]] = value; return this; } }); })(); 

 // <-   snapshot 1 var array = []; for(var i = 0; i < 100000; i++)array[i] = {}; var wm = new WeakMap(); for(var i = 0; i < 100000; i++)wm.set(array[i], {}); // <-   snapshot 2 array = null; // <-   snapshot 3 

# ECMAScript 6: इटरेटर

• # इटरेटर इंटरफ़ेस
• # चलने योग्य वस्तु का प्रतीक, प्रतीक Symbol.iterator
• # जनरेटर
• # साइकिल for-of
• # निर्माणकर्ताओं ने अंतर्निर्मित निर्माणकर्ता और उन्हें वापस करने वाले तरीकों के उदाहरण दिए
• # तरीके और कंस्ट्रक्टर जो पुनरावृत्त वस्तुओं को स्वीकार करते हैं
• # फैला हुआ ऑपरेटर
• # एरियर / जनरेटर की समझ

 function NumberIterator(number){ var i = 0; return { next: function(){ return i < number ? {done: false, value: i++} : {done: true}; } } } var iter = NumberIterator(3); iter.next(); // => {done: false, value: 0} iter.next(); // => {done: false, value: 1} iter.next(); // => {done: false, value: 2} iter.next(); // => {done: true} 

 Number.prototype[Symbol.iterator] = function(){ return NumberIterator(this); } Array.from(10); // => [0, 1, 2, 3, 4, 5, 6, 7, 8, 9] 

 Number.prototype[Symbol.iterator] = function*(){ for(var i = 0; i < this;)yield i++; } Array.from(10); // => [0, 1, 2, 3, 4, 5, 6, 7, 8, 9] 

 for(var num of 5)console.log(num); // => 0, 1, 2, 3, 4 

 var string = 'abc'; for(var val of string)console.log(val); // => 'a', 'b', 'c' var array = ['a', 'b', 'c']; for(var val of array)console.log(val); // => 'a', 'b', 'c'.    - .values for(var val of array.values())console.log(val); // => 'a', 'b', 'c' for(var key of array.keys())console.log(key); // => 0, 1, 2 for(var [key, val] of array.entries()){ console.log(key); // => 0, 1, 2 console.log(val); // => 'a', 'b', 'c' } var map = new Map([['a', 1], ['b', 2], ['c', 3]]); for(var [key, val] of map){ //    - .entries console.log(key); // => 'a', 'b', 'c' console.log(val); // => 1, 2, 3 } for(var val of map.values())console.log(val); // => 1, 2, 3 for(var key of map.keys())console.log(key); // => 'a', 'b', 'c' for(var [key, val] of map.entries()){ console.log(key); // => 'a', 'b', 'c' console.log(val); // => 1, 2, 3 } var set = new Set([1, 2, 3, 2, 1]); for(var val of set)console.log(val); // => 1, 2, 3.    - .values for(var val of set.values())console.log(val); // => 1, 2, 3 for(var key of set.keys())console.log(key); // => 1, 2, 3.  .keys  .values for(var [key, val] of set.entries()){ //  Set   .entries     console.log(key); // => 1, 2, 3 console.log(val); // => 1, 2, 3 } var list = (function(){return arguments})(1, 2, 3); for(var val of list)console.log(val); // => 1, 2, 3 

• वास्तविक फ़ायरफ़ॉक्स में एक पुनरावृत्ति को छोड़कर ये सभी पुनरावृत्तियाँ हैं arguments। चक्र काम करता है, लेकिन अपने स्वयं के अप्रचलित प्रोटोकॉल के आधार पर।
• V8 में, लूप for-of, क्रोम 38 से शुरू होकर, सही ढंग से काम करता है (सरणी के विनाश के अलावा) और सभी डेटा पुनरावृत्तियों को छोड़कर उपलब्ध हैं arguments। पुराने संस्करणों में (ध्वज के साथ) एक पुनरावृत्ति की उम्मीद की जाती थी, न कि एक पुनरावृत्त वस्तु।
• IE में, निश्चित रूप से, यह लूप अभी तक काम नहीं करता है और कोई पुनरावृत्तियों नहीं हैं।

 $for(new Set([1, 2, 3, 2, 1])).of(function(it){ console.log(it); // => 1, 2, 3 }); // 2  $for -  entries -    2  $for([1, 2, 3].entries(), true).of(function(key, value){ console.log(key); // => 0, 1, 2 console.log(value); // => 1, 2, 3 }); // 2  .of -    $for('abc').of(console.log, console); // => 'a', 'b', 'c' //    ,    false $for([1, 2, 3, 4, 5]).of(function(it){ console.log(it); // => 1, 2, 3 if(it == 3)return false; }); 

 var list = (function(){return arguments})(1, 2, 3); console.log($for.isIterable(list)); // => true console.log($for.isIterable({})); // => false var iter = $for.getIterator(list); console.log(iter.next()); // => {value: 1, done: false} console.log(iter.next()); // => {value: 2, done: false} console.log(iter.next()); // => {value: 3, done: false} console.log(iter.next()); // => {value: undefined, done: true} 

 [...new Set([1, 2, 3, 2, 1])]; // => [1, 2, 3] console.log(1, ...[2, 3, 4]); // => 1, 2, 3, 4 var map = new Map([[1, 'a'], [2, 'b']]); new Array(...map.keys(), 3); // => [1, 2, 3] 

 var ar1 = [for(i of [1, 2, 3])i * i]; // => [1, 4, 9] var set = new Set([1, 2, 3, 2, 1]); var ar2 = [for(i of set)if(i % 2)i * i]; // => [1, 9] var iter = (for(i of set)if(i % 2)i * i); iter.next(); // => {value: 1, done: false} iter.next(); // => {value: 9, done: false} iter.next(); // => {value: undefined, done: true} var map1 = new Map([['a', 1], ['b', 2], ['c', 3]]); var map2 = new Map((for([k, v] of map1)if(v % 2)[k + k, v * v])); // => Map {aa: 1, cc: 9} 

 var ar1 = $for([1, 2, 3]).array(function(v){ return v * v; }); // => [1, 4, 9] var set = new Set([1, 2, 3, 2, 1]); var ar1 = $for(set).filter(function(v){ return v % 2; }).array(function(v){ return v * v; }); // => [1, 9] var iter = $for(set).filter(function(v){ return v % 2; }).map(function(v){ return v * v; }); iter.next(); // => {value: 1, done: false} iter.next(); // => {value: 9, done: false} iter.next(); // => {value: undefined, done: true} var map1 = new Map([['a', 1], ['b', 2], ['c', 3]]); var map2 = new Map($for(map1, true).filter(function(k, v){ return v % 2; }).map(function(k, v){ return [k + k, v * v]; })); // => Map {aa: 1, cc: 9} 

# ECMAScript 6: वादे

 var log = console.log.bind(console); function sleepRandom(time){ return new Promise(function(resolve, reject){ // resolve   , reject -   //      setTimeout(resolve, time * 1e3, 0 | Math.random() * 1e3); }); } log(''); // =>  sleepRandom(5).then(function(result){ log(result); // => 869,  5 . return sleepRandom(10); }).then(function(result){ log(result); // => 202,  10 . }).then(function(){ log('  '); // =>    throw Error('!'); }).then(function(){ log('   - '); }).catch(log); // => Error: '!' 

 Promise.resolve(42).then(log); // => 42 Promise.reject(42).catch(log); // => 42 Promise.resolve($.getJSON('/data.json')); // => ES6 promise 

 Promise.all([ 'foo', sleepRandom(5), sleepRandom(15), sleepRandom(10) //  15   -  ]).then(log); // => ['foo', 956, 85, 382] 

 function timeLimit(promise, time){ return Promise.race([promise, new Promise(function(resolve, reject){ setTimeout(reject, time * 1e3, Error('Await > ' + time + ' sec')); })]); } timeLimit(sleepRandom(5), 10).then(log); // =>  5    853 timeLimit(sleepRandom(15), 10).catch(log); // Error: Await > 10 sec 

 var delay = time => new Promise(resolve => setTimeout(resolve, time)); async function sleepRandom(time){ await delay(time * 1e3); return 0 | Math.random() * 1e3; } async function sleepError(time, msg){ await delay(time * 1e3); throw Error(msg); } (async () => { try { log(''); // =>  log(await sleepRandom(5)); // => 936,  5 . var [a, b, c] = await Promise.all([ sleepRandom(5), sleepRandom(15), sleepRandom(10) ]); log(a, b, c); // => 210 445 71,  15 . await sleepError(5, '!'); log('  '); } catch(e){ log(e); // => Error: '!',  5 . } })(); 

# मोज़िला जावास्क्रिप्ट: ऐरे तरीकों के स्टेटिक संस्करण

 Array.prototype.slice.call(arguments, 1); //  [].slice.call(arguments, 1); 

 Array.from(arguments).slice(1); 

 Array.slice(arguments, 1); Array.join('abcdef', '+'); // => 'a+b+c+d+e+f' var form = document.getElementsByClassName('form__input'); Array.reduce(form, function(memo, it){ memo[it.name] = it.value; return memo; }, {}); // => , {name: '', age: '42', sex: 'yes, please'} 

# विलंबित निष्पादन: setTimeout, setInterval, setImmediate

# setTimeout, setInterval

 // : setTimeout(log.bind(null, 42), 1000); // : setTimeout(log, 1000, 42); 

# सेटिमिटेड

• Node.js के पुराने संस्करणों के लिए - process.nextTick
• आधुनिक ब्राउज़रों के लिए - postMessage
• WebWorkers के लिए - MessageChannel
• IE8 के लिए - script.onreadystatechange
• और अगर इन तरीकों ने मदद नहीं की - setTimeoutन्यूनतम देरी के साथ

 setImmediate(function(arg1, arg2){ console.log(arg1, arg2); // =>        }, '   ', '  '); clearImmediate(setImmediate(function(){ console.log('   '); })); 

# सांत्वना

 // : if(window.console && console.log)console.log(42); // : console.log(42); 

 // : setTimeout(console.log.bind(console, 42), 1000); [1, 2, 3].forEach(console.log, console); // : setTimeout(console.log, 1000, 42); [1, 2, 3].forEach(console.log); 

चूंकि कंसोल मानकीकृत नहीं है, इसलिए थोड़ा गैग जोड़ें:

 console.disable(); console.warn(' ,     .'); console.enable(); console.warn('  .'); 

# भाग दो: साइकिलें

शून्य विकल्प, कोई विकल्प नहीं।
मैं आधी दुनिया चाहता था - एक साइकिल के लिए पर्याप्त।
- नशे की लत

# डेटा वर्गीकरण

 Object.isObject = function(it){ return it != null && (typeof it == 'object' || typeof it == 'function'); } // ... typeof {}; // => 'object' typeof isNaN; // => 'function' typeof null; // => 'object' Object.isObject({}); // => true Object.isObject(isNaN); // => true Object.isObject(null); // => false 

 Object.prototype.toString.call(1).slice(8, -1); // => 'Number' Object.prototype.toString.call([]).slice(8, -1); // => 'Array' Object.prototype.toString.call(/./).slice(8, -1); // => 'RegExp' 

• पुराने IE में, यह लागू होता है null, undefinedऔर argumentsयह रिटर्न देता है "Object"। यह आसानी से अतिरिक्त जांच के साथ इलाज किया जाता है।
• ECMAScript 6, ? "Object" . Object#toString ECMAScript 6.

 var classof = Object.classof; classof(null); // => 'Null' classof(undefined); // => 'Undefined' classof(1); // => 'Number' classof(true); // => 'Boolean' classof('string'); // => 'String' classof(Symbol()); // => 'Symbol' classof(new Number(1)); // => 'Number' classof(new Boolean(true)); // => 'Boolean' classof(new String('string')); // => 'String' var fn = function(){} , list = (function(){return arguments})(1, 2, 3); classof({}); // => 'Object' classof(fn); // => 'Function' classof([]); // => 'Array' classof(list); // => 'Arguments' classof(/./); // => 'RegExp' classof(new TypeError); // => 'Error' classof(new Set); // => 'Set' classof(new Map); // => 'Map' classof(new WeakSet); // => 'WeakSet' classof(new WeakMap); // => 'WeakMap' classof(new Promise(fn)); // => 'Promise' classof([].values()); // => 'Array Iterator' classof(new Set().values()); // => 'Set Iterator' classof(new Map().values()); // => 'Map Iterator' classof(Math); // => 'Math' classof(JSON); // => 'JSON' function Example(){} Example.prototype[Symbol.toStringTag] = 'Example'; classof(new Example); // => 'Example' 

# शब्दकोश

• # समस्या: Object.prototypeऔर शब्दकोशों
• # कंस्ट्रक्टर Dict
• # एक प्रोटोटाइप के साथ एक शब्दकोश के साथ सुरक्षित काम के तरीके
• # एक शब्दकोश के साथ काम करने के तरीके
• # शब्दकोश चलना
• # संभावित संभावनाएं

# समस्या: Object.prototype और शब्दकोशों

 Object.prototype.constructor(); Object.prototype.hasOwnProperty(); Object.prototype.isPrototypeOf(); Object.prototype.propertyIsEnumerable(); Object.prototype.toLocaleString(); Object.prototype.toString(); Object.prototype.valueOf(); Object.prototype.__proto__; Object.prototype.__count__; Object.prototype.__parent__; Object.prototype.__noSuchMethod__; Object.prototype.__defineGetter__(); Object.prototype.__defineSetter__(); Object.prototype.__lookupGetter__(); Object.prototype.__lookupSetter__(); Object.prototype.eval(); Object.prototype.toSource(); Object.prototype.unwatch(); Object.prototype.watch(); 

 var phone = (function(){ var db = { '': '+7987654', '': '+7654321' }; return { has: function(name){ return name in db; }, get: function(name){ return db[name]; }, set: function(name, phone){ db[name] = phone; }, delete: function(name){ delete db[name]; } }; })(); 

 console.log(phone.has('')); // => true console.log(phone.get('')); // => '+7987654' console.log(phone.has('')); // => false console.log(phone.get('')); // => undefined console.log(phone.has('toString')); // => true console.log(phone.get('toString')); // => function toString() { [native code] } 

 // ... has: function(name){ return db.hasOwnProperty(name); }, get: function(name){ if(db.hasOwnProperty(name))return db[name]; }, // ... console.log(phone.get('')); // => '+7987654' phone.set('hasOwnProperty', '+7666666'); //   "" console.log(phone.get('')); // TypeError: string is not a function 

 // ... has: function(name){ return Object.prototype.hasOwnProperty.call(db, name); }, get: function(name){ if(Object.prototype.hasOwnProperty.call(db, name))return db[name]; }, // ... 

 phone.set('__proto__', '+7666666'); //   "" console.log(phone.get('__proto__')); // => undefined 

 // ... set: function(name, phone){ Object.defineProperty(db, name, { enumerable : true, configurable: true, writable : true, value : phone }); }, // ... 

 var phone = (function(){ var db = Object.create(null); Object.assign(db, { '': '+7987654', '': '+7654321' }); return { has: function(name){ return name in db; }, get: function(name){ return db[name]; }, set: function(name, phone){ db[name] = phone; }, delete: function(name){ delete db[name]; } }; })(); 

• उदाहरण के लिए +Object.create(null), या एक तार के लिए नंबर देना संभव नहीं होगा , '' + Object.create(null)-TypeError
• तदनुसार, वस्तु की तुलना एक समानता समानता एल्गोरिथ्म के साथ करना संभव नहीं होगा, उदाहरण के लिए ==, आदिम के साथ -TypeError

# कंस्ट्रक्टरDict

 function Dict(props){ var dict = Object.create(null); if(props != null){ if(Symbol.iterator in props){ for(var [key, val] of props)dict[key] = val; } else Object.assign(dict, props); } return dict; } Dict.prototype = null; Dict.isDict = function(it){ return Object.isObject(it) && Object.getPrototypeOf(it) === null; } // ... var map = new Map([['a', 1], ['b', 2], ['c', 3]]); Dict(); // => {__proto__: null} Dict({a: 1, b: 2, c: 3}); // => {__proto__: null, a: 1, b: 2, c: 3} Dict(map); // => {__proto__: null, a: 1, b: 2, c: 3} Dict([1, 2, 3].entries()); // => {__proto__: null, 0: 1, 1: 2, 2: 3} Dict((for([k, v] of map)if(v % 2)[k + k, v * v])); // => {__proto__: null, aa: 1, cc: 9} Dict.isDict({}); // => false Dict.isDict(Dict()); // => true 

# एक प्रोटोटाइप के साथ एक शब्दकोश के साथ सुरक्षित काम के तरीके

 var dict = {a: 1, b: 2, c: 3}; console.log(Dict.has(dict, 'a')); // => true console.log(Dict.has(dict, 'toString')); // => false console.log(Dict.get(dict, 'a')); // => 1 console.log(Dict.get(dict, 'toString')); // => undefined Dict.set(dict, '__proto__', 42); console.log(Dict.get(dict, '__proto__')); // => 42 

# एक शब्दकोश के साथ काम करने के तरीके

 var dict = {a: 1, b: 2, c: 3}; Dict.forEach(dict, console.log, console); // => 1, 'a', {a: 1, b: 2, c: 3} // => 2, 'b', {a: 1, b: 2, c: 3} // => 3, 'c', {a: 1, b: 2, c: 3} Dict.map(dict, function(it){ return it * it; }); // => {a: 1, b: 4, c: 9} Dict.filter(dict, function(it){ return it % 2; }); // => {a: 1, c: 3} Dict.some(dict, function(it){ return it === 2; }); // => true Dict.every(dict, function(it){ return it === 2; }); // => false Dict.find(dict, function(it){ return it > 2; }); // => 3 Dict.find(dict, function(it){ return it > 4; }); // => undefined Dict.findKey(dict, function(it){ return it > 2; }); // => 'c' Dict.findKey(dict, function(it){ return it > 4; }); // => undefined Dict.keyOf(dict, 2); // => 'b' Dict.keyOf(dict, 4); // => undefined Dict.includes(dict, 2); // => true Dict.includes(dict, 4); // => false Dict.reduce(dict, function(memo, it){ return memo + it; }); // => 6 Dict.reduce(dict, function(memo, it){ return memo + it; }, ''); // => '123' Dict.turn(dict, function(memo, it, key){ memo[key + key] = it; }); // => {aa: 1, bb: 2, cc: 3} Dict.turn(dict, function(memo, it, key){ it % 2 && memo.push(key + it); }, []); // => ['a1', 'c3'] 

# शब्दकोश चलना

 var dict = {a: 1, b: 2, c: 3}; console.log(Object.values(dict)); // => [1, 2, 3] console.log(Object.entries(dict)); // => [['a', 1], ['b', 2], ['c', 3]] for(var key of Dict.keys(dict))console.log(key); // => 'a', 'b', 'c' for(var [key, val] of Dict.entries(dict)){ console.log(key); // => 'a', 'b', 'c' console.log(val); // => 1, 2, 3 } $for(Dict.values(dict)).of(console.log); // => 1, 2, 3 new Map(Dict.entries(dict)); // => Map {a: 1, b: 2, c: 3} new Map((for([k, v] of Dict.entries(dict))if(v % 2)[k + k, v * v])); // => Map {aa: 1, cc: 9} 

# संभावित संभावनाएं

 function Dict(props){ if(!(this instanceof Dict))return new Dict(props); if(props != null){ if(Symbol.iterator in props){ for(var [key, val] of props)this[key] = val; } else Object.assign(this, props); } } Dict.prototype = Object.create(null); Dict.prototype[Symbol.toStringTag] = 'Dict'; Dict.prototype[Symbol.iterator] = function(){ return Dict.entries(this); }; 

• new Dict instanceof Dict ।
• for(var [key, value] of dict){...}, new Map(dict)के माध्यम से एक पुनरावृत्ति प्राप्त करने के लिए बिना Dict.entries।
• #Object.classof(new Dict) लौटेंगे 'Dict', नहीं 'Object'।

# आंशिक आवेदन

• # संदर्भ बंधन के बिना आंशिक आवेदन
• # मनमानी तर्कों का आंशिक उपयोग
• # ऑब्जेक्ट से निकालने की विधि
• # तर्कों की संख्या सीमित करें

# संदर्भ बंधन के बिना आंशिक आवेदन

 Array.prototype.compact = [].filter.bind(Array.prototype, function(val){ return val != null; }); [0, null, 1, undefined, 2].compact(); // => [] -     Array.prototype,     //    : Array.prototype.compact = function(){ return this.filter(function(val){ return val != null; }); }; [0, null, 1, undefined, 2].compact(); // => [0, 1, 2]; 

 Array.prototype.compact = [].filter.part(function(val){ return val != null; }); [0, null, 1, undefined, 2].compact(); // => [0, 1, 2]; var fn = console.log.part(1, 2); fn(3, 4); // => 1, 2, 3, 4 

# मनमानी तर्कों का आंशिक उपयोग

 function fn1(a, c){ console.log(a, 2, c, 4); }; fn1(1, 3); // => 1, 2, 3, 4 function fn2(b, c){ console.log(1, b, c, 4); }; fn2(2, 3); // => 1, 2, 3, 4 

 var fn1 = console.log.part(_, 2, _, 4); fn1(1, 3); // => 1, 2, 3, 4 var fn2 = console.log.part(1, _, _, 4); fn2(2, 3); // => 1, 2, 3, 4 fn1(1, 3, 5); // => 1, 2, 3, 4, 5 fn1(1); // => 1, 2, undefined, 4 

 var fn = console.log.by(console, _, 2, _, 4); fn(1, 3, 5); // => 1, 2, 3, 4, 5 

# ऑब्जेक्ट से निकालने की विधि

 ['foobar', 'foobaz', 'barbaz'].filter(/bar/[_]('test')); // => ['foobar', 'barbaz'] var has = {}.hasOwnProperty[_]('call'); console.log(has({key: 42}, 'foo')); // => false console.log(has({key: 42}, 'key')); // => true var array = [] , push = array[_]('push'); push(1); push(2, 3); console.log(array); // => [1, 2, 3]; 

 var _ = Symbol(); Object.defineProperty(Object.prototype, _, { get: function(){ return new Proxy(this, { apply: function(){ /*    [_]    */ }, get: function(context, name){ return context[name].bind(context); } }); } }); ['foobar', 'foobaz', 'barbaz'].filter(/bar/[_].test); // => ['foobar', 'barbaz'] var has = {}.hasOwnProperty[_].call; console.log(has({key: 42}, 'foo')); // => false console.log(has({key: 42}, 'key')); // => true var array = [] , push = array[_].push; push(1); push(2, 3); console.log(array); // => [1, 2, 3]; 

# तर्कों की संख्या सीमित करें

 [1, 2, 3].forEach(console.log); // => 1 0 [1, 2, 3] // => 2 1 [1, 2, 3] // => 3 2 [1, 2, 3] 

 [1, 2, 3].forEach(function(it){ console.log(it); }); // => 1, 2, 3 

 [1, 2, 3].forEach(console.log.only(1)); // => 1, 2, 3 

# दिनांक स्वरूपण

 var date = new Date; function lz2(it){ return it > 9 ? it : '0' + it; } var format = [date.getDate(), date.getMonth() + 1, date.getFullYear()].map(lz2).join('.') + ' ' + [date.getHours(), date.getMinutes(), date.getSeconds()].map(lz2).join(':'); console.log(format); // => '18.11.2014 06:07:25 ' 

 new Date().toLocaleString('ru-RU', { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric', hour: 'numeric', minute: '2-digit', second: '2-digit' }); // => ', 18  2014 ., 6:07:25' 

# सरल दिनांक स्वरूपण जोड़ें।

 new Date().format('W, D MM Y ., h:mm:ss', 'ru'); // => ', 18  2014 ., 6:07:25' new Date().formatUTC('W, D MM Y ., h:mm:ss', 'ru'); // => ', 18  2014 ., 0:07:25' 

 s |  | 0-59 ss | , 2  | 00-59 m |  | 0-59 mm | , 2  | 00-59 h |  | 0-23 hh | , 2  | 00-23 D |  | 1-31 DD | , 2  | 01-31 W |  ,  |  N |  | 1-12 NN | , 2  | 01-12 M | ,  |  MM | ,  |  Y | ,  | 2014 YY | , 2  | 14 

 new Date().format('W, D MM Y', 'ru'); // => ', 18  2014' new Date().format('W, D MM Y'); // => 'Tuesday, 18 November 2014' core.locale('ru'); new Date().format('W, D MM Y'); // => ', 18  2014' 

 (typeof core != 'undefined' ? core : require('core-js/library')).addLocale('ru', { weekdays: ',,,,,,', months: ':|,:|,:|,:|,:|,:|,:|,:|,:|,:|,:|,:|' }); 

 new Date().format('DD.NN.YY'); // => '18.11.14' new Date().format('hh:mm:ss'); // => '06:07:25' new Date().format('DD.NN.Y hh:mm:ss'); // => '18.11.2014 06:07:25' new Date().format('W, D MM Y '); // => ', 18  2014 ' new Date().format('D MM, h:mm'); // => '18 , 6:07' new Date().format('M Y'); // => ' 2014' 

# ऑब्जेक्ट एपीआई

 // : Object.defineProperty(target, 'c', { enumerable: true, configurable: true, get: function(){ return this.a + this.b; } }); // : Object.define(target, { get c(){ return this.a + this.b; } }); 

 //        : var copy = Object.make(Object.getPrototypeOf(src), src); //   : function Vector2D(x, y){ this.x = x; this.y = y; } Object.define(Vector2D.prototype, { get xy(){ return Math.hypot(this.x, this.y); } }); function Vector3D(x, y, z){ Vector2D.apply(this, arguments); this.z = z; } Vector3D.prototype = Object.make(Vector2D.prototype, { constructor: Vector3D, get xyz(){ return Math.hypot(this.x, this.y, this.z); } }); var vector = new Vector3D(9, 12, 20); console.log(vector.xy); // => 15 console.log(vector.xyz); // => 25 vector.y++; console.log(vector.xy); // => 15.811388300841896 console.log(vector.xyz); // => 25.495097567963924 

# अर्रे

 [1, 2, 3].includes(2); // => true [1, 2, 3].includes(4); // => false [1, 2, 3].includes(2, 2); // => false [NaN].indexOf(NaN); // => -1 [NaN].includes(NaN); // => true Array(1).indexOf(undefined); // => -1 Array(1).includes(undefined); // => true 

 //   : [1, 2, 3, 4, 5].reduce(function(memo, it){ memo['key' + it] = !!(it % 2); return memo; }, {}); // => {key1: true, key2: false, key3: true, key4: false, key5: true} [1, 2, 3, 4, 5].turn(function(memo, it){ memo['key' + it] = !!(it % 2); }, {}); // => {key1: true, key2: false, key3: true, key4: false, key5: true} // filter + map + slice,   : [1, 2, 3, 4, 5, 6, 7, 8, 9].map(function(it){ return it * it; }).filter(function(it){ return it % 2; }).slice(0, 2); // => [1, 9] [1, 2, 3, 4, 5, 6, 7, 8, 9].turn(function(memo, it){ it % 2 && memo.push(it * it); if(memo.length == 2)return false; }); // => [1, 9] 

# नंबर

 //  : for(var i = 0; i < 3; i++)console.log(i); // => 0, 1, 2 // for-of   : for(var i of 3)console.log(i); // => 0, 1, 2 //   for-of, : $for(3).of(console.log); // => 0, 1, 2 //    : // .map  ""   Array(10).map(Math.random); // => [undefined × 10] // ES5 ,   : Array.apply(undefined, Array(10)).map(Math.random); // => [0.9442228835541755, 0.8101077508181334, ...] // ES6 ,   : Array(10).fill(undefined).map(Math.random); // => [0.5587614295072854, 0.009569905698299408, ...] // Number Iterator: Array.from(10, Math.random); // => [0.9817775336559862, 0.02720663254149258, ...] Array.from(10); // => [0, 1, 2, 3, 4, 5, 6, 7, 8, 9] Array.from(10, function(it){ return this + it * it; }, .42); // => [0.42, 1.42, 4.42, 9.42, 16.42, 25.42, 36.42, 49.42, 64.42, 81.42] // Comprehensions: [for(i of 10)if(i % 2)i * i]; // => [1, 9, 25, 49, 81] Dict((for(i of 3)['key' + i, !(i % 2)])); // => {key0: true, key1: false, key2: true} $for(10).filter(function(i){ return i % 2; }).array(function(i){ return i * i; }); // => [1, 9, 25, 49, 81] Dict($for(3).map(function(i){ return ['key' + i, !(i % 2)]; })); // => {key0: true, key1: false, key2: true} 

 3..pow(3); // => 27 (-729).abs().sqrt(); // => 27 10..random(20); // =>   (10, 20), , 16.818793776910752 10..random(20).floor(); // =>   [10, 19], , 16 var array = [1, 2, 3, 4, 5]; array[array.length.random().floor()]; // =>   , , 4 

# विशेष पात्रों से बचना

 '<script>doSomething();</script>'.escapeHTML(); // => '&lt;script&gt;doSomething();&lt;/script&gt;' '&lt;script&gt;doSomething();&lt;/script&gt;'.unescapeHTML(); // => '<script>doSomething();</script>' 

 RegExp.escape(' -[]{}()*+?.,\\^$|'); // => ' \-\[\]\{\}\(\)\*\+\?\.\,\\\^\$\|' 

# निष्कर्ष