Настоящее и будущее через примеры (до/после)

JavaScript, вездесущий язык Интернета, продолжает развиваться с каждым годом. В этом посте я суммирую (с моей точки зрения) некоторые из значительных улучшений за этот год, и мы заглянем в будущее, чтобы увидеть, что будет в следующем году.

Я надеюсь, что вы найдете это полезным, давайте начнем!

JavaScript 2023: новое и улучшенное

На 2023 год выделяются пять предложений, каждое из которых вносит уникальные дополнения в язык JavaScript.

1. Символы как ключи WeakMap

Представленный в ECMAScript 2015, WeakMap позволяет расширять объект дополнительными свойствами, не беспокоясь об утечках памяти. До сих пор только объекты могли служить ключами в WeakMap. Новая функция позволяет использовать символы в качестве уникальных ключей в WeakMap, потенциально увеличивая их использование.

До:

let objKey = {};
let weakmap = new WeakMap();
weakmap.set(objKey, "I'm an object key!");

console.log(weakmap.get(objKey));  // Output: "I'm an object key!"

В приведенном выше примере мы создали объект objKey, который будет служить ключом в нашей WeakMap weakmap.

После:

let symbolKey = Symbol('a unique key');
let weakmap = new WeakMap();
weakmap.set(symbolKey, "I'm a symbol key!");

console.log(weakmap.get(symbolKey));  // Output: "I'm a symbol key!"

С помощью новой функции мы создаем символ symbolKey, который будет служить ключом в нашей WeakMap weakmap. Таким образом, мы можем использовать уникальное, не повторяющееся значение в качестве ключа. Это особенно полезно, когда мы хотим расширить объект дополнительными свойствами таким образом, чтобы он не мешал самому объекту и был защищен от утечек памяти.

Уже доступно в последних версиях основных браузеров (06.06.2023).

2. Изменить массив путем копирования

В этом предложении представлены новые методы сортировки, реверсирования и перезаписи данных без изменения массива, в котором они хранятся. Это обеспечивает более функциональные шаблоны программирования и согласованность при обработке массивов и кортежей.

До: изменение массива

let array = [3, 2, 1];
array.sort();

console.log(array);  // Output: [1, 2, 3]

В приведенном выше примере мы отсортировали массив, но исходный массив был видоизменен в результате операции sort().

После: Использование «Изменить массив путем копирования»

let array = [3, 2, 1];
let sortedArray = array.sortCopy();  // Proposed method

console.log(array);         // Output: [3, 2, 1]
console.log(sortedArray);   // Output: [1, 2, 3]

В этом примере мы используем предложенный метод sortCopy() (точное имя метода может отличаться в окончательной спецификации) для сортировки массива. Этот новый метод возвращает новый отсортированный массив и оставляет исходный массив без изменений.

Эта функция является частью парадигмы функционального программирования, где настоятельно рекомендуется неизменность данных. Избегая прямых изменений исходных данных, мы можем писать более безопасный и предсказуемый код. Следует отметить, что в этом примере предполагается существование метода sortCopy(), как описано в предложении, но будущая реализация может быть другой, когда эта функция будет официально выпущена.

3. Поиск массива из последнего

Как следует из названия, эта функция возвращает совпадающие элементы в массиве, начиная с конца и обратно, потенциально повышая производительность или избавляя от необходимости писать дополнительный код.

До: Использование Array.prototype.find() и Array.prototype.reverse()

let array = [1, 2, 3, 2, 1];
array.reverse();
let foundValue = array.find(element => element === 2);

console.log(foundValue);  // Output: 2

В приведенном выше примере мы перевернули массив, а затем использовали find() для поиска первого вхождения числа 2 с конца массива.

После: Использование Array.prototype.findLast()

let array = [1, 2, 3, 2, 1];
let foundValue = array.findLast(element => element === 2);

console.log(foundValue);  // Output: 2

В этом примере мы используем предложенный метод findLast() (точное имя метода может отличаться в окончательной спецификации), чтобы найти первое вхождение числа 2 с конца массива. Этот новый метод позволяет нам избежать обращения массива и делает наше намерение более ясным.

Уже доступно в последних версиях основных браузеров (06.06.2023).

4. Хэшбанг-комментарии

Стандартизация комментариев с хэш-бэнгом в JavaScript повышает его согласованность с другими языками. Это изменение может упростить участие JavaScript в экосистеме искусственного интеллекта и машинного обучения, где в настоящее время доминирует Python.

До: Использование комментариев Hashbang

Hashbang уже используются в JavaScript, особенно в сценариях Node.js, но их обработка зависела от среды хоста. Вот пример скрипта Node.js, использующего хеш-банг:

#!/usr/bin/env node
console.log("Hello, world!");

