از کمیته TC39 چه خبر؟

تو این مقاله قراره خیلی خلاصه و کوتاه با ecma و آخرین دستاوردهای کمیته TC39 آشنا بشیم

اکما یک سازمان سوئیسی هست که کار اون تعریف کردن استانداردهای بین‌المللی است و سازندگان جاوااسکریپت این زبان رو برای استانداردسازی به این سازمان ارائه دادن و اسم این استاندارد رو ECMA-262 گذاشته شد که ما با نام مستعار ECMAScript می‌شناسیم و به صورت خلاصه به اون ES گفته میشه، پس اکمااسکریپت یک استاندارد است و شامل یک سری ویژگی‌ها و مشخصات هست که زبانی مثل جاوااسکریپت نسخه‌ی پیاده‌سازی شده و عینی این استاندارد و ویژگی‌ها هست، البته زبان‌های دیگه‌ای مثل اکشن‌اسکریپت و جی‌اسکریپت هم طبق این استاندارد پیاده‌سازی شدن اما جاوااسکریپت معروف‌ترین زبانی هست که این استاندارد رو پیاده‌سازی کرده.

جالبه بدونید یک زبان می‌تونه در کنار استانداردها و ویژگی‌های اکمااسکریپت، ویژگی‌های منحصر به فرد خودش رو هم داشته باشه. مثلاً توی جاوااسکریپت و نسخه‌ای که توی مرورگرها در دسترس هست، ما یک تابع داریم به اسم alert این تابع در استاندارد اکمااسکریپت وجود نداره و بقیه نسخه‌ها مجبور به پیاده‌سازی اون نیستن برای همین در محیطی مثل نود این تابع در دسترس نیست.

کمیته TC39 از زیر مجموعه سازمان بین المللی ECMA هست که بر به روزرسانی ها و تغییراتی که در سازمان اعمال می شود نظارت می کند. وقتی پیشنهادی برای به روزرسانی جدید به ECMA ارسال می شود، باید مراحل مختلف زیر را طی کند و در این کمیته افرادی از شرکتهایی مثل مازیلا، گوگل، اپل، فیسبوک و ... حضور دارند.

حالا که با ecma و tc39 آشنا شدیم در ادامه با هم بعضی از متدهای جدید جاوااسکریپت بررسی می‌کنیم:

1_The toReversed() method of Array instances is the copying counterpart of the reverse() method. It returns a new array with the elements in reversed order.

const numbers = [1, 2, 3, 4, 5, 6]
const toReversed= numbers.toReversed()
console.log({ numbers, toReversed})

// { numbers: [1, 2, 3, 4, 5, 6], reversed: [6, 5, 4, 3, 2, 1] } 

2_The toSorted() method of Array instances is the copying version of the sort() method. It returns a new array with the elements sorted in ascending order.

const numbers = [2, 6, 4, 1, 3, 5]
const toSorted = numbers.toSorted()
console.log({ numbers, toSorted })

// { numbers: [2, 6, 4, 1, 3, 5], toSorted: [1, 2, 3, 4, 5, 6] }

3_The toSpliced() method of Array instances is the copying version of the splice() method. It returns a new array with some elements removed and/or replaced at a given index.

const numbers = [1, 2, 3, 4, 5, 6]
const start = numbers.toSpliced(3)
const startAndDeleteCount = numbers.toSpliced(3, 2)
const addItem = numbers.toSpliced(3, 2, 'one', 'two')
console.log({ numbers, start, startAndDeleteCount, addItem })

// { numbers: [1, 2, 3, 4, 5, 6], start: [1, 2, 3], startAndDeleteCount: [1, 2, 3, 6], addItem: [1, 2, 3, 'one', 'two', 6] }

4_The with() method of Array instances is the copying version of using the bracket notation to change the value of a given index. It returns a new array with the element at the given index replaced with the given value.

const numbers = [1, 2, 3]
const changeNumber = numbers.with(1, &quottwo&quot)
console.log({ numbers, changeNumber })

// { numbers: [1, 2, 3], changeNumber: [1, 'two', 3] }

5_The findLast() method of Array instances iterates the array in reverse order and returns the value of the first element that satisfies the provided testing function. If no elements satisfy the testing function, undefined is returned.

const numbers = [110, 220, 3, 4, 5, 6]
const findItem = numbers.findLast(number => number > 4)
console.log({ numbers, findItem })

// { numbers: [110, 220, 3, 4, 5, 6], findItem: 6 }

6_The findLastIndex() method of Array instances iterates the array in reverse order and returns the index of the first element that satisfies the provided testing function. If no elements satisfy the testing function, -1 is returned.

const numbers = [110, 220, 3, 4, 5, 6]
const findIndex = numbers.findLastIndex(number => number > 4)
console.log({ numbers, findIndex })

// { numbers: [110, 220, 3, 4, 5, 6], findIndex: 5 }

7_The at() method of Array instances takes an integer value and returns the item at that index, allowing for positive and negative integers. Negative integers count back from the last item in the array.

const numbers = [110, 220, 3, 4, 5, 6]
const item = numbers.at(3)
const lastItem = numbers.at(-1)
console.log({ numbers, item, lastItem })

// { numbers: [110, 220, 3, 4, 5, 6], item: 4, lastItem: 6 }

8_The flat() method of Array instances creates a new array with all sub-array elements concatenated into it recursively up to the specified depth.

