JavaScript заметки

Журнал Академии Яндекса — интересно об IT Помогает молодым IT-специалистам работать с удовольствием и эффективно → Расскажет, как попасть в компанию, которая вдохновляет. → Научит правильно организовать работу, расти в глазах коллег (и профессионально). → Поможет на лету решать проблемы, стать своим в сообществе и работать без стресса. → Покажет, как устроена работа в Яндексе изнутри — с точки зрения команд, продуктов и технологий. → Подсветит гиковские темы: от старых компьютерных игр до редких языков программирования. Подписывайтесь, чтобы не пропустить свежие публикации!

Функции в JavaScript В частности функции могут быть переданы как параметры, например Array.filter() является функцией обратного вызова:

[1, 2, -1].filter(function(element, index, array) { 
   return element > 0 }); // -> [1,2]

Также вы можете объявить "private" функцию, которая существует только в области действия определенной функции: function PrintName() { var privateFunction = function() { return "Steve"; }; return privateFunction(); } #функции

Операторы === и !== Всегда используйте === и !== вместо == и !=. alert('' == '0'); //false alert(0 == ''); // true alert(0 =='0'); // true == не является транзитивным. Если вы используете === , то оно как и ожидалось будет возвращать false для всех вышеперечисленных случаев. #операторы

Работа с аргументами функции Вам не нужно определять параметры для функции. Вы можете просто использовать массиво-подобный объект функции argument. function sum() { var retval = 0; for (var i = 0, len = arguments.length; i < len; ++i) { retval += arguments[i]; } return retval; } sum(1, 2, 3) // вернет 6 #аргументы

Получить n последних элементов массива Метод массива slice() может принимать отрицательные целые числа, и при наличии он будет принимать значения с конца массива, а не с начала.

let array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
console.log(array.slice(-1)); // Result: [9]
console.log(array.slice(-2)); // Result: [8, 9]
console.log(array.slice(-3)); // Result: [7, 8, 9]

#массивы

Обрезание массива Если вы хотите удалить значения из конца массива деструктивно, есть более быстрые альтернативы, чем использование splice() . Например, если вы знаете размер вашего исходного массива, вы можете переопределить его свойство length следующим образом:

let array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
array.length = 4;
console.log(array); // Result: [0, 1, 2, 3]

Это особенно краткое решение. Тем не менее, я обнаружил, что время выполнения slice() метода еще быстрее. Если ваша главная цель - скорость, подумайте об этом: let array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]; array = array.slice(0, 4); console.log(array); // Result: [0, 1, 2, 3] #массивы