В этом примере хэш-банг (#!/usr/bin/env node) в верхней части файла указывает на то, что скрипт следует запускать с использованием Node.js. Однако хост-среда Node.js отвечает за обработку этого хеш-банга и удаление его перед передачей кода в механизм JavaScript.

После: комментарии Hashbang стали официальными

Благодаря стандартизации комментариев hashbang сам движок JavaScript будет отвечать за обработку этих комментариев, обеспечивая единообразное поведение в разных хост-средах. Использование hashbangs останется прежним:

#!/usr/bin/env node
console.log("Hello, world!");

Разница заключается в базовой обработке этих хэш-бангов, что делает JavaScript более совместимым с другими языками сценариев и потенциально более легким для интеграции с различными экосистемами. Обратите внимание, что эта функция более актуальна для серверного JavaScript и мало что меняет для клиентского JavaScript в браузерах.

5. найтипоследнийиндекс

const array = [1, 2, 3, 2, 1];

const lastIndex = array.findLastIndex(x => x === 2);

console.log(lastIndex); // Output: 3

В этом примере findLastIndex используется для поиска последнего вхождения числа 2 в массиве. Функция, переданная findLastIndex, возвращает true для числа 2 и false для любого другого числа. findLastIndex возвращает индекс последнего элемента массива, для которого функция возвращает true.

Уже доступно в последних версиях основных браузеров (06.06.2023).

JavaScript 2024: путь вперед

Хотя сейчас основное внимание уделяется функциям 2023 года, есть также важные предложения на 2024 год. Хотя они все еще находятся на ранней стадии утверждения, они обещают впечатляющие улучшения для JavaScript.

6. Временный API

Существующий в JavaScript объект Date был источником разочарования из-за его причудливого API и дизайна. В ответ на это был предложен новый API под названием Temporal API, который находится в процессе добавления в JavaScript. Он разработан, чтобы быть более простым и мощным, чем Date API.

Temporal API достиг стадии 3 процесса предложения ECMAScript, что означает, что он в основном согласован, но все еще может иметь некоторые незначительные изменения, прежде чем он будет официально добавлен в JavaScript.

Вот пример создания даты и получения текущего года с помощью старого API Date, а также того, как вы могли бы сделать то же самое с предлагаемым Temporal API.

Старый способ с Date:

let now = new Date();
let currentYear = now.getFullYear();
console.log(currentYear);

Новый предлагаемый способ с Temporal:

let now = Temporal.now.plainDate(); // Returns a PlainDate object representing the current date
let currentYear = now.year; // In Temporal, you can get the year directly with .year
console.log(currentYear);

7. Оператор трубопровода (|›)

Оператор конвейера — это синтаксический сахар для объединения функций в удобочитаемую форму. Он обещает сделать функциональное программирование на JavaScript более интуитивным, а код — более читаемым.

Перед использованием оператора конвейера

const double = (x) => x * 2;
const addFive = (x) => x + 5;

const result = addFive(double(10)); // 25

По-старому нам нужно вкладывать вызовы функций, что может стать сложным и трудным для чтения с большим количеством функций.

Использование оператора конвейера

const double = (x) => x * 2;
const addFive = (x) => x + 5;

const result = 10 |> double |> addFive; // 25

В этом примере у нас есть две функции: double и addFive. Оператор конвейера (|>) служит соединителем, позволяющим нашим данным (число 10) передаваться от одной функции к другой.

8. Причина ошибки

В этом предложении к объектам Error добавляется необязательное свойство cause, которое может помочь в отладке и сделать разработчиков более продуктивными.

Перед использованием свойства причины:

try {
    connectToDatabase();
} catch (err) {
    throw new Error('Database connection failed.', { cause: err });
}

Используя свойство причины:

function buildRSA(p, q) {
    if (!Number.isInteger(p) || !Number.isInteger(q)) {
        throw new Error('RSA key generation requires integer inputs.', {
            cause: { code: 'NonInteger', values: [p, q] },
        });
    }
    if (!areCoprime(p, q)) {
        throw new Error('RSA key generation requires two coprime integers.', {
            cause: { code: 'NonCoprime', values: [p, q] },
        });
    }
}

В этом примере вместо того, чтобы выдавать ошибку с понятным для человека сообщением, причина предоставляется в виде структурированных данных для машинного анализа. Это полезно, когда удобочитаемые сообщения об ошибках не подходят для машинного анализа, поскольку они подвержены изменениям в формулировке или пунктуации, которые могут нарушить любой существующий анализ, написанный для их использования.

Последние мысли

JavaScript продолжает расти и адаптироваться к потребностям разработчиков. Функции на 2023 год и предлагаемые улучшения на 2024 год указывают на светлое будущее этого динамического языка. Поскольку JavaScript продолжает развиваться, мы можем ожидать появления более сложных и удобных для пользователя функций, которые сделают программирование более эффективным и приятным.

Примечание: недавно мой босс спросил меня, какой язык я бы порекомендовал для его сына, и, подумав, я сказал JavaScript. Это не самый лучший язык, и в нем слишком много подводных камней, но это язык, который используется для чего угодно, и он настолько широко распространен, что его изучение является гарантией. Кроме того, он продолжает расти и совершенствоваться во всех своих аспектах.

Дополнительные материалы на PlainEnglish.io.

Подпишитесь на нашу бесплатную еженедельную рассылку новостей. Подпишитесь на нас в Twitter, LinkedIn, YouTube и Discord .