Откройте для себя функциональный 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