ورقة غش JavaScript سريعة وعملية من Toptal: ES6 وما بعدها

الثوابت

دعونا مقابل فار

> const أويلر = 2.7182818284
> أويلر = 13
> أويلر
> 2.7182818284

> متوسط ​​var = 5
> متوسط ​​var = (متوسط ​​+ 1) / 2
> متوسط
> 3
> دعونا القيمة = "مرحبا بالعالم"
> دع القيمة = "ما الجديد"
// -> يطرح TypeError: تم بالفعل التصريح عن "قيمة" المعرف

تحذير! إذا كانت مصفوفة أو كائن ، فإن المرجع يبقى ثابتًا . إذا كان الثابت هو مرجع إلى كائن ، فلا يزال بإمكانك تعديل المحتوى ، ولكن لا يمكنك تغيير المتغير مطلقًا.

> CONSTANTS = []
> CONSTANTS.push (أويلر)
> الثوابت
> [2.7182818284]
> الثوابت = {'أويلر': 2.7182818284}
> الثوابت
> [2.7182818284]

كن على علم بالمناطق الميتة الزمنية :

> console.log (val) // -> 'undefined'
> فار فال = 3
> console.log (val) // -> 3

لأنها تعادل:

تدوين ثنائي وثنائي وسداسي

> فار فال
> console.log (val)
> فال = 3
> console.log (val)

> 0b1001011101 // 605
> 0o6745 // 3557
> 0x2f50a // 193802

لا يتم رفع المتغيرات التي تم الإعلان عنها باستخدام "let / const":

أنواع جديدة

> console.log (val)
// -> يلقي خطأ ReferenceError
> دع فال = 3
> console.log (val) // -> 3

الرموز والخرائط والخرائط والضعف والمجموعات

دالة السهم

وظائف جديدة محددة النطاق

> setTimeout (() => {
... console.log ("متأخر")
…} ، 1000)

> {
... دعونا جديلة = "لوقا ، أنا والدك"
... console.log (جديلة)
…}
> "لوقا ، أنا والدك"

ما يعادل وظيفة مجهولة

مكافئ بتعبيرات وظيفية تم استدعاؤها فورًا (IIFE)

> setTimeout (الوظيفة () {
... console.log ("متأخر")
…} .bind (this) ، 1000)

> (وظيفة () {
... var cue = 'Luke، I am your father' ... console.log (cue) // 'Luke، I am -
…} ())
> console.log (جديلة) // خطأ مرجعي

طرافات تدوين الكائن

String Interpolation ، وذلك بفضل Template Literals

// الخصائص المحسوبة
> let key = new Date (). getTime ()
> دع obj = {[مفتاح]: "القيمة"}
> الهدف
> {'1459958882881': 'القيمة'}

// الكائن الحرفي
بالون = {اللون ، الحجم} ؛

// مثل
بالون = {
اللون: اللون ،
الحجم: الحجم

}

// تدوين طريقة أفضل
obj = {
foo (أ ، ب) {…} ،
شريط (س ، ص) {…}
}

> اسم const = "Tiger"
> عمر ثابت = 13
> console.log (`اسم قطتي $ {name} ويبلغ عمرها $ {age} سنة .`)
> قطتي تدعى Tiger وهي تبلغ من العمر 13 سنة.

