Поделитесь 7 полезными приемами JavaScript

JavaScript

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

Оригинальная ссылка:Дэвид Уолш. Так / JavaScript- ...

Дедупликация массива

Дедупликация массива может быть проще, чем вы думаете:

var j = [...new Set([1, 2, 3, 4, 4])]
>> [1, 2, 3, 4]

Это очень просто и есть дерево!

отфильтровать ложные значения

Вам нужно отфильтровать значение FALSY из массива (0,undefined,null,falseЖдать)? Вы можете не знать, что есть такой трюк:

let res = [1,2,3,4,0,undefined,null,false,''].filter(Boolean);
>> 1,2,3,4

Создать пустой объект

ты можешь использовать это{ }Создает кажущийся пустым объект, но объект все еще имеет__proto__и обычныйhasOwnPropertyи другие объектные методы. Тем не менее, есть способ создать чистый объект «словаря»:

let dict = Object.create(null);

// dict.__proto__ === "undefined"
// No object properties exist until you add them

Объекты, созданные таким образом, очень чистые, без каких-либо свойств и объектов, очень чистые.

Объединить объекты

Необходимость объединять несколько объектов в 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 isRequired = () => { throw new Error('param is required'); };

const hello = (name = isRequired()) => { console.log(`hello ${name}`) };

// This will throw an error because no name is provided
hello();

// This will also throw an error
hello(undefined);

// These are good!
hello(null);
hello('David');

Деструктуризация для добавления псевдонимов

Деструктуризация — очень полезное дополнение к JavaScript, но иногда мы предпочитаем называть эти свойства другими именами, поэтому мы можем воспользоваться псевдонимами:

const obj = { x: 1 };

// Grabs obj.x as { x }
const { x } = obj;

// Grabs obj.x as { otherName }
const { x: otherName } = obj;

Помогает избежать конфликтов имен с существующими переменными!

Получить параметры строки запроса

Получите значение параметра в URL-адресе или добавьте строку запроса. Раньше мы обычно получали значение строки запроса с помощью регулярных выражений. Однако теперь появился новый API. Для получения подробной информации вы можете проверитьздесьЭто позволяет нам очень простой способ справиться с URL.

Например, теперь у нас есть такой URL-адрес «?post=1234&action=edit», мы можем использовать следующие методы для обработки этого URL-адреса.

// Assuming "?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?

Если вы считаете, что статья немного полезна для вас, добро пожаловать вмой блог на гитхабеСтавьте лайк и подписывайтесь, большое спасибо!

Категории