Я хотел бы поделиться с вами любопытными конструкциями на javascript, которые помогут сократить количество кода, найти изящное решение, либо озадачить других js-программистов, работающих с вами на проекте.
Я ни в коем случае не призываю использовать их, чаще от этого больше вреда, чем пользы, но если вы столкнетесь с подобным в чужом коде, вы будете знать, что это такое и как работает.
Тернарные операторы
Думаю, всем известно, что это такое. Однако иногда хочется выполнить 2 каких-то действия или функции, вместо одного, тогда можно использовать оператор ‘|’.
var a = 5, b = 7; a > b ? console.log('true') : console.log('false'); //false var c = a > b ? 1 : 2; //c = 2 a < b ? console.log('true') | alert('Hi!') : console.log('false'); //напишет true в консоль и выведет алерт
Примечание: в древних javascript-движках выражение сравнения обязательно нужно было заключать в круглые скобки.
Запись функции через ‘=>’
//выражения работают идентично var Init = function () {console.log('Init.')}; var Init = () => {console.log('Init.')};
Операторы тильда и двойная тильда
Двойная тильда(двойное побитовое НЕ) используется для краткой записи математической функции округления до целого. Некоторые утверждают, что работает раза в два быстрее, чем Math.floor в IE8 и Safari 5. Обратие внимание, для отрицательных чисел такой оператор работает не так, как Math.floor.
Math.floor(5.1) // 5 Math.floor(5.9) // 5 ~~(5.1) // 5 ~~(5.9) // 5
Одинарную тильду(побитовое НЕ) очень удобно использовать для функций, вроде indexOf(), которые возращают -1, если совпадений не найдено.
var str = "Привет, мир"; //строка, внутри которой ведем поиск str.indexOf("Привет") // вернет 0 str.indexOf("Корова") // вернет -1 ~str.indexOf("Корова") ? console.log('Совпадений нет.') : console.log('Найдено совпадение.');
Оператор && (логическое «И»)
Логическое «И» возвращает последний операнд, если все операнды верны. Если хоть один из операндов неверен, то возвратит первый неверный операнд. Его удобно использовать, если необходимо получить вложенное свойство объекта, даже если его нету, этот оператор поможет избежать ексепшна. Например нам нужно получить obj.list.items
var goods = obj && obj.list && obj.list.items; //Еще примерчик var obj = {list:"test"}; console.log(obj && obj.list); //выведет test console.log(obj && obj.list && obj.list.items); //выведет undefined console.log(obj.list.items); //выскочит Exception
Логическое «И» можно использовать в качестве замены обычному if, особенно, когда else не требуется. Понравится всем яростным поклонникам фигурных скобок даже для одинарного if выражения.
//Идентичные выражения 1 == true && alert('true'); if(1 == true) alert('true'); //Два действия 1 == true && alert('first') | alert('second'); //покажется 2 алерта 1 != true && alert('first') | alert('second'); //ничего не покажется Еще небольшой пример: var a = 6; a == 6 && console.log( 'a равно 6 \n' ); a == 7 || console.log( 'a не равно 7 \n' );
Оператор ||(логическое «ИЛИ»)
Логическое «ИЛИ» возвращает первое верное значение. А если верных значений вообще нет, то последнее неверное.
Его удобно использовать для назначения переменным свойств по умолчанию.
var APP = APP || {}; //создание глобального объекта приложения, если он еще не создан
Оператор «!»(логическое «НЕ») и конструкция «==!»
Логическое «НЕ» удобно использовать для преобразования в boolean. При использовании этого оператора на любом выражении, оно преобразовывается к Boolean и возращается противоположное значение. Поэтому для преобразования используется двойное логическое «НЕ».
!0 //true !!0 //false !5 //false !!5 //true //Интересный примерчик 0 !== 0 //false - тут обычное сравнение по типу и значению 0 ==! 5 //true - для понимания можно так записать 0 == (!5) 5 ==! 5 //false 5 ==! 4 //false
Еще вариант округления в меньшую сторону путем знакового сдвига на 0 бит:
var num = 3.14;
console.assert(num >> 0 === 3);
console.assert(num << 0 === 3);
В коде:
~str.indexOf(«Корова») ?
console.log(‘Совпадений нет.’) :
console.log(‘Найдено совпадение.’);
кажется вы напутали
Спасибо, полезная статья!
Я как раз наткнулся на такие конструкции в чужом коде….