// يمكننا الحفاظ على الأسطر الجديدة ...
دع النص = (`قطة
كلب
نيكلوديون
)

المعلمات الافتراضية

> تعمل howAreYou (answer = 'ok') {
console.log (إجابة) // ربما "موافق"
}

وعود

الطبقات ، الميراث ، الرهبان ، الحاصلون

وعد جديد ((حل ، رفض) => {
request.get (url، (error، response،
الجسم) => {
إذا (الجسم) {
حل (JSON.parse (جسم)) ؛
} آخر {
حل({})؛
}
})
}). ثم (() => {...})
.catch ((يخطئ) => رمي يخطئ)

// الموازية المهام
الوعد. all ([
الوعد 1 ، الوعد 2 ، الوعد 3
]). ثم (() => {
// تم الانتهاء من جميع المهام
})

فئة مستطيل يمتد الشكل {
المُنشئ (المعرف ، x ، y ، w ، h) {
سوبر (معرف ، س ، ص)
this.width = w
هذا الارتفاع = ح
}
// Getter and setter
ضبط العرض (ث) {this._width = w}
الحصول على العرض () {return this._width}
}

فئة الدائرة يمتد الشكل {
المُنشئ (المعرف ، x ، y ، نصف القطر) {
سوبر (معرف ، س ، ص)
this.radius = نصف القطر
}
do_a (x) {
دع أ = 12 ؛
super.do_a (س + أ) ؛
}
do_b ثابت () {...}
}
Circle.do_b ()

تدمير المصفوفات

تدمير الكائنات

> دع [أ ، ب ، ج ، د] = [1 ، 2 ، 3 ، 4] ؛
> console.log (أ) ؛
> 1
> ب
> 2

> لوقا = {الاحتلال: 'جيد' ،
الأب: 'anakin'}
> دع {الاحتلال ، الأب} = لوك
> console.log (المهنة ، الأب)
> جدي أناكين

عامل انتشار

... اذهب للتدمير مثل الزعيم

// تحويل المصفوفات إلى فاصلة مفصولة
// القيم والمزيد
> مسجل الوظيفة (... args) {
console.log ('٪ s وسيطات'،
أرجس الطول)
args.forEach (console.log)
// arg [0]، arg [1]، arg [2]
}

> كونست [قطة ، كلب ، ... سمك] = [
"شرودينغر" ، "لايكا" ، "نيمو" ، "دوري"]
> أسماك // -> ['Nemo'، 'Dori']

أو قم بعمل دفعة أفضل

... والدمار في المستقبل ES7

> اسمحوا arr = [1، 2، 3]
> [... arr، 4، 5، 6]
> [1 ، 2 ، 3 ، 4 ، 5 ، 6]

{أ ، ب ، ... الراحة} = {أ: 1 ، ب: 2 ، ج: 3 ، د: 4}

غير متزامن ES7

انتظر ES7

وظيفة غير متزامنة schrodinger () {
إعادة الوعد الجديد ((حل ، رفض)
=> {
نتيجة const = Math.random> 0.5
setTimeout (() => {
نتيجة العودة؟ حل ("على قيد الحياة")
: رفض ("ميت")
})
})
}

يحاول {
console.log (في انتظار schrodinger ())
// -> "على قيد الحياة"
} catch (يخطئ) {
console.log (يخطئ)
// -> "ميت"
}

تصدير ES7

استيراد ES7

دالة التصدير sumTwo (أ ، ب) {
إرجاع أ + ب ؛
}
تصدير const EULER = 2.7182818284
السماح للأشياء = {sumTwo، EULER}
تصدير {أشياء كإعداد افتراضي}

استيراد رد من "رد فعل"
استيراد {EULER} من "./myexports"
استيراد * كمواد من "./myexports"
// أي ما يعادل
استيراد أشياء من "./myexports"
// {sumTwo، EULER}

مولدات كهرباء

يقومون بإرجاع كائنات تقوم بتنفيذ بروتوكول التكرار. أي أنه يحتوي على طريقة () تالية تُرجع {القيمة: <بعض القيمة> ، تم: <صواب أو خطأ>} .

function * incRand (max) {// تُعرِّف العلامة النجمية هذا بأنه منشئ
احيانا صحيح) {
// وقفة التنفيذ بعد العائد ، استئناف
// عندما يتم استدعاء (<something>) التالي
// وإسناد <something> إلى x
اسمحوا x = العائد Math.floor (Math.random () * max + 1) ؛
ماكس + = س ؛
}
}

> var rng = incRand (2) // إرجاع كائن منشئ
> rng.next () // {القيمة: <بين 1 و 2> ، تم: خطأ}
> rng.next (3) // على النحو الوارد أعلاه ، ولكن بين 1 و 5
> rng.next () // NaN منذ 5 + نتائج غير محددة في NaN
> rng.next (20) // لا أحد يتوقع NaN مرة أخرى؟
> rng.throw (خطأ جديد ("حالة منشئ غير قابل للاسترداد."))
// سيُرمى من الغلة