5 JavaScript Список навыков Обмен навыкам

внешний интерфейс JavaScript спецификация кода
5 JavaScript Список навыков Обмен навыкам

«Это 17-й день моего участия в первом испытании обновлений 2022 года. Подробную информацию о мероприятии см.:Вызов первого обновления 2022 г."

JavaScript прост в изучении, но сложен в освоении, у него много «причуд», и только после длительного использования он постепенно раскрывает свою тайну~

image.png

В этой статье приведены несколько фрагментов кода JavaScript, есть несколько советов, некоторые из которых вы наверняка не знаете~ Чонг!

фильтровать пустые значения

использоватьfilter()Фильтр «нулевое» значение, напримерnull,undefinedили пустая строка, вы можете использовать.filter(Boolean)метод сокращения;

он превращает все нулевые значения вfalse

const groceries = ['apple', null, 'milk', undefined, 'bread', ''];

const cleanList = groceries.filter(Boolean);

console.log(cleanList);

// 'apple', 'milk', 'bread';

Деконструкция объекта массива

Мы часто используем деструктуризацию ES6.Для массива каждый элемент является объектом.Если вы хотите получить определенное значение объекта первого элемента массива, вы можете написать это так;

const people = [
  {
    name: "Lisa",
    age: 20,
  },
  {
    name: "Pete",
    age: 22,
  },
  {
    name: "Caroline",
    age: 60,
  }
];

const [{age}] = people;

console.log(age);

// 20

Вы также можете указать элемент для назначения, используя запятую-заполнитель;

const people = [
  {
    name: "Lisa",
    age: 20,
  },
  {
    name: "Pete",
    age: 22,
  },
  {
    name: "Caroline",
    age: 60,
  }
];

const [, , caroline] = people;

console.log(caroline);

//  {
//     name: "Caroline",
//     age: 60,
//   }

Конечно, есть и общие назначения деструктуризации объектов;

const caroline = {
  firstNm: 'Caroline',
  ag: 27,
};

const {firstNm: firstName, ag: age } = caroline;

console.log(firstName, age);

// Caroline, 27

Отдельные номера

Использование разделителей для больших чисел значительно улучшит читаемость — это новая функция ES12;

const bigNumber = 1_000_000;
console.log(bigNumber);
// 1000000

Стрелочные функции возвращают объекты напрямую

Используйте функцию стрелки, чтобы вернуть объект, чтобы объединить с функцией{Чтобы отличить, намотайте слой на внешний слой(можно решить;

const createPerson = (age, name, nationality) => ({
  age,
  name,
  nationality,
});

const caroline = createPerson(27, 'Caroline', 'US');

console.log(caroline);

// {
//   age: 27,
//   name: 'Caroline'
//   nationality: 'US',
// }

цепочка ожидания

мы можем использоватьfilter а также mapЭтот метод связан с методом await для формирования цепочки для фильтрации или сопоставления полученных данных;

const chainDirectly = (await fetch('https://www.people.com'))
  .filter(person => age > 20)
  .filter(person => nationality === 'NL')

Я Наггетс Энтони, экспозиция ввода-вывода, техническая проницательность жизни, а затем будет ~

Категории