
Содержание статьи
Откройте для себя функциональный JavaScript был назван одним из лучшие новые книги по функциональному программированию от BookAuthority!
JavaScript имеет примитивы, объекты и функции. Все они – ценности. Все рассматриваются как объекты, даже простые.
Примитивы
число, логическое значение, строка, undefined
и null
являются примитивами.
Номер
JavaScript имеет только один тип чисел — 64-разрядный двоичный тип с плавающей запятой. Арифметика десятичных чисел неточна.
Как вы уже знаете, 0.1 + 0.2
не делает 0.3
. Но с целыми числами арифметика точная, следовательно 1+2 === 3
.
Числа наследуют методы от Number.prototype
объект. Методы можно выделить по числам:
(123).toString(); //"123"
(1.23).toFixed(1); //"1.2"
Есть функции для преобразования строк в числа: Number.parseInt()
, Number.parseFloat()
и Number()
:
Number.parseInt("1") //1
Number.parseInt("text") //NaN
Number.parseFloat("1.234") //1.234
Number("1") //1
Number("1.234") //1.234
Недействительные арифметические операции или недействительные преобразования не создадут исключение, но приведут к NaN
Значение «не число». Number.isNaN()
может обнаружить NaN
.
The +
оператор может добавлять или объединять.
1 + 1 //2
"1" + "1" //"11"
1 + "1" //"11"
строка
Строка сохраняет серию символов Unicode. Текст может быть в двойных кавычках ""
или одинарные кавычки ''
.
Строки наследуют методы от String.prototype
. У них есть такие методы, как: substring()
, indexOf()
и concat()
.
"text".substring(1,3) //"ex"
"text".indexOf('x') //2
"text".concat(" end") //"text end"
Строки, как и все примитивы, неизменны. Например concat()
не изменяет существующую строку, а создает новую.
логическое значение
Логическое значение имеет два значения: true
и false
.
У него есть истинные и ложные ценности.false
, null
, undefined
, ''
(пустая строка), 0
и NaN
являются фальшивыми. Все остальные значения, включая все объекты, истинны.
Истинное значение оценивается как true
при исполнении в логическом контексте. Ошибочное значение оценивается как false
. Посмотрите на пример с отображением false
филиал.
let text="";
if(text) {
console.log("This is true");
} else {
console.log("This is false");
}
Оператор равенства есть ===
. Неровный оператор есть !==
.
Переменные
Переменные можно определить с помощью var
, let
и const
.
var
объявляет и по желанию инициализирует переменную. Сменные, объявленные с var
имеют область действия. Они рассматриваются как объявлено в верхней части функции. Это называется переменным подъемом.
The let
декларация имеет область блока.
Значение переменной, которое не инициализировано undefined
.
Сменная, объявлена with const
нельзя переназначить. Однако его значение все еще может изменяться. const
замораживает переменную, Object.freeze()
замораживающий объект. The const
декларация имеет область блока.
Объекты
Объект – динамическая коллекция свойств.
Ключ свойства является уникальной строчкой. Если в качестве ключа свойства используется не строка, он будет преобразован в строку. Значение свойства может быть примитивом, объектом или функцией.
Самый простой способ создать объект – использовать литерал объекта:
let obj = {
message : "A message",
doSomething : function() {}
}
Существует два способа доступа к свойствам: обозначение точками и обозначение в скобках. Мы можем читать, добавлять, редактировать и удалять свойства объекта в любое время.
- получить:
object.name
,object[expression]
- набор:
object.name = value,
object[expression] = value
- Удалить:
delete object.name
,delete object[expression]
let obj = {}; //create empty object
obj.message = "A message"; //add property
obj.message = "A new message"; //edit property
delete obj.message; //delete property
Объекты можно использовать в качестве карт. Простую карту можно создать с помощью Object.create(null)
:
let french = Object.create(null);
french["yes"] = "oui";
french["no"] = "non";
french["yes"];//"oui"
Все свойства объекта общедоступны. Object.keys()
можно использовать для преодоления всех свойств.
function logProperty(name){
console.log(name); //property name
console.log(obj[name]); //property value
}
Object.keys(obj).forEach(logProperty);
Object.assign()
копирует все свойства одного объекта на другой. Объект можно клонировать, скопировав все его свойства на пустой объект:
let book = { title: "The good parts" };
let clone = Object.assign({}, book);
Неизменный объект – это объект, который после создания не может быть изменен. Если вы хотите сделать объект неизменным, используйте Object.freeze()
.
Примитивы против объектов
Примитивы (кроме null
и undefined
) рассматриваются как объекты в том смысле, что они имеют методы, но не являются объектами.
Числа, строки и логические значения имеют обертки, эквивалентные объекту. Это такие Number
, String
и Boolean
функции.
Чтобы разрешить доступ к свойствам примитивов, JavaScript создает объект-обертку, а затем уничтожает его. Процесс создания и уничтожения объектов обертки оптимизирован JavaScript.
Примитивы неизменны, а объекты изменяются.
Массив
Массивы являются индексированными коллекциями значений. Каждое значение есть элемент. Элементы упорядочиваются и доступны по их индексному номеру.
JavaScript имеет объекты, подобные массиву. Массивы реализуются с помощью объектов. Индексы преобразуются в строки и используются в качестве имен для получения значений.
Простой массив типа let arr = ['A', 'B', 'C']
эмулируется с помощью такого объекта, как приведенный ниже:
{
'0': 'A',
'1': 'B',
'2': 'C'
}
Заметьте, что arr[1]
дает такое же значение, как arr['1']
: arr[1] === arr['1']
.
Удаление значений из массива with delete
оставит дыры. splice()
можно использовать, чтобы избежать проблемы, но это может быть медленным.
let arr = ['A', 'B', 'C'];
delete arr[1];
console.log(arr); // ['A', empty, 'C']
console.log(arr.length); // 3
Массивы JavaScript не создают исключений «индекс вне диапазона». Если индекс недоступен, он вернется. undefined
.
Стек и очередь можно легко реализовать с помощью методов массива:
let stack = [];
stack.push(1); // [1]
stack.push(2); // [1, 2]
let last = stack.pop(); // [1]
console.log(last); // 2
let queue = [];
queue.push(1); // [1]
queue.push(2); // [1, 2]
let first = queue.shift();//[2]
console.log(first); // 1
Функции
Функции являются самостоятельными единицами поведения.
Функции – это объекты. Функции можно назначать переменным, хранить в объектах или массивах, передавать в качестве аргумента другим функциям и возвращать из функций.
Существует три способа определения функции:
- Объявление функции (он же оператор функции)
- Выражение функции (он же Функциональный Литерал)
- Функция стрелки
Объявление функции
function
это первое ключевое слово в строке- оно должно иметь название
- его можно использовать перед определением. Объявление функций перемещается или «поднимается.”, к вершине их сферы применения.
function doSomething(){}
Выражение функции
function
это не первое ключевое слово в строке- имя необязательно. Может быть анонимное функциональное выражение или именуемое выражение функции.
- его нужно определить, затем он может выполняться
- он может выполняться автоматически после определения (так называется IIFE немедленно вызванное выражение функции)
let doSomething = function() {}
Функция стрелки
Функция стрелки – это сахарный синтаксис для создания анонимного выражения функции.
let doSomething = () => {};
Функции со стрелками не имеют своих собственных this
и arguments
.
Вызов функции
Функция, определенная с помощью function
ключевое слово, можно вызвать разными способами:
doSomething(arguments)
theObject.doSomething(arguments)
theObject["doSomething"](arguments)
new Constructor(arguments)
doSomething.apply(theObject, [arguments])
doSomething.call(theObject, arguments)
Функции можно вызвать с большим или меньшим количеством аргументов, чем объявлено в определении. Дополнительные аргументы будут игнорированы, а отсутствующие параметры будут установлены на undefined
.
Функции (кроме функций со стрелками) имеют два псевдопараметра: this
и arguments
.
это
Методы – это функции, хранящиеся в объектах. Функции независимы. Чтобы функция знала, над каким объектом работатьthis
используется. this
представляет контекст функции.
Нет смысла использовать this
когда функция вызывается в форме функции: doSomething()
. В этом случае this
есть undefined
или есть window
объекта в зависимости от того, включен строгий режим или нет.
Когда функция вызывается с методом form theObject.doSomething()
,this
представляет объект.
Когда функция используется как конструктор new Constructor()
, this
представляет только что созданный объект.
Значение this
можно установить с помощью apply()
или call()
:doSomething.apply(theObject)
. В этом случае this
это объект, отправленный как первый параметр метода.
Значение this
зависит от того, как была вызвана функция, а не от места определения функции. Это, конечно, является источником путаницы.
аргументы
The arguments
псевдопараметр предоставляет все аргументы, используемые при вызове. Это объект, похожий на массив, но не массив. В нем отсутствуют способы массива.
function log(message){
console.log(message);
}
function logAll(){
let args = Array.prototype.slice.call(arguments);
return args.forEach(log);
}
logAll("msg1", "msg2", "msg3");
Альтернативой новый синтаксис параметров отдыха. В этот раз args
является объектом массива.
function logAll(...args){
return args.forEach(log);
}
вернуться
Функция без return
заявление возвращает undefined
. Обратите внимание на автоматическую вставку точки с запятой при использовании return
. Следующая функция возвращает не пустой объект, а скорее an undefined
один.
function getObject(){
return
{
}
}
getObject()
Чтобы избежать проблемы, воспользуйтесь {
на той же линии, что return
:
function getObject(){
return {
}
}
Динамический ввод текста
JavaScript имеет динамический ввод. Значения имеют типы, переменные – нет. Типы могут изменяться при выполнении.
function log(value){
console.log(value);
}
log(1);
log("text");
log({message : "text"});
The typeof()
Оператор может проверить тип переменной.
let n = 1;
typeof(n); //number
let s = "text";
typeof(s); //string
let fn = function() {};
typeof(fn); //function
Одна нить
Основная среда выполнения JavaScript является однопоточной. Две функции не могут выполняться одновременно. Среда выполнения содержит очередь событий, в которой хранится список сообщений, подлежащих обработке. Нет условий для гонки, никаких тупиков. Однако код в очереди событий должен работать быстро. В противном случае браузер перестанет реагировать и попросит завершить задание.
Исключения
JavaScript имеет механизм обработки исключений. Он работает так, как вы могли ожидать, оборачивая код с помощью try/catch
заявление. Заявление имеет единственное catch
блок, обрабатывающий все исключения.
Приятно знать, что JavaScript иногда предпочитает тихие ошибки. Следующий код не создаст исключение, когда я попытаюсь изменить замороженный объект:
let obj = Object.freeze({});
obj.message = "text";
Строгий режим устраняет некоторые бесшумные ошибки JavaScript. "use strict";
включает строгий режим.
Шаблоны прототипов
Object.create()
функция конструктора и class
создавать объекты на базе прототипа системы.
Рассмотрим следующий пример:
let servicePrototype = {
doSomething : function() {}
}
let service = Object.create(servicePrototype);
console.log(service.__proto__ === servicePrototype); //true
Object.create()
строит новый объект service
который имеетservicePrototype
объект как его макет. Это означает, что doSomething()
доступен на service
объект. Это также означает, что __proto__
собственность service
указывает на servicePrototype
объект.
Давайте теперь построим подобный объект с помощью class
.
class Service {
doSomething(){}
}
let service = new Service();
console.log(service.__proto__ === Service.prototype);
Все методы, определенные в Service
класс будет добавлен вService.prototype
объект. Примеры Service
класс будет иметь тот же прототип (Service.prototype
) объект. Все экземпляры будут делегировать вызовы методов Service.prototype
объект. Методы определяются один разService.prototype
а затем наследуется всеми экземплярами.
Цепь прототипов
Объекты наследуются от других объектов. Каждый объект имеет макет и наследует от него свои характеристики. Прототип доступен из-за свойства «скрытый». __proto__
.
Когда вы спрашиваете свойство, которое объект не содержит, JavaScript будет просматривать цепочку прототипов, пока не найдет запрашиваемое свойство, или пока не достигнет конца цепочки.
Функциональные шаблоны
JavaScript имеет первоклассные функции и закрытия. Это концепции, открывающие путь к функциональному программированию в JavaScript. В результате возможны функции высшего порядка.
filter()
, map()
, reduce()
основным набором инструментов для работы с массивами в стиле функции.
filter()
выбирает значение из списка на основе предикатной функции, которая решает, какие значения следует сохранить.
map()
преобразует список значений в другой список значений с помощью функции отображения.
let numbers = [1,2,3,4,5,6];
function isEven(number){
return number % 2 === 0;
}
function doubleNumber(x){
return x*2;
}
let evenNumbers = numbers.filter(isEven);
//2 4 6
let doubleNumbers = numbers.map(doubleNumber);
//2 4 6 8 10 12
reduce()
Уменьшает список значений до одного значения.
function addNumber(total, value){
return total + value;
}
function sum(...args){
return args.reduce(addNumber, 0);
}
sum(1,2,3); //6
Замыкание — это внутренняя функция, которая имеет доступ к переменным родительским функциям даже после выполнения родительской функции. Посмотрите на следующий пример:
function createCount(){
let state = 0;
return function count(){
state += 1;
return state;
}
}
let count = createCount();
console.log(count()); //1
console.log(count()); //2
count()
является вложенной функцией. count()
получает доступ к переменной state
от своего отца. Он выживает после вызова родительской функции createCount()
.count()
является закрытием.
Функция высшего порядка – это функция, которая принимает другую функцию как вход, возвращает функцию или выполняет оба.
filter()
, map()
, reduce()
являются функциями высшего порядка.
Чистая функция – это функция, которая возвращает значение только на основе введенных данных. Чистые функции не используют переменные из внешних функций. Чистые функции не вызывают мутаций.
В предыдущих примерах isEven()
, doubleNumber()
, addNumber()
и sum()
являются чистыми функциями.
Вывод
Сила JavaScript состоит в его простоте.
Знание основ JavaScript улучшает понимание и использование языка.
Учитесь функциональный Reactна основе проекта, с Функциональная архитектура с React и Redux.
Откройте для себя функциональный JavaScript был назван одним из лучшие новые книги по функциональному программированию от BookAuthority!
Чтобы узнать больше о применении методов функционального программирования в React, посмотрите Функциональный React.
Подписывайтесь на Twitter