Автоматический биндинг в классах Мы можем использовать стрелочную нотацию ES6 в методах класса, и при этом подразумевается привязка. Это сохраняет несколько строк кода в нашем конструкторе классов, и мы можем с радостью попрощаться с повторяющимися выражениями, такими как this.myMethod = this.myMethod.bind(this)! import React, { Component } from React; export default class App extends Compononent { constructor(props) { super(props); this.state = {}; } myMethod = () => { // This method is bound implicitly! } render() { return ( <> <div> {this.myMethod()} </div> </> ) } }; #классы

Получить n последних элементов массива Метод массива slice() может принимать отрицательные целые числа, и при наличии он будет принимать значения с конца массива, а не с начала.

let array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
console.log(array.slice(-1)); // Result: [9]
console.log(array.slice(-2)); // Result: [8, 9]
console.log(array.slice(-3)); // Result: [7, 8, 9]

#массивы

Не умеешь в JS и CSS, а крутые эффекты делать хочется? Канал @code_advantage поможет! Здесь найдешь сотни эффектов и анимаций, которые сделают твой UI живым и отзывчивым Юзер-френдли дизайн? Легко! — бери готовый код и используй

Быстрое преобразование Float в Integer Если вы хотите преобразовать число с плавающей точкой в целое число, вы можете использовать Math.floor(), Math.ceil() или Math.round(). Но есть также более быстрый способ обрезать число с плавающей точкой до целого числа, используя | оператор побитового ИЛИ.

console.log(23.9 | 0);  // Result: 23
console.log(-23.9 | 0); // Result: -23

Поведение | зависит от того, имеете ли вы дело с положительными или отрицательными числами, поэтому лучше использовать его вы точно уверены в операндах. Если n положительно, n | 0 округляется в большую сторону. Если n отрицательное - округляется в меньшую. Чтобы выразиться точнее, эта операция удаляет все, что следует после десятичной точки, усекая число с плавающей точкой до целого числа. Причины, по которым эти конкретные операции работают, заключаются в том, что после принудительного преобразования в целое число, значение остается неизменным. #типы

Удалить последние цифры Побитовый оператор ИЛИ также можно использовать для удаления любого количества цифр из конца целого числа. Это означает, что нам не нужно использовать подобный код для преобразования между типами:

let str = "1553"; 
Number(str.substring(0, str.length - 1));

Вместо этого побитовый оператор OR позволяет нам сделать так:

console.log(1553 / 10   | 0)  // Result: 155
console.log(1553 / 100  | 0)  // Result: 15
console.log(1553 / 1000 | 0)  // Result: 1

#операции

Не очень комфортно заниматься сексом, когда твой телефон прослушивает Google 🤷 Или писать личную СМСку, когда каждое слово видит клавиатурный шпион. Приватности больше нет. Крупные поисковики в открытую залазят к нам в трусы ради прибыли, и только 5-10% пользователей знают, как этому противопостоять. Для тех, кому не наплевать на свою безопасность в сети, есть канал «Отдел К». Как понять, что ваш смартфон хотели взломать? Какие 3 настройки отключить, чтобы избавиться от прослушки? Как по любому сообщению узнать точное гео собеседника? Осторожно, после подписки вам захочется удалить все соцсети: @cyber_cabb

Удалить последние цифры Побитовый оператор ИЛИ также можно использовать для удаления любого количества цифр из конца целого числа. Это означает, что нам не нужно использовать подобный код для преобразования между типами:

let str = "1553"; 
Number(str.substring(0, str.length - 1));

Вместо этого побитовый оператор OR позволяет нам сделать так:

console.log(1553 / 10   | 0)  // Result: 155
console.log(1553 / 100  | 0)  // Result: 15
console.log(1553 / 1000 | 0)  // Result: 1

#операция

Быстрое преобразование Float в Integer Если вы хотите преобразовать число с плавающей точкой в целое число, вы можете использовать Math.floor(), Math.ceil() или Math.round(). Но есть также более быстрый способ обрезать число с плавающей точкой до целого числа, используя | оператор побитового ИЛИ.

console.log(23.9 | 0);  // Result: 23
console.log(-23.9 | 0); // Result: -23

Поведение | зависит от того, имеете ли вы дело с положительными или отрицательными числами, поэтому лучше использовать его вы точно уверены в операндах. Если n положительно, n | 0 округляется в большую сторону. Если n отрицательное - округляется в меньшую. Чтобы выразиться точнее, эта операция удаляет все, что следует после десятичной точки, усекая число с плавающей точкой до целого числа. Причины, по которым эти конкретные операции работают, заключаются в том, что после принудительного преобразования в целое число, значение остается неизменным. #операция

Быстрое возведение в степень Начиная с ES7 стало возможным использовать оператор возведения в степень ** как сокращение для степеней, что быстрее, чем запись Math.pow(2, 3). Это простой материал, но он попал в список, потому что не так много учебных содержит этот оператор!

console.log(2 ** 3); // Result: 8

Не следует его путать с ^ символом, обычно используемым для записи показателей степени, т.к в JavaScript он является побитовым оператором XOR. До ES7 сокращение существовало только для степеней с основанием 2 с использованием оператора побитового сдвига влево << :

// The following expressions are equivalent:
Math.pow(2, n);
2 << (n - 1);
2**n;

Например, 2 << 3 = 16 эквивалентно 2 ** 4 = 16 . #операция

Мы не будем тебе говорить в этой рекламе о том, что программисты получают хорошие деньги за свою работу — ты это и так знаешь. Не скажем и о том, что обучаться программированию — сложно. Тебе это и так известно. Вместо этого, мы расскажем, что обучаться на Frontend-developer’a можно без гроша в кармане. Чтобы попасть в число тех, кто работает с одним из самых популярных языков программирования в мире, не заплатив во время обучения ни копейки, поступайте в Kata Academy. Они не только на отлично обучат тебя JavaScript, но и помогут устроиться на работу с гарантированной ЗП от 80к в месяц. Да, это прописано у них в договоре. А если ты внезапно не тянешь программу или не смог устроиться на работу с указанной выше зарплатой — ты ничего не платишь. Вот вообще. Зато если все ОК, платишь 17% с зарплаты уже после трудоустройства. Если тебе нравится такой подход к образованию, то переходи по ссылке и оставляй заявку: https://clck.ru/333zpJ

Преобразование в Number Можно быстро сделать с помощью оператора сложения + .

let int = "15";
int = +int;
console.log(int); // Result: 15
console.log(typeof int); Result: "number"

Это также может быть использовано для преобразования boolean в числа, как показано ниже:

console.log(+true);  // Return: 1
console.log(+false); // Return: 0

Могут быть контексты, в которых оператор + будет интерпретироваться как оператор конкатенации, а не как оператор сложения. В таком кейсе (вы хотите вернуть целое число, а не с плавающей точкой), вы можете использовать тильды: ~~ .

const int = ~~"15"
console.log(int); // Result: 15
console.log(typeof int); Result: "number"

Хотя я не могу придумать много вариантов использования, но побитовый оператор NOT также можно использовать в логических значениях: ~true = -2 и ~false = -1 . #типы

Преобразование в String Чтобы быстро преобразовать число в строку, мы можем использовать оператор конкатенации + , за которым следует пустой набор кавычек "" .

const val = 1 + "";
console.log(val); // Result: "1"
console.log(typeof val); // Result: "string"

#типы

Преобразование в Boolean Помимо обычных логических значений true и false, JavaScript также обрабатывает все другие значения как «правдивые» или «ложные». Если не указано иное, все значения в JavaScript являются «правдивыми» за исключением 0, "", null, undefined, NaN и, конечно false - которые являются «falsy». Мы можем легко переключаться между true и false, используя отрицательный оператор !, который также преобразует тип в "boolean" .

const isTrue  = !0;
const isFalse = !1;
const alsoFalse = !!0;

Этот тип преобразования типов может быть полезен в условных выражениях, хотя единственная причина, по которой вы бы решили определить false как !1, это если бы вы играли в code golf! #типы

Вычисление короткого замыкания Тернарный оператор - это быстрый способ написать простые (а иногда и не очень простые) условные конструкции, например:

x > 100 ? 'Above 100' : 'Below 100';
x > 100 ? (x > 200 ? 'Above 200' : 'Between 100-200') : 'Below 100';

Но иногда даже тернарный оператор получается сложнее, чем нужно. Вместо него мы можем использовать логические операторы «и» && и «или» || для более точной оценки определенных выражений. Его часто называют «коротким замыканием». #оператор