Получить n последних элементов массива
Метод массива slice() может принимать отрицательные целые числа, и при наличии он будет принимать значения с конца массива, а не с начала.
Метод массива 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]
👍9🔥2❤1
Автоматический биндинг в классах
Мы можем использовать стрелочную нотацию ES6 в методах класса, и при этом подразумевается привязка. Это сохраняет несколько строк кода в нашем конструкторе классов, и мы можем с радостью попрощаться с повторяющимися выражениями, такими как
this.myMethod = this.myMethod.bind(this)!
Мы можем использовать стрелочную нотацию 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>
</>
)
}
};
#классы👍4❤1🔥1
Обрезание массива
Если вы хотите удалить значения из конца массива деструктивно, есть более быстрые альтернативы, чем использование splice() .
Например, если вы знаете размер вашего исходного массива, вы можете переопределить его свойство length следующим образом:
Если вы хотите удалить значения из конца массива деструктивно, есть более быстрые альтернативы, чем использование splice() .
Например, если вы знаете размер вашего исходного массива, вы можете переопределить его свойство length следующим образом:
let array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];Это особенно краткое решение. Тем не менее, я обнаружил, что время выполнения slice() метода еще быстрее. Если ваша главная цель - скорость, подумайте об этом:
array.length = 4;
console.log(array); // Result: [0, 1, 2, 3]
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]
#массивы👍9
Получить n последних элементов массива
Метод массива slice() может принимать отрицательные целые числа, и при наличии он будет принимать значения с конца массива, а не с начала.
Метод массива 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]
👍7
Работа с аргументами функции
Вам не нужно определять параметры для функции. Вы можете просто использовать массиво-подобный объект функции
Вам не нужно определять параметры для функции. Вы можете просто использовать массиво-подобный объект функции
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
#аргументы👍6
Операторы === и !==
Всегда используйте
#операторы
Всегда используйте
===
и !==
вместо ==
и !=
.alert('' == '0'); //false
alert(0 == ''); // true
alert(0 =='0'); // true
==
не является транзитивным. Если вы используете ===
, то оно как и ожидалось будет возвращать false для всех вышеперечисленных случаев.#операторы
👍6
Функции в JavaScript
В частности функции могут быть переданы как параметры, например Array.filter() является функцией обратного вызова:
В частности функции могут быть переданы как параметры, например Array.filter() является функцией обратного вызова:
[1, 2, -1].filter(function(element, index, array) {Также вы можете объявить "private" функцию, которая существует только в области действия определенной функции:
return element > 0 }); // -> [1,2]
function PrintName() {
var privateFunction = function() {
return "Steve";
};
return privateFunction();
}
#функции👍6
Оператор in
Вы можете использовать оператор 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
#операторы👍2
Значения по умолчанию
Вы можете использовать оператор || в выражении присваивания для предоставления значения по умолчанию:
Это часто полезно в функциях, когда вы хотите присвоить значение по умолчанию аргументу в случае, если оно не указано:
Вы можете использовать оператор || в выражении присваивания для предоставления значения по умолчанию:
var a = b || c;Переменная a получит значение c только если b = false (то есть если null, false, undefined, 0, empty string, или NaN), иначе a получит значение b.
Это часто полезно в функциях, когда вы хотите присвоить значение по умолчанию аргументу в случае, если оно не указано:
function example(arg1) {
arg1 || (arg1 = 'default value');
}
#операторы👍8
Область действия в JavaScript
JavaScript не имеет области действия блока:
JavaScript не имеет области действия блока:
var x = 1;#общее
{ var x = 2; }
alert(x); // выводит 2
👍1
Свойства объекта
Вы можете получить доступ к свойствам объекта с помощью [] вместо '.'. Это позволяет найти свойство, которое соответствует переменной.
Вы можете получить доступ к свойствам объекта с помощью [] вместо '.'. Это позволяет найти свойство, которое соответствует переменной.
obj = {a:"test"};Также вы можете использовать это для получения/установки значения свойства, если его название неразрешенный идентификатор.
var propname = "a";
var b = obj[propname]; // "test"
obj["class"] = "test"; // class - зарезервированное слово; obj.class было бы недоступно.
obj["two words"] = "test2"; // использования оператора . невозможно с пробелом.
#объекты❤6👍1
mdc
Если вы пробовали гуглить что-нибудь по JavaScript на эту тему, то добавьте в запрос "mdc" тогда первые результаты будут от Mozilla Developer Center.
Например:
Google:
UPD: Mozilla Developer Center был переименован в Mozilla Developer Network. Ключевое слово "mdc" работает по-прежнему, но возможно вскоре нужно будет использовать "mdn".
#полезно
Если вы пробовали гуглить что-нибудь по JavaScript на эту тему, то добавьте в запрос "mdc" тогда первые результаты будут от Mozilla Developer Center.
Например:
Google:
javascript array sort mdc(в большинстве случаев можно исключить "javascript")
UPD: Mozilla Developer Center был переименован в Mozilla Developer Network. Ключевое слово "mdc" работает по-прежнему, но возможно вскоре нужно будет использовать "mdn".
#полезно
👍9
Замена IIFEs блоками
Проблема использования немедленно вызываемых функций, заключалась в том, что нужно было задавать значения переменным в пределах области функции. Теперь у нас есть возможность создавать блочные области, которые не ограничены исключительно функциональной областью.
Проблема использования немедленно вызываемых функций, заключалась в том, что нужно было задавать значения переменным в пределах области функции. Теперь у нас есть возможность создавать блочные области, которые не ограничены исключительно функциональной областью.
(function () {А теперь используем блочную область:
var food = 'Meow Mix';
}());
console.log(food); // Reference Error
{
let food = 'Meow Mix';
};
console.log(food); // Reference Error
#функции👍5
.includes( )
var string = 'food';Чтобы обозначить ограничение строки, мы можем просто использовать
var substring = 'foo';
console.log(string.indexOf(substring) > -1);
.includes()
, который вернет логическое значение, вместо проверки > -1
:const string = 'food';
const substring = 'foo';
console.log(string.includes(substring));
#методы👍2
.repeat( )
function repeat(string, count) {Теперь у нас есть доступ к реализации:
var strings = [];
while(strings.length < count) {
strings.push(string);
}
return strings.join('');
}
// String.repeat(numberOfRepetitions)
'meow'.repeat(3); // 'meowmeowmeow'
#функции👍5❤1🔥1
Литералы шаблонов в языке JavaScript
Используя литералы шаблонов, мы можем задавать строки со специальными символами, без необходимости их явного сокрытия.
Используя литералы шаблонов, мы можем задавать строки со специальными символами, без необходимости их явного сокрытия.
var text = "This string contains "double quotes" which are escaped.";Литералы шаблонов также поддерживают интерполяцию, что упрощает конкатенацию строк и значений:
let text = This string contains "double quotes" which don't need to be escaped anymore.;
var name = 'Tiger';Еще проще:
var age = 13;
console.log('My cat is named ' + name + ' and is ' + age + ' years old.');
const name = 'Tiger';
const age = 13;
console.log(My cat is named ${name} and is ${age} years old.);
#функции👍3
Деструктуризация
Деструктуризация позволяет нам извлекать значения из массивов или объектов и хранить их в переменных.
Деструктурированные массивы
Деструктуризация позволяет нам извлекать значения из массивов или объектов и хранить их в переменных.
Деструктурированные массивы
var arr = [1, 2, 3, 4];Деструктурированные объекты
var a = arr[0];
var b = arr[1];
var c = arr[2];
var d = arr[3];
let [a, b, c, d] = [1, 2, 3, 4];
console.log(a); // 1
console.log(b); // 2
var luke = { occupation: 'jedi', father: 'anakin' };
var occupation = luke.occupation; // 'jedi'
var father = luke.father; // 'anakin'
let luke = { occupation: 'jedi', father: 'anakin' };
let {occupation, father} = luke;
console.log(occupation); // 'jedi'
console.log(father); // 'anakin'
#объекты #массивы👍6
Модули в языке JavaScript
До ES6 мы использовали библиотеки, такие как Browserify, для создания модулей на стороне клиента. С ES6 мы можем напрямую использовать модули всех типов (AMD и CommonJS).
Экспорт в CommonJS
До ES6 мы использовали библиотеки, такие как Browserify, для создания модулей на стороне клиента. С ES6 мы можем напрямую использовать модули всех типов (AMD и CommonJS).
Экспорт в CommonJS
module.exports = 1;
module.exports = { foo: 'bar' };
module.exports = ['foo', 'bar'];
module.exports = function bar () {};
#модули🔥2
Оператор распространения
В ES5 мы могли найти максимальные значения в массиве, используя метод apply на Math.max следующим образом:
В ES5 мы могли найти максимальные значения в массиве, используя метод apply на Math.max следующим образом:
Math.max.apply(null, [-1, 100, 9001, -32]); // 9001В ES6 мы используется оператор распространения для передачи массива значений, которые выступают параметрами для функции:
Math.max(...[-1, 100, 9001, -32]); // 9001Мы можем легко конкатенировать литералы массивов:
let cities = ['San Francisco', 'Los Angeles'];#операторы
let places = ['Miami', ...cities, 'Chicago']; // ['Miami', 'San Francisco', 'Los Angeles', 'Chicago']
👍7
Symbol( )
Вызов Symbol () или Symbol (описание) создаст уникальный символ, который не может быть просмотрен глобально.
Вызов Symbol () или Symbol (описание) создаст уникальный символ, который не может быть просмотрен глобально.
const refreshComponent = Symbol();
React.Component.prototype[refreshComponent] = () => {
// делать что-нибудь
}
#функции👍2