const numbers = [1, 2, [3, 4], 5, [[6], 7], [[[[8]]]]]
const flat = numbers.flat()
const flatDepth = numbers.flat(2)
const flatInfinity = numbers.flat(Infinity)
console.log({ numbers, flat, flatDepth, flatInfinity })

// { numbers: [1, 2, [3, 4], 5, [[6], 7], [[[[8]]]]], flat: [1, 2, 3, 4, 5, [6], 7, [[[8]]]], flatDepth: [1, 2, 3, 4, 5, 6, 7, [[8]]], flatInfinity: [1, 2, 3, 4, 5, 6, 7, 8] }

9_The flatMap() method of Array instances returns a new array formed by applying a given callback function to each element of the array, and then flattening the result by one level. It is identical to a map() followed by a flat() of depth 1 (arr.map(...args).flat()), but slightly more efficient than calling those two methods separately.

const numbers = [1, 2, 3, 4, 5, 6]
const week = [&quotMonday 1&quot, &quotTuesday 2&quot, &quotWednesday 3&quot, &quotThursday 4&quot, &quotFriday 5&quot, &quotSaturday 6&quot, &quotSunday 7&quot]
const flatMap = numbers.flatMap((number) => [`n_${number}`, number * 2])
const flatMapAndSplit = week.flatMap((day) => day.split(&quot &quot))
console.log({ flatMap, flatMapAndSplit })

// { flatMap: ['n_1', 2, 'n_2', 4, 'n_3', 6, 'n_4', 8, 'n_5', 10, 'n_6', 12], flatMapAndSplit: ['Monday', '1', 'Tuesday', '2', 'Wednesday', '3', 'Thursday', '4', 'Friday', '5', 'Saturday', '6', 'Sunday', '7'] }

10_The trim, trimStart, trimEnd method of String values removes whitespace from this string and returns a new string, without modifying the original string.

const string = '    hello  '
const trimStart = string.trimStart()
const trimEnd = string.trimEnd()
const trim = string.trim()
console.log({ string, trimStart, trimEnd, trim })

// { string: '    hello  ', trimStart: 'hello  ', trimEnd: '    hello', trim: 'hello'}

11_The padEnd and padStart method of String values pads this string with a given string (repeated, if needed) so that the resulting string reaches a given length.

const string = 'hello'
const padEnd = string.padEnd(6)
const padEndAndItem = string.padEnd(10, '...')
const padStart = string.padStart(6)
const padStartAndItem = string.padStart(10, '...')
console.log({ string, padEnd, padEndAndItem, padStart, padStartAndItem })

// { string: 'hello', padEnd: 'hello ', padEndAndItem: 'hello.....', padStart: ' hello', padStartAndItem: '.....hello' }

12_The startsWith and endsWith method of String values determines whether this string begins / ends with the characters of a specified string, returning true or false as appropriate.

const string = 'Hello, how are you?'
const startsWith = string.startsWith('Hello')
const startsWithAndPosition = string.startsWith('Hello', 3)
const endsWith = string.endsWith('?')
const endsWithAndPosition = string.startsWith('?', 3)
console.log({ string, startsWith, startsWithAndPosition, endsWith, endsWithAndPosition })

// { string: 'Hello, how are you?', startsWith: true, startsWithAndPosition: false, endsWith: true, endsWithAndPosition: false }

13_The hasOwnProperty() method of Object instances returns a boolean indicating whether this object has the specified property as its own property (as opposed to inheriting it).

const objectHello = { hello: 'salam' }
const objectFlower = Object.create(null)
objectFlower.dahlia = &quotDahlia is a genus of bushy, tuberous, herbaceous perennial plants native to Mexico and Central America.&quot

console.log(Object.hasOwn(objectHello, 'hello')) //true
console.log(Object.hasOwn(objectHello, 'toString')) //false
console.log(Object.hasOwn(objectFlower, 'dahlia')) //true
console.log(objectHello.hasOwnProperty('toString')) //false
console.log(objectHello.hasOwnProperty('hello')) //true
console.log('hello' in objectHello) //true
console.log('toString' in objectHello) //true
console.log('dahlia' in objectFlower) //true
// console.log(objectFlower.hasOwnProperty('dahlia')) objectFlower.hasOwnProperty is not a function

14_The Object.fromEntries() static method transforms a list of key-value pairs into an object.

const array = [ ['one', 'a'], ['two', 'b'], ['three', ['c', 'd', 'e', 'f']] ]
console.log(Object.fromEntries(array))

// { one: 'a', two: 'b', three: ['c', 'd', 'e', 'f'] }

15_Top-level await enables developers to use the await keyword outside of async functions. It acts like a big async function causing other modules who import them to wait before they start evaluating their body.

console.log(&quothello&quot)
await new Promise(r => setTimeout(r, 1000))
console.log(&quotbye&quot)

16_The logical OR assignment (||=) operator only evaluates the right operand and assigns to the left if the left operand is falsy.

const user = { lastName: &quotHopkins&quot, firstName: '', age: 10, city: null }
user.lastName ||= &quot---&quot
user.firstName ||= 'Anthony'
user.age &&= 85
user.city ??= &quotMargam&quot
console.log(user)

// { lastName: 'Hopkins', firstName: 'Anthony', age: 85, city: 'Margam' }

منابع:

https://github.com/tc39/proposals/blob/HEAD/finished-proposals.md

https://exploringjs.com/impatient-js/ch_new-javascript-features.html

https://v8.dev/features/top-level-await