Как и любой другой язык программирования, JavaScript имеет множество приемов для решения как простых, так и сложных задач. Некоторые трюки широко известны, а других достаточно, чтобы взорвать ваш мозг. Давайте посмотрим на семь уловок JavaScript, которые вы можете начать использовать сегодня!
Получение уникального значения массива
Получить массив уникальных значений, вероятно, проще, чем вы думаете:
var j = [...new Set([1, 2, 3, 3])]
>> [1, 2, 3]
Я люблю смесь rest выражений и Set!
Массив и логическое значение
Вам когда-нибудь нужно фильтровать ложные значения (0, неопределенное, нулевое, ложное и т. д) Из массива? Возможно, вы не знали этого трюка:
myArray
.map(item => {
// ...
})
// Избавиться от плохих значениях
.filter(Boolean);
Просто передайте логическое значение, и все эти ложные значения исчезнут!
Создание пустых объектов
Конечно, вы можете создать объект, который кажется пустым с помощью {}, но этот объект все еще имеет __proto__ и обычный hasOwnProperty и другие методы объекта. Однако есть способ создать чистый словарь:
let dict = Object.create (null);
// dict .__ proto__ === "undefined"
// Нет свойств объекта, пока вы не добавите их
На этом объекте нет абсолютно никаких ключей или методов, которые вы туда не поместите!
Объединение объектов
Необходимость объединения нескольких объектов в JavaScript существует всегда, особенно когда мы начали создавать классы и виджеты с параметрами:
const person = { name: 'David Walsh', gender: 'Male' };
const tools = { computer: 'Mac', editor: 'Atom' };
const attributes = { handsomeness: 'Extreme', hair: 'Brown', eyes: 'Blue' };
const summary = {...person, ...tools, ...attributes};
/*
Object {
"computer": "Mac",
"editor": "Atom",
"eyes": "Blue",
"gender": "Male",
"hair": "Brown",
"handsomeness": "Extreme",
"name": "David Walsh",
}
*/
Эти три точки сделали задачу намного проще!
Требуются параметры функции
Возможность устанавливать значения по умолчанию для аргументов функции была отличным дополнением к JavaScript, но попробуйте этот прием, чтобы требовать передачи значений для данного аргумента:
const obj = {x: 1};
// захватывает obj.x как {x}
const {x} = obj;
// захватывает obj.x как as {otherName}
const {x: otherName} = obj;
Это проверка следующего уровня и использование JavaScript!
Получение параметра строки запроса
В течение многих лет мы писали грубые регулярные выражения для получения значений строки запроса, но те времена прошли - введите удивительный API URLSearchParams:
// Предполагая, что "? Post = 1234 & action = edit"
var urlParams = new URLSearchParams (window.location.search);
console.log(urlParams.has('post')); // true
console.log(urlParams.get('action')); // "edit"
console.log(urlParams.getAll('action')); // ["edit"]
console.log(urlParams.toString()); // "?post=1234&action=edit"
console.log(urlParams.append('active', '1')); // "?post=1234&action=edit&active=1"
Намного легче, чем мы привыкли бороться!
С годами JavaScript сильно изменился, но моя любимая часть JavaScript в наши дни - скорость улучшения языка, которую мы наблюдаем. Несмотря на изменяющуюся динамику JavaScript, нам все еще нужно использовать несколько приличных приемов; Держите эти уловки в вашем наборе инструментов, когда они вам нужны!
Какие твои любимые трюки с JavaScript?
Оригинал - http://rapprogtrain.com/article/25