Вычисление короткого замыкания

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

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

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

#оператор

Преобразование в 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!

#типы

Преобразование в String

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

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

#типы

Преобразование в 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 .

#типы

Быстрое возведение в степень

Начиная с 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 .

#операция

Быстрое преобразование 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

#операция

Удалить последние цифры

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

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 отрицательное - округляется в меньшую. Чтобы выразиться точнее, эта операция удаляет все, что следует после десятичной точки, усекая число с плавающей точкой до целого числа.

Причины, по которым эти конкретные операции работают, заключаются в том, что после принудительного преобразования в целое число, значение остается неизменным.

#типы

Получить 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]

#массивы

Автоматический биндинг в классах

Мы можем использовать стрелочную нотацию 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>
</>
)
}
};

#классы

Обрезание массива

Если вы хотите удалить значения из конца массива деструктивно, есть более быстрые альтернативы, чем использование 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]

#массивы

Получить 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]

#массивы

Работа с аргументами функции

Вам не нужно определять параметры для функции. Вы можете просто использовать массиво-подобный объект функции 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

#аргументы

Операторы === и !==

Всегда используйте === и !== вместо == и !=.

alert('' == '0'); //false
alert(0 == ''); // true
alert(0 =='0'); // true

== не является транзитивным. Если вы используете === , то оно как и ожидалось будет возвращать false для всех вышеперечисленных случаев.

#операторы

Функции в 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();
}

#функции

Оператор in

Вы можете использовать оператор in для того чтобы проверить есть ли такой ключ у объекта:

var x = 1; 
var y = 3; 
var list = {0:0, 1:0, 2:0};
x in list; //true 
y in list; //false 
1 in list; //true 
y in {3:0, 4:0, 5:0}; //true

Если вы посчитаете, что литералы объекта недостаточно хорошо выглядят, то вы можете комбинировать их с помощью функции без параметров:

function list() {
var x = {};
for(var i=0; i < arguments.length; ++i)
x[arguments[i]] = 0;
return x
}

5 in list(1,2,3,4,5) //true

#операторы

Значения по умолчанию

Вы можете использовать оператор || в выражении присваивания для предоставления значения по умолчанию:

var a = b || c;

Переменная a получит значение c только если b = false (то есть если null, false, undefined, 0, empty string, или NaN), иначе a получит значение b.
Это часто полезно в функциях, когда вы хотите присвоить значение по умолчанию аргументу в случае, если оно не указано:

function example(arg1) {
arg1 || (arg1 = 'default value');
}

#операторы

Область действия в JavaScript

JavaScript не имеет области действия блока:

var x = 1; 
{ var x = 2; } 
alert(x); // выводит 2

#общее

Свойства объекта

Вы можете получить доступ к свойствам объекта с помощью [] вместо '.'. Это позволяет найти свойство, которое соответствует переменной.

obj = {a:"test"}; 
var propname = "a"; 
var b = obj[propname]; // "test"

Также вы можете использовать это для получения/установки значения свойства, если его название неразрешенный идентификатор.

obj["class"] = "test"; // class - зарезервированное слово; obj.class было бы недоступно.
obj["two words"] = "test2"; // использования оператора . невозможно с пробелом.

#объекты