10 полезных приемов для JavaScript разработчиков

JavaScript – это язык программирования, который развивается ежедневно улучшая свои возможности.  Код в JS можно писать по-разному, в нем можно найти различные способы решения одной и той же проблемы. Несколько вариантов кода способны дать одинаковый результат, но некоторые методы могут оказаться короче и понятнее. Вот несколько советов для вас, которые помогут вам при написании качественного кода.

1. Foreach loop

Этот небольшой совет действительно полезен, если вам нужен простой JS. Используйте for (let i intestData) для доступа к индексу и используйте for (let i of testData) для доступа к элементам.

// Longhand
for (var i = 0; i < testData.length; i++)

// Shorthand
for (let i in testData) or for (let i of testData)

2. Оператор распространения

Оператор распространения используется для замены определенных функций массива. Оператор распространения – это просто серия из трех точек.

//longhand
const odd = [1, 3, 5];
const nums = [2, 4, 6]. concat (odd);
//shorthand
const odd = [1, 3, 5];
const nums = [2, 4, 6, …odd];

concole.log(nums); // [ 2, 4, 6, 1, 3, 5 ]

3. Несколько условий

Можно хранить несколько значений в массиве,  а также можно использовать метод array includes.

// longhand
if (x === ‘abc’ || x === ‘def’ || x=== ‘ghi’ || x === ‘jkl’) {
    //logic
}
//shorthand
if ([ ‘abc’ , ‘def’ ‘ghi’, ‘jkl’ )]. includes (x)) {
    //logic
}

4. Неявный возврат

Используя стрелочные функции, мы можем вернуть значение напрямую, без написания оператора возврата.

// longhand
function getAreal (diameter) {
 return Math. PI * diameter
}
//shorthand
getArea = diameter => (
 Math.PI * diameter;
)

5. Нулевые-пустые проверки

Этот метод используется, когда вы создаете новые переменные и  хотите проверить, не является ли переменная, на которую вы ссылаетесь значением null.

// Longhand
if (first !== null || first !== undefined || first !== ‘’) {
    let second = first;
}
// Shorthand
let second = first || ‘’;

6. Проверка наличия обязательных параметров функций

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

const isRequired = () => { throw new Error('param is required'); };
const print = (num = isRequired()) => { console.log(`printing ${num}`) };
print(2);//printing 2
print()// error
print(null)//printing null

7. Получение элементов из конца массива

Для получения элемента, находящегося в конце массива, можно воспользоваться методом массива slice(), которому передано отрицательное число:

let array = [0, 1, 2, 3, 4, 5, 6, 7]  
console.log(array.slice(-1));
>>>[7]
console.log(array.slice(-2));
>>>[6, 7]
console.log(array.slice(-3));
>>>[5, 6, 7]

8. Извлечение из массива уникальных значений

Чтобы извлечь из массива уникальные значение вместо привычного метода filter(), с помощью которого отфильтровывались повторяющиеся значения, можете использовать новый стандартный метод JavaScript – объект типа Set, что значительно проще в использовании чем фильтрация массива.

let uniqueArray = [...new Set([1, 2, 3, 3,3,"school","school",'ball',false,false,true,true])];
>>> [1, 2, 3, "school", "ball", false, true]

9. Изменение размера или очистка массива с помощью array.length

Иногда вам нужно отрегулировать размер вашего массива или очистить его. Самый эффективный способ сделать это – использовать Array.length.

let array = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j'];

console.log(array.length); // returns the length as 10

array.length = 4;

console.log(array.length); // returns the length as 4
console.log(array); // returns ['a', 'b', 'c', 'd']

10. Объединение массивов без перегрузки сервера

При объединении массивов может возникнуть серьезная нагрузка на сервер, особенно если вы имеете дело с большими наборами данных. Чтобы упростить задачу и поддерживать высокий уровень производительности, используйте функции Array.concat () и Array.push.apply (arr1, arr2).

Использование любой из этих функций зависит от размера ваших массивов.

Давайте посмотрим, как работать с меньшими массивами.

let list1 = ['a', 'b', 'c', 'd', 'e'];

let list2 = ['f', 'g', 'h', 'i', 'j'];

console.log(list1.concat(list2)); // returns the merged values of both arrays, ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j']

Эти приему помогут как новеньким, так и профессиональным разработчикам упростить работу с JavaScript.