es6features
1.0.0
ECMAScript 6، المعروف أيضًا باسم ECMAScript 2015، هو أحدث إصدار من معيار ECMAScript. يعد ES6 تحديثًا مهمًا للغة، وأول تحديث للغة منذ توحيد ES5 في عام 2009. ويجري الآن تنفيذ هذه الميزات في محركات JavaScript الرئيسية.
راجع معيار ES6 للحصول على المواصفات الكاملة للغة ECMAScript 6.
يتضمن ES6 الميزات الجديدة التالية:
الأسهم هي اختصار دالة تستخدم بناء الجملة => . وهي تشبه من الناحية التركيبية الميزات ذات الصلة في C# وJava 8 وCoffeeScript. إنها تدعم كلاً من أجسام كتلة البيان بالإضافة إلى أجسام التعبير التي تُرجع قيمة التعبير. على عكس الوظائف، تشترك الأسهم في نفس this مثل الكود المحيط بها.
// Expression bodies
var odds = evens . map ( v => v + 1 ) ;
var nums = evens . map ( ( v , i ) => v + i ) ;
var pairs = evens . map ( v => ( { even : v , odd : v + 1 } ) ) ;
// Statement bodies
nums . forEach ( v => {
if ( v % 5 === 0 )
fives . push ( v ) ;
} ) ;
// Lexical this
var bob = {
_name : "Bob" ,
_friends : [ ] ,
printFriends ( ) {
this . _friends . forEach ( f =>
console . log ( this . _name + " knows " + f ) ) ;
}
}مزيد من المعلومات: وظائف سهم MDN
فئات ES6 عبارة عن سكر بسيط فوق نمط OO القائم على النموذج الأولي. إن وجود نموذج تعريفي واحد مناسب يجعل استخدام أنماط الفصل أسهل، ويشجع إمكانية التشغيل البيني. تدعم الفئات الميراث القائم على النموذج الأولي، والمكالمات الفائقة، والمثيلات، والأساليب الثابتة والمنشئات.
class SkinnedMesh extends THREE . Mesh {
constructor ( geometry , materials ) {
super ( geometry , materials ) ;
this . idMatrix = SkinnedMesh . defaultMatrix ( ) ;
this . bones = [ ] ;
this . boneMatrices = [ ] ;
//...
}
update ( camera ) {
//...
super . update ( ) ;
}
get boneCount ( ) {
return this . bones . length ;
}
set matrixType ( matrixType ) {
this . idMatrix = SkinnedMesh [ matrixType ] ( ) ;
}
static defaultMatrix ( ) {
return new THREE . Matrix4 ( ) ;
}
}مزيد من المعلومات: فئات MDN
يتم توسيع القيم الحرفية للكائن لدعم إعداد النموذج الأولي عند الإنشاء، وهو اختصار لـ foo: foo ، وتحديد الأساليب، وإجراء الاستدعاءات الفائقة، وحوسبة أسماء الخصائص بالتعبيرات. معًا، تعمل هذه أيضًا على تقريب القيم الحرفية للكائنات وإعلانات الفئات من بعضها البعض، وتسمح للتصميم المبني على الكائنات بالاستفادة من بعض وسائل الراحة نفسها.
var obj = {
// __proto__
__proto__ : theProtoObj ,
// Shorthand for ‘handler: handler’
handler ,
// Methods
toString ( ) {
// Super calls
return "d " + super . toString ( ) ;
} ,
// Computed (dynamic) property names
[ 'prop_' + ( ( ) => 42 ) ( ) ] : 42
} ;مزيد من المعلومات: قواعد MDN وأنواعها: الكائنات الحرفية
توفر سلاسل القالب السكر النحوي لبناء السلاسل. وهذا مشابه لميزات استيفاء السلسلة في Perl وPython والمزيد. اختياريًا، يمكن إضافة علامة للسماح بتخصيص بناء السلسلة، وتجنب هجمات الحقن أو إنشاء هياكل بيانات ذات مستوى أعلى من محتويات السلسلة.
// Basic literal string creation
`In JavaScript 'n' is a line-feed.`
// Multiline strings
`In JavaScript this is
not legal.`
// String interpolation
var name = "Bob" , time = "today" ;
`Hello ${ name } , how are you ${ time } ?`
// Construct an HTTP request prefix is used to interpret the replacements and construction
POST `http://foo.org/bar?a= ${ a } &b= ${ b }
Content-Type: application/json
X-Credentials: ${ credentials }
{ "foo": ${ foo } ,
"bar": ${ bar } }` ( myOnReadyStateChangeHandler ) ;مزيد من المعلومات: سلاسل قالب MDN
يسمح التدمير بالربط باستخدام مطابقة الأنماط، مع دعم مطابقة المصفوفات والكائنات. تعتبر عملية التدمير سهلة الفشل، تشبه عملية البحث القياسية عن الكائنات foo["bar"] ، مما يؤدي إلى إنتاج قيم undefined عند عدم العثور عليها.
// list matching
var [ a , , b ] = [ 1 , 2 , 3 ] ;
// object matching
var { op : a , lhs : { op : b } , rhs : c }
= getASTNode ( )
// object matching shorthand
// binds `op`, `lhs` and `rhs` in scope
var { op , lhs , rhs } = getASTNode ( )
// Can be used in parameter position
function g ( { name : x } ) {
console . log ( x ) ;
}
g ( { name : 5 } )
// Fail-soft destructuring
var [ a ] = [ ] ;
a === undefined ;
// Fail-soft destructuring with defaults
var [ a = 1 ] = [ ] ;
a === 1 ;مزيد من المعلومات: مهمة تدمير MDN
قيم المعلمات الافتراضية التي تم تقييمها من قبل المستدعي. تحويل صفيف إلى وسائط متتالية في استدعاء دالة. ربط المعلمات الزائدة بمصفوفة. تحل الراحة محل الحاجة إلى arguments وتعالج الحالات الشائعة بشكل مباشر أكثر.
function f ( x , y = 12 ) {
// y is 12 if not passed (or passed as undefined)
return x + y ;
}
f ( 3 ) == 15 function f ( x , ... y ) {
// y is an Array
return x * y . length ;
}
f ( 3 , "hello" , true ) == 6 function f ( x , y , z ) {
return x + y + z ;
}
// Pass each elem of array as argument
f ( ... [ 1 , 2 , 3 ] ) == 6المزيد من معلومات MDN: المعلمات الافتراضية، ومعلمات الراحة، وعامل الانتشار
بنيات الربط على نطاق الكتلة. let هو var الجديد. const هي مهمة واحدة. تمنع القيود الثابتة الاستخدام قبل التعيين.
function f ( ) {
{
let x ;
{
// okay, block scoped name
const x = "sneaky" ;
// error, const
x = "foo" ;
}
// error, already declared in block
let x = "inner" ;
}
}المزيد من معلومات MDN: بيان Let، بيان const
تعمل كائنات التكرار على تمكين التكرار المخصص مثل CLR IEnumerable أو Java Iterable. تعميم for..in على التكرار المخصص المستند إلى المكرر باستخدام for..of . لا تحتاج إلى تحقيق مصفوفة، مما يتيح أنماط التصميم البطيئة مثل LINQ.
let fibonacci = {
[ Symbol . iterator ] ( ) {
let pre = 0 , cur = 1 ;
return {
next ( ) {
[ pre , cur ] = [ cur , pre + cur ] ;
return { done : false , value : cur }
}
}
}
}
for ( var n of fibonacci ) {
// truncate the sequence at 1000
if ( n > 1000 )
break ;
console . log ( n ) ;
}يعتمد التكرار على هذه الواجهات المكتوبة على شكل بطة (باستخدام بناء جملة نوع TypeScript للعرض فقط):
interface IteratorResult {
done : boolean ;
value : any ;
}
interface Iterator {
next ( ) : IteratorResult ;
}
interface Iterable {
[ Symbol . iterator ] ( ) : Iterator
}مزيد من المعلومات: MDN لـ...
تعمل المولدات على تبسيط تأليف المكرر باستخدام function* yield . دالة تم تعريفها كدالة* تُرجع مثيل المولد. المولدات هي أنواع فرعية من التكرارات التي تتضمن next throw . تعمل هذه على تمكين القيم من التدفق مرة أخرى إلى المولد، لذا yield هو نموذج تعبير يُرجع قيمة (أو يرمي).
ملحوظة: يمكن استخدامها أيضًا لتمكين البرمجة غير المتزامنة الشبيهة بـ "الانتظار"، راجع أيضًا اقتراح await ES7.
var fibonacci = {
[ Symbol . iterator ] : function * ( ) {
var pre = 0 , cur = 1 ;
for ( ; ; ) {
var temp = pre ;
pre = cur ;
cur += temp ;
yield cur ;
}
}
}
for ( var n of fibonacci ) {
// truncate the sequence at 1000
if ( n > 1000 )
break ;
console . log ( n ) ;
}واجهة المولد هي (باستخدام بناء جملة نوع TypeScript للعرض فقط):
interface Generator extends Iterator {
next ( value ?: any ) : IteratorResult ;
throw ( exception : any ) ;
}مزيد من المعلومات: بروتوكولات تكرار MDN
إضافات غير منقسمة لدعم Unicode الكامل، بما في ذلك النموذج الحرفي Unicode الجديد في السلاسل ووضع RegExp u الجديد للتعامل مع نقاط التعليمات البرمجية، بالإضافة إلى واجهات برمجة التطبيقات الجديدة لمعالجة السلاسل على مستوى نقاط التعليمات البرمجية 21 بت. تدعم هذه الإضافات إنشاء تطبيقات عالمية في JavaScript.
// same as ES5.1
"?" . length == 2
// new RegExp behaviour, opt-in ‘u’
"?" . match ( / . / u ) [ 0 ] . length == 2
// new form
"u{20BB7}" == "?" == "uD842uDFB7"
// new String ops
"?" . codePointAt ( 0 ) == 0x20BB7
// for-of iterates code points
for ( var c of "?" ) {
console . log ( c ) ;
}مزيد من المعلومات: MDN RegExp.prototype.unicode
دعم على مستوى اللغة للوحدات النمطية لتعريف المكونات. يقنن الأنماط من محمل وحدات JavaScript الشائعة (AMD، CommonJS). سلوك وقت التشغيل المحدد بواسطة المُحمل الافتراضي المحدد من قبل المضيف. نموذج غير متزامن ضمنيًا - لا يتم تنفيذ أي تعليمات برمجية حتى تتوفر الوحدات المطلوبة ومعالجتها.
// lib/math.js
export function sum ( x , y ) {
return x + y ;
}
export var pi = 3.141593 ; // app.js
import * as math from "lib/math" ;
alert ( "2π = " + math . sum ( math . pi , math . pi ) ) ; // otherApp.js
import { sum , pi } from "lib/math" ;
alert ( "2π = " + sum ( pi , pi ) ) ; تتضمن بعض الميزات الإضافية export default export * :
// lib/mathplusplus.js
export * from "lib/math" ;
export var e = 2.71828182846 ;
export default function ( x ) {
return Math . log ( x ) ;
} // app.js
import ln , { pi , e } from "lib/mathplusplus" ;
alert ( "2π = " + ln ( e ) * pi * 2 ) ;المزيد من معلومات MDN: بيان الاستيراد، بيان التصدير
دعم محمل الوحدة:
يمكن تكوين مُحمل الوحدة الافتراضية، ويمكن إنشاء مُحملات جديدة لتقييم وتحميل التعليمات البرمجية في سياقات معزولة أو مقيدة.
// Dynamic loading – ‘System’ is default loader
System . import ( 'lib/math' ) . then ( function ( m ) {
alert ( "2π = " + m . sum ( m . pi , m . pi ) ) ;
} ) ;
// Create execution sandboxes – new Loaders
var loader = new Loader ( {
global : fixup ( window ) // replace ‘console.log’
} ) ;
loader . eval ( "console.log('hello world!');" ) ;
// Directly manipulate module cache
System . get ( 'jquery' ) ;
System . set ( 'jquery' , Module ( { $ : $ } ) ) ; // WARNING: not yet finalizedهياكل بيانات فعالة للخوارزميات الشائعة. توفر WeakMaps جداول جانبية خالية من التسرب ومفاتيح الكائنات.
// Sets
var s = new Set ( ) ;
s . add ( "hello" ) . add ( "goodbye" ) . add ( "hello" ) ;
s . size === 2 ;
s . has ( "hello" ) === true ;
// Maps
var m = new Map ( ) ;
m . set ( "hello" , 42 ) ;
m . set ( s , 34 ) ;
m . get ( s ) == 34 ;
// Weak Maps
var wm = new WeakMap ( ) ;
wm . set ( s , { extra : 42 } ) ;
wm . size === undefined
// Weak Sets
var ws = new WeakSet ( ) ;
ws . add ( { data : 42 } ) ;
// Because the added object has no other references, it will not be held in the setالمزيد من معلومات MDN: Map، Set، WeakMap، WeakSet
تتيح الوكلاء إنشاء كائنات بنطاق كامل من السلوكيات المتاحة لاستضافة الكائنات. يمكن استخدامه للاعتراض، والمحاكاة الافتراضية للكائن، والتسجيل/التوصيف، وما إلى ذلك.
// Proxying a normal object
var target = { } ;
var handler = {
get : function ( receiver , name ) {
return `Hello, ${ name } !` ;
}
} ;
var p = new Proxy ( target , handler ) ;
p . world === 'Hello, world!' ; // Proxying a function object
var target = function ( ) { return 'I am the target' ; } ;
var handler = {
apply : function ( receiver , ... args ) {
return 'I am the proxy' ;
}
} ;
var p = new Proxy ( target , handler ) ;
p ( ) === 'I am the proxy' ;هناك مصائد متاحة لجميع العمليات الوصفية على مستوى وقت التشغيل:
var handler =
{
get :... ,
set :... ,
has :... ,
deleteProperty :... ,
apply :... ,
construct :... ,
getOwnPropertyDescriptor :... ,
defineProperty :... ,
getPrototypeOf :... ,
setPrototypeOf :... ,
enumerate :... ,
ownKeys :... ,
preventExtensions :... ,
isExtensible :...
}مزيد من المعلومات: وكيل MDN
تتيح الرموز التحكم في الوصول لحالة الكائن. تسمح الرموز بمفتاح الخصائص إما عن طريق string (كما في ES5) أو symbol . الرموز هي نوع بدائي جديد. معلمة description الاختيارية المستخدمة في تصحيح الأخطاء - ولكنها ليست جزءًا من الهوية. الرموز فريدة من نوعها (مثل gensym)، ولكنها ليست خاصة حيث يتم كشفها عبر ميزات الانعكاس مثل Object.getOwnPropertySymbols .
var MyClass = ( function ( ) {
// module scoped symbol
var key = Symbol ( "key" ) ;
function MyClass ( privateData ) {
this [ key ] = privateData ;
}
MyClass . prototype = {
doStuff : function ( ) {
... this [ key ] . . .
}
} ;
return MyClass ;
} ) ( ) ;
var c = new MyClass ( "hello" )
c [ "key" ] === undefinedمزيد من المعلومات: رمز MDN
في ES6، يمكن تصنيف العناصر المضمنة مثل Array و Date وDOM Element إلى فئات فرعية.
يستخدم الآن إنشاء الكائن لوظيفة تسمى Ctor مرحلتين (كلاهما يتم إرسالهما فعليًا):
Ctor[@@create] لتخصيص الكائن، وتثبيت أي سلوك خاص الرمز @@create المعروف متاح عبر Symbol.create . تعرض العناصر المضمنة الآن @@create بشكل صريح.
// Pseudo-code of Array
class Array {
constructor ( ... args ) { /* ... */ }
static [ Symbol . create ] ( ) {
// Install special [[DefineOwnProperty]]
// to magically update 'length'
}
}
// User code of Array subclass
class MyArray extends Array {
constructor ( ... args ) { super ( ... args ) ; }
}
// Two-phase 'new':
// 1) Call @@create to allocate object
// 2) Invoke constructor on new instance
var arr = new MyArray ( ) ;
arr [ 1 ] = 12 ;
arr . length == 2العديد من إضافات المكتبات الجديدة، بما في ذلك مكتبات الرياضيات الأساسية، ومساعدات تحويل المصفوفات، ومساعدات السلسلة، وObject.sign للنسخ.
