Синтаксис JavaScript

Фрагмент кода JavaScript с ключевыми словами, выделенными разными цветами.

Синтаксис . JavaScript — это набор правил, которые определяют правильно структурированную программу JavaScript

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

JavaScript В стандартной библиотеке отсутствует официальная стандартная функция вывода текста (за исключением document.write). Учитывая, что JavaScript в основном используется для написания сценариев на стороне клиента в современных веб-браузерах и что почти все веб-браузеры предоставляют функцию оповещения, alert также может быть использован, но обычно не используется.

Происхождение

Брендан Эйх резюмировал происхождение синтаксиса в первом параграфе спецификации JavaScript 1.1. следующее:

JavaScript заимствует большую часть своего синтаксиса из Java , но также наследует от Awk и Perl с некоторым косвенным влиянием Self в своей системе прототипов объектов.

Основы

Чувствительность к регистру

JavaScript чувствителен к регистру . Обычно имя конструктора начинается с заглавной буквы , а имя функции или переменной — со строчной.

Пример:

var a = 5;console.log(a); // 5console.log(A); // throws a ReferenceError: A is not defined

Пробелы и точки с запятой

В отличие от C , пробелы в исходном коде JavaScript могут напрямую влиять на семантику . Точки с запятой завершают операторы в JavaScript. Из-за автоматической вставки точки с запятой (ASI) некоторые операторы, которые правильно сформированы при анализе новой строки, будут считаться завершенными, как если бы точка с запятой была вставлена ​​непосредственно перед новой строкой. Некоторые авторитетные специалисты советуют явно указывать точку с запятой, завершающую оператор, поскольку это может уменьшить непреднамеренные последствия автоматической вставки точки с запятой.

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

Пять проблемных токенов — это открывающая скобка " (", открывающая скобка " [", слэш" /", плюс" +", и минус" -". Из них открывающая скобка часто встречается в шаблоне выражения функции, вызываемой непосредственно , а открывающая скобка встречается иногда, а другие встречаются довольно редко. Пример:

a = b + c(d + e).foo()// Treated as://  a = b + c(d + e).foo();

с предложением завершить предыдущий оператор точкой с запятой.

Некоторые предлагают вместо этого использовать точку с запятой в строках, начинающихся с ' (' или ' [', чтобы строка случайно не соединилась с предыдущей. Это называется защитной точкой с запятой и особенно рекомендуется, поскольку в противном случае код может стать неоднозначным при его перестановке. Например:

a = b + c;(d + e).foo()// Treated as://  a = b + c;//  (d + e).foo();

Начальные точки с запятой также иногда используются в начале библиотек JavaScript, если они добавляются к другой библиотеке, в которой отсутствует конечная точка с запятой, поскольку это может привести к неоднозначности исходного оператора.

Пять ограниченных постановок: return, throw, break, continueи пост-инкремент/декремент. Во всех случаях вставка точек с запятой не решает проблему, но делает анализируемый синтаксис понятным, что облегчает обнаружение ошибки. return и throw принять необязательное значение, в то время как break и continue возьмите дополнительную метку. Во всех случаях рекомендуется размещать значение или метку в той же строке, что и оператор. Чаще всего это проявляется в операторе return, где можно вернуть литерал большого объекта, который может быть случайно помещен в начало новой строки. Для пост-инкремента/декремента существует потенциальная неоднозначность с пре-инкрементом/декрементом, и снова рекомендуется просто хранить их в одной строке.

returna + b;// Returns undefined. Treated as://   return;//   a + b;// Should be written as://   return a + b;

Комментарии

Основная статья: Комментарий (компьютерное программирование)

Синтаксис комментариев такой же, как в C++ , Swift и многих других языках.

// a short, one-line comment/* this is a long, multi-line comment  about my script. May it one day  be great. *//* Comments /* may not be nested */ Syntax error */

Переменные

Основная статья: Переменная (программирование)

Переменные в стандартном JavaScript не имеют прикрепленного типа , поэтому любое значение (каждое значение имеет тип) может быть сохранено в любой переменной. Начиная с ES6 , шестой версии языка, переменные можно было объявлять с помощью var для переменных области действия функции и let или const которые предназначены для переменных уровня блока . До ES6 переменные можно было объявлять только с помощью var заявление. Значения, присвоенные переменным, объявленным с помощью const изменить нельзя, но можно изменить их свойства. var больше не следует использовать, поскольку let и const поддерживаются современными браузерами. переменной Идентификатор должен начинаться с буквы, подчеркивания ( _) или знак доллара ( $), а последующие символы также могут быть цифрами ( 0-9). JavaScript чувствителен к регистру, поэтому символы верхнего регистра от «A» до «Z» отличаются от символов нижнего регистра от «a» до «z».

Начиная с JavaScript 1.5, ISO 8859-1 или Unicode (или букв \uXXXX escape-последовательности Юникода) можно использовать в идентификаторах. В некоторых реализациях JavaScript знак (@) может использоваться в идентификаторе, но это противоречит спецификациям и не поддерживается в новых реализациях.

Обзор и подъем

Переменные, объявленные с помощью var на лексически ограничены функциональном уровне , а те, у которых let или const иметь область действия на уровне блока . Поскольку объявления обрабатываются до выполнения любого кода, переменную можно назначить и использовать до ее объявления в коде. Это называется hoisting , и это эквивалентно прямому объявлению переменных в верхней части функции или блока.

С var, let, и const заявления, поднимается только декларация; задания не поднимаются. Таким образом var x = 1 оператор в середине функции эквивалентен var x оператор объявления в верхней части функции и x = 1 оператор присваивания в этой точке в середине функции. Это означает, что к значениям нельзя получить доступ до их объявления; прямая ссылка невозможна. С var значение переменной undefined пока он не будет инициализирован. Переменные, объявленные с помощью let или const к ним невозможно получить доступ, пока они не будут инициализированы, поэтому обращение к таким переменным раньше приведет к ошибке.

Объявления функций, которые объявляют переменную и присваивают ей функцию, аналогичны операторам переменных, но помимо поднятия объявления они также поднимают присвоение – как если бы весь оператор находился в верхней части содержащей функции – и, таким образом, Также возможна прямая ссылка: расположение оператора функции внутри вмещающей функции не имеет значения. Это отличается от функционального выражения, присваиваемого переменной в var, let, или const заявление.

Так, например,

var func = function() { .. } // declaration is hoisted onlyfunction func() { .. } // declaration and assignment are hoisted

Ограничение области действия блока можно выполнить, обернув весь блок в функцию и затем выполнив ее (это называется шаблоном выражения функции с немедленным вызовом ) или путем объявления переменной с использованием let ключевое слово.

Декларация и поручение

Переменные, объявленные вне области видимости, являются глобальными . Если переменная объявлена ​​в более высокой области, к ней могут получить доступ дочерние области.

Когда JavaScript пытается разрешить идентификатор, он просматривает его в локальной области. Если этот идентификатор не найден, он ищет следующую внешнюю область и так далее по цепочке областей, пока не достигнет глобальной области , где находятся глобальные переменные. Если он все еще не найден, JavaScript выдаст ошибку. ReferenceError исключение.

При назначении идентификатора JavaScript выполняет точно такой же процесс для получения этого идентификатора, за исключением того, что если он не найден в глобальной области видимости , он создаст «переменную» в области, в которой он был создан. Как следствие, никогда не объявленная переменная будет глобальной, если она ей присвоена. Объявление переменной (с ключевым словом var) в глобальной области видимости (т.е. вне тела любой функции (или блока в случае let/const)), присвоение никогда не объявляемого идентификатора или добавление свойства к глобальному объекту (обычно window ) также создаст новую глобальную переменную.

JavaScript Обратите внимание, что строгий режим запрещает присвоение необъявленной переменной, что позволяет избежать загрязнения глобального пространства имен.

Примеры

Вот несколько примеров объявлений и области видимости переменных:

var x1 = 0; // A global variable, because it is not in any functionlet x2 = 0; // Also global, this time because it is not in any blockfunction f() {  var z = 'foxes', r = 'birds'; // 2 local variables  m = 'fish'; // global, because it wasn't declared anywhere before  function child() {    var r = 'monkeys'; // This variable is local and does not affect the "birds" r of the parent function.    z = 'penguins'; // Closure: Child function is able to access the variables of the parent function.  }  twenty = 20; // This variable is declared on the next line, but usable anywhere in the function, even before, as here  var twenty;  child();  return x1 + x2; // We can use x1 and x2 here, because they are global}f();console.log(z); // This line will raise a ReferenceError exception, because the value of z is no longer available

for (let i = 0; i < 10; i++) console.log(i);console.log(i); // throws a ReferenceError: i is not defined

for (const i = 0; i < 10; i++) console.log(i); // throws a TypeError: Assignment to constant variablefor (const i of [1,2,3]) console.log(i); //will not raise an exception. i is not reassigned but recreated in every iterationconst pi; // throws a SyntaxError: Missing initializer in const declaration

Примитивные типы данных

Основная статья: Примитивный тип данных

Язык JavaScript предоставляет шесть примитивных типов данных :

• Неопределенный
• Число
• БигИнт
• Нить
• логическое значение
• Символ

Некоторые из примитивных типов данных также предоставляют набор именованных значений, которые представляют собой границы типов. Эти именованные значения описаны в соответствующих разделах ниже.

Неопределенный

Основная статья: Неопределённое значение

Значение «неопределено» присваивается всем неинициализированным переменным , а также возвращается при проверке свойств объекта, которые не существуют. В логическом контексте неопределенное значение считается ложным значением.

Примечание: undefined считается настоящим примитивным типом. Если не преобразовано явно, неопределенное значение может вести себя неожиданно по сравнению с другими типами, которые в логическом контексте оцениваются как false.

let test;                         // variable declared, but not defined, ...                                  // ... set to value of undefinedconst testObj = {};console.log(test);                // test variable exists, but value not ...                                  // ... defined, displays undefinedconsole.log(testObj.myProp);      // testObj exists, property does not, ...                                  // ... displays undefinedconsole.log(undefined == null);   // unenforced type during check, displays trueconsole.log(undefined === null);  // enforce type during check, displays false

Примечание. Для неопределенного не существует встроенного языкового литерала. Таким образом (x === undefined) не является надежным способом проверить, является ли переменная неопределенной, поскольку в версиях до ECMAScript 5 кому-либо разрешено писать var undefined = "I'm defined now";. Более надежный подход заключается в сравнении с использованием (typeof x === 'undefined').

Подобные функции не будут работать должным образом:

function isUndefined(x) { let u; return x === u; }             // like this...function isUndefined(x) { return x === void 0; }               // ... or that second onefunction isUndefined(x) { return (typeof x) === "undefined"; } // ... or that third one

Вот, звоню isUndefined(my_var) поднимает вопрос Ошибка ссылки , если my_var — неизвестный идентификатор, тогда как typeof my_var === 'undefined' нет.

Число

Числа представлены в двоичном формате в виде IEEE 754 двойных чисел с плавающей запятой . Хотя этот формат обеспечивает точность почти 16 значащих цифр , он не всегда может точно представлять действительные числа, включая дроби.

Это становится проблемой при сравнении или форматировании чисел. Например:

console.log(0.2 + 0.1 === 0.3); // displays falseconsole.log(0.94 - 0.01);       // displays 0.9299999999999999

В результате такая процедура, как Метод toFixed() следует использовать для округления чисел всякий раз, когда они форматируются для вывода .

Числа могут быть указаны в любом из следующих обозначений:

345;    // an "integer", although there is only one numeric type in JavaScript34.5;   // a floating-point number3.45e2; // another floating-point, equivalent to 3450b1011; // a binary integer equal to 110o377;   // an octal integer equal to 2550xFF;   // a hexadecimal integer equal to 255, digits represented by the ...        // ... letters A-F may be upper or lowercase

Также есть числовой разделитель, _ (подчеркивание), представленное в ES2021:

// Note: Wikipedia syntax doesn't support numeric separators yet1_000_000_000;    // Used with big numbers1_000_000.5;      // Support with decimals1_000e1_000;      // Support with exponents// Support with binary, octals and hex0b0000_0000_0101_1011;0o0001_3520_0237_1327;0xFFFF_FFFF_FFFF_FFFE;// But you can't use them next to a non-digit number part, or at the start or end_12; // Variable is not defined (the underscore makes it a variable identifier)12_; // Syntax error (cannot be at the end of numbers)12_.0; // Syntax error (doesn't make sense to put a separator next to the decimal point)12._0; // Syntax error12e_6; // Syntax error (next to "e", a non-digit. Doesn't make sense to put a separator at the start)1000____0000; // Syntax error (next to "_", a non-digit. Only 1 separator at a time is allowed

Экстенты +∞ , −∞ и NaN (не число) числового типа можно получить с помощью двух программных выражений:

Infinity; // positive infinity (negative obtained with -Infinity for instance)NaN;      // The Not-A-Number value, also returned as a failure in ...          // ... string-to-number conversions

Бесконечность и NaN — числа:

typeof Infinity;   // returns "number"typeof NaN;        // returns "number"

Эти три специальных значения соответствуют и ведут себя так, как их описывает IEEE-754 .

Конструктор Number (используемый как функция) или унарный + или - может использоваться для выполнения явного числового преобразования:

const myString = "123.456";const myNumber1 = Number(myString);const myNumber2 = +myString;

При использовании в качестве конструктора оболочка создается числовой объект- (хотя от него мало пользы):

const myNumericWrapper = new Number(123.456);

Однако NaN не равен самому себе:

const nan = NaN;console.log(NaN == NaN);        // falseconsole.log(NaN === NaN);       // falseconsole.log(NaN !== NaN);       // trueconsole.log(nan !== nan);       // true// You can use the isNaN methods to check for NaNconsole.log(isNaN("converted to NaN"));     // trueconsole.log(isNaN(NaN));                    // trueconsole.log(Number.isNaN("not converted")); // falseconsole.log(Number.isNaN(NaN));             // true

БигИнт

BigInts можно использовать для произвольно больших целых чисел . Особенно целые числа больше 2. ⁵³ - 1, которое является наибольшим числом, которое JavaScript может надежно представить с помощью примитива Number и представлено константой Number.MAX_SAFE_INTEGER.

При делении BigInts результаты усекаются .

Нить

Строка в JavaScript — это последовательность символов. В JavaScript строки можно создавать напрямую (как литералы), помещая последовательность символов в двойные (") или одинарные (') кавычки. Такие строки должны быть записаны в одной строке, но могут включать экранированные символы новой строки (например, \ n). Стандарт JavaScript позволяет использовать символ обратной кавычки (`, он же серьезный акцент или обратный кавычек) для кавычек многострочных литеральных строк, а также литералов шаблонов, которые допускают интерполяцию вычисляемых выражений с принудительным типом внутри строки.

const greeting = "Hello, World!";const anotherGreeting = 'Greetings, people of Earth.';const aMultilineGreeting = `Warm regards,John Doe.`// Template literals type-coerce evaluated expressions and interpolate them into the string.const templateLiteral = `This is what is stored in anotherGreeting: ${anotherGreeting}.`;console.log(templateLiteral); // 'This is what is stored in anotherGreeting: 'Greetings, people of Earth.''

Доступ к отдельным символам внутри строки можно получить с помощью charAt метод (предоставленный String.prototype ). Это предпочтительный способ доступа к отдельным символам внутри строки, поскольку он также работает в несовременных браузерах:

const h = greeting.charAt(0);

В современных браузерах доступ к отдельным символам внутри строки (как к строкам, состоящим только из одного символа) можно получить с помощью тех же обозначений, что и к массивам:

const h = greeting[0];

Однако строки JavaScript неизменяемы :

greeting[0] = "H"; // Fails.

Применение оператора равенства ("==") к двум строкам возвращает true, если строки имеют одинаковое содержимое, что означает: одинаковую длину и содержащую одинаковую последовательность символов (для алфавитов важен регистр). Таким образом:

const x = "World";const compare1 = ("Hello, " + x == "Hello, World"); // Here compare1 contains true.const compare2 = ("Hello, " + x == "hello, World"); // Here compare2 contains  ...                                                    // ... false since the ...                                                    // ... first characters ...                                                    // ... of both operands ...                                                    // ... are not of the same case.

Кавычки одного типа не могут быть вложенными, если они не экранированы .

let x = '"Hello, World!" he said.'; // Just fine.x = ""Hello, World!" he said."; //  Not good.x = "\"Hello, World!\" he said."; // Works by escaping " with \"

The Конструктор String создает строковый объект (объект, обертывающий строку):

const greeting = new String("Hello, World!");

Эти объекты имеют valueOf , возвращающий примитивную строку, заключенную в них:

const s = new String("Hello !");typeof s; // Is 'object'.typeof s.valueOf(); // Is 'string'.

Равенство между двумя Строковые объекты ведут себя не так, как строковые примитивы:

const s1 = new String("Hello !");const s2 = new String("Hello !");s1 == s2; // Is false, because they are two distinct objects.s1.valueOf() == s2.valueOf(); // Is true.

логическое значение

JavaScript предоставляет логический тип данных с правда и ложные литералы. Оператор typeof возвращает строку «логическое» для этих примитивных типов . При использовании в логическом контексте 0 , -0 , нулевой , НЭН , undefined и пустая строка ( "" ) оценить как false из-за автоматического преобразования типов . Все остальные значения ( дополняющие предыдущий список) оцениваются как true , включая строки "0" , «ложь» и любой объект.

Преобразование типов

Автоматическое приведение типов с помощью операторов сравнения на равенство ( == и !=) можно избежать, используя операторы сравнения с проверкой типа ( === и !==).

Когда требуется преобразование типов, JavaScript преобразует Логическое значение , Число , Строка или Операнды объекта следующие:

Число и строка

Строка преобразуется в числовое значение. JavaScript пытается преобразовать строковый числовой литерал в значение числового типа. Во-первых, математическое значение получается из строкового числового литерала. Затем это значение округляется до ближайшего значения числового типа.

логическое значение

Если один из операндов является логическим, логический операнд преобразуется в 1, если он true или 0, если это так ЛОЖЬ .

Объект

Если объект сравнивается с числом или строкой, JavaScript пытается вернуть значение по умолчанию для объекта. Объект преобразуется в примитивное строковое или числовое значение с помощью метода .valueOf() или .toString() методы объекта. Если это не удается, генерируется ошибка времени выполнения.

Дуглас Крокфорд защищает термины « истинный » и « ложный » для описания того, как значения различных типов ведут себя при оценке в логическом контексте, особенно в отношении крайних случаев. Бинарные логические операторы возвращали логическое значение в ранних версиях JavaScript, но теперь вместо этого они возвращают один из операндов. Возвращается левый операнд, если его можно оценить как: false , в случае соединения : ( a && b), или верно , в случае дизъюнкции : ( a || b); в противном случае возвращается правый операнд. Автоматическое приведение типов с помощью операторов сравнения может отличаться для случаев смешанных логических и числовых операндов (включая строки, которые могут быть оценены как числа, или объекты, которые могут быть оценены как такие строки), поскольку логический операнд будет сравниваться как числовое значение. Это может быть неожиданно. Выражение можно явно привести к логическому примитиву, удвоив оператор логического отрицания : ( !! ), используя Boolean() или с помощью условного оператора : ( c ? t : f).

// Automatic type coercionconsole.log(true  ==   2 ); // false... true  → 1 !== 2 ←  2console.log(false ==   2 ); // false... false → 0 !== 2 ←  2console.log(true  ==   1 ); // true.... true  → 1 === 1 ←  1console.log(false ==   0 ); // true.... false → 0 === 0 ←  0console.log(true  ==  "2"); // false... true  → 1 !== 2 ← "2"console.log(false ==  "2"); // false... false → 0 !== 2 ← "2"console.log(true  ==  "1"); // true.... true  → 1 === 1 ← "1"console.log(false ==  "0"); // true.... false → 0 === 0 ← "0"console.log(false ==  "" ); // true.... false → 0 === 0 ← ""console.log(false ==  NaN); // false... false → 0 !== NaNconsole.log(NaN == NaN); // false...... NaN is not equivalent to anything, including NaN.// Type checked comparison (no conversion of types and values)console.log(true === 1); // false...... data types do not match// Explicit type coercionconsole.log(true === !!2);   // true.... data types and values matchconsole.log(true === !!0);   // false... data types match, but values differconsole.log( 1  ? true : false); // true.... only ±0 and NaN are "falsy" numbersconsole.log("0" ? true : false); // true.... only the empty string is "falsy"console.log(Boolean({}));    // true.... all objects are "truthy"

Оператор new можно использовать для создания оболочки объекта для логического примитива. Однако оператор typeof не возвращает логическое значение для оболочки объекта, оно возвращает объект . Поскольку все объекты оцениваются как правда , такой метод, как .valueOf() или .toString() необходимо использовать для получения завернутого значения. Для явного приведения к логическому типу Mozilla рекомендует использовать Boolean() (без Функция new ) предпочтительнее использовать логический объект.

const b = new Boolean(false);   // Object  false {}const t = Boolean(b);           // Boolean trueconst f = Boolean(b.valueOf()); // Boolean falselet n = new Boolean(b);       // Not recommendedn = new Boolean(b.valueOf()); // Preferredif (0 || -0 || "" || null || undefined || b.valueOf() || !new Boolean() || !t) {  console.log("Never this");} else if ([] && {} && b && typeof b === "object" && b.toString() === "false") {  console.log("Always this");}

Символ

Новое в ECMAScript6. Символ — это уникальный и неизменяемый идентификатор.

Пример:

let x = Symbol(1);const y = Symbol(1);x === y; // => falseconst symbolObject = {};const normalObject = {};// since x and y are unique,// they can be used as unique keys in an objectsymbolObject[x] = 1;symbolObject[y] = 2;symbolObject[x]; // => 1symbolObject[y]; // => 2// as compared to normal numeric keysnormalObject[1] = 1;normalObject[1] = 2; // overrides the value of 1normalObject[1]; // => 2// changing the value of x does not change the key stored in the objectx = Symbol(3);symbolObject[x]; // => undefined// changing x back just creates another unique Symbolx = Symbol(1);symbolObject[x]; // => undefined

Есть также хорошо известные символы .

Один из которых Symbol.iterator; если что-то реализуется Symbol.iterator, это итеративно:

const x = [1, 2, 3, 4]; // x is an Arrayx[Symbol.iterator] === Array.prototype[Symbol.iterator]; // and Arrays are iterableconst xIterator = x[Symbol.iterator](); // The [Symbol.iterator] function should provide an iterator for xxIterator.next(); // { value: 1, done: false }xIterator.next(); // { value: 2, done: false }xIterator.next(); // { value: 3, done: false }xIterator.next(); // { value: 4, done: false }xIterator.next(); // { value: undefined, done: true }xIterator.next(); // { value: undefined, done: true }// for..of loops automatically iterate valuesfor (const value of x) {   console.log(value); // 1 2 3 4}// Sets are also iterable:[Symbol.iterator] in Set.prototype; // truefor (const value of new Set(['apple', 'orange'])) {   console.log(value); // "apple" "orange"}

Нативные объекты

Язык JavaScript предоставляет несколько собственных объектов . Собственные объекты JavaScript считаются частью спецификации JavaScript. Несмотря на среду JavaScript, этот набор объектов всегда должен быть доступен.

Множество

Основная статья: Тип данных массива

Массив — это объект JavaScript, прототип которого взят из Array конструктор, специально предназначенный для хранения значений данных, индексированных целочисленными ключами. Массивы, в отличие от базового типа Object, имеют методы и свойства, помогающие программисту выполнять рутинные задачи (например, join, slice, и push).

Как и в семействе C , в массивах используется схема индексации с отсчетом от нуля: значение, которое вставляется в пустой массив с помощью push метод занимает 0-й индекс массива.

const myArray = [];          // Point the variable myArray to a newly ...                             // ... created, empty ArraymyArray.push("hello World"); // Fill the next empty index, in this case 0console.log(myArray[0]);     // Equivalent to console.log("hello World");

Массивы имеют length свойство, которое гарантированно всегда будет больше, чем наибольший целочисленный индекс, используемый в массиве. Он автоматически обновляется, если создать свойство с еще большим индексом. Записывая меньшее число в length свойство удалит более крупные индексы.

Элементы ArrayДоступ к s можно получить, используя обычную нотацию доступа к свойствам объекта:

myArray[1];  // the 2nd item in myArraymyArray["1"];

Вышеуказанные два эквивалентны. Невозможно использовать «точечную» запись или строки с альтернативными представлениями числа:

myArray.1;     // syntax errormyArray["01"]; // not the same as myArray[1]

В объявлении массива можно использовать либо Array буквально или Array конструктор:

let myArray;// Array literalsmyArray = [1, 2]; // length of 2myArray = [1, 2,]; // same array - You can also have an extra comma at the end// It's also possible to not fill in parts of the arraymyArray = [0, 1, /* hole */, /* hole */, 4, 5]; // length of 6myArray = [0, 1, /* hole */, /* hole */, 4, 5,]; // same arraymyArray = [0, 1, /* hole */, /* hole */, 4, 5, /* hole */,]; // length of 7// With the constructormyArray = new Array(0, 1, 2, 3, 4, 5); // length of 6myArray = new Array(365);              // an empty array with length 365

Массивы реализованы таким образом, что только определенные элементы используют память; они представляют собой « разреженные массивы ». Параметр myArray[10] = 'someThing' и myArray[57] = 'somethingOther' использует пространство только для этих двух элементов, как и любой другой объект. length часть массива по-прежнему будет равна 58. Максимальная длина массива равна 4 294 967 295, что соответствует 32-битному двоичному числу (111111111111111111111111111111111) ₂ .

Литерал объявления объекта можно использовать для создания объектов, которые ведут себя во многом подобно ассоциативным массивам в других языках:

const dog = {color: "brown", size: "large"};dog["color"]; // results in "brown"dog.color;    // also results in "brown"

Литералы объявления объектов и массивов можно использовать для быстрого создания ассоциативных, многомерных или того и другого массивов. (Технически JavaScript не поддерживает многомерные массивы, но их можно имитировать с помощью массивов массивов.)

const cats = [{color: "brown", size: "large"},    {color: "black", size: "small"}];cats[0]["size"];      // results in "large"const dogs = {rover: {color: "brown", size: "large"},    spot: {color: "black", size: "small"}};dogs["spot"]["size"]; // results in "small"dogs.rover.color;     // results in "brown"

Дата

А Date объект хранит число миллисекунд со знаком, где ноль представляет 1970-01-01 00:00:00 UT и диапазон ±10. ⁸ дни. Существует несколько способов аргументации Date конструктор. Обратите внимание, что месяцы отсчитываются от нуля.

new Date();                       // create a new Date instance representing the current time/date.new Date(2010, 2, 1);             // create a new Date instance representing 2010-Mar-01 00:00:00new Date(2010, 2, 1, 14, 25, 30); // create a new Date instance representing 2010-Mar-01 14:25:30new Date("2010-3-1 14:25:30");    // create a new Date instance from a String.

Предоставляются методы для извлечения полей, а также полезная toString:

const d = new Date(2010, 2, 1, 14, 25, 30); // 2010-Mar-01 14:25:30;// Displays '2010-3-1 14:25:30':console.log(d.getFullYear() + '-' + (d.getMonth() + 1) + '-' + d.getDate() + ' '    + d.getHours() + ':' + d.getMinutes() + ':' + d.getSeconds());// Built-in toString returns something like 'Mon Mar 01 2010 14:25:30 GMT-0500 (EST)':console.log(d);

Ошибка

Пользовательские сообщения об ошибках могут быть созданы с помощью Error сорт:

throw new Error("Something went wrong.");

Их можно перехватить с помощью блоков try...catch...finally, как описано в разделе об обработке исключений .

Математика

The Объект Math содержит различные константы, связанные с математикой (например, π ) и функции (например, косинус). (Обратите внимание, что Math объект не имеет конструктора, в отличие от Массив или Дата . Все его методы являются «статическими», то есть методами «класса». Все тригонометрические функции используют углы, выраженные в радианах , а не в градусах или градусах .

Некоторые константы, содержащиеся в объекте Math

Свойство	Возвращаемое значение округлено до 5 цифр	Описание
Математика.Э	2.7183	e : основание натурального логарифма.
Тип.LN2	0.69315	Натуральный логарифм 2
Хорошо.LN10	2.3026	Натуральный логарифм 10
Math.LOG2E	1.4427	Логарифм по основанию 2 от e
Мат.LOG10E	0.43429	Логарифм по основанию 10 от e
Матем.ПИ	3.14159	π : длина окружности/диаметр круга.
Математика.SQRT1_2	0.70711	Квадратный корень из ½
Математика.SQRT2	1.4142	Квадратный корень из 2

Методы объекта Math

Пример	Возвращаемое значение округлено до 5 цифр	Описание
Мат.abs(-2.3)	2.3	Абсолютное значение
Math.acos(Math.SQRT1_2)	0,78540 рад = 45°	Арккосинус
Math.asin(Math.SQRT1_2)	0,78540 рад = 45°	Арксинус
Мат.атан(1)	0,78540 рад = 45°	полукруга Арктангенс ( ⁠ $-\pi /2$от ⁠ до ⁠ $+\pi /2$⁠ )
Мат.атан2(-3,7, -3,7)	-2,3562 рад = -135°	Арктангенс целого круга ( ⁠ $-\pi$от ⁠ до ⁠ $+\pi$⁠ )
Мат.cel(1.1)	2	Потолок: округлить до наименьшего целого числа ≥ аргумента.
Math.cos(Math.PI/4)	0.70711	Косинус
Мат.эксп(1)	2.7183	Показательная функция : e, возведенная в эту степень
Мат.пол(1.9)	1	Этаж: округление до наибольшего целого числа ≤ аргумента
Math.log(Math.E)	1	Натуральный логарифм по основанию e
Мат.макс(1, -2)	1	Максимум: (х > у) ? х: у
Мат.мин(1, -2)	−2	Минимум: (х <у)? х: у
Math.pow(-3, 2)	9	Возведение в степень (возведенное в степень): Math.pow(x, y) дает x и
Мат.случайный()	например 0,17068	Псевдослучайное число от 0 (включительно) до 1 (исключительно).
Мат.раунд(1.5)	2	Округлить до ближайшего целого числа; половинные дроби округляются в большую сторону (например, 1,5 округляются до 2)
Math.sin(Math.PI/4)	0.70711	Его
Мат.кв.(49)	7	Квадратный корень
Math.tan(Math.PI/4)	1	Касательная

Регулярное выражение

Основная статья: Регулярное выражение

/expression/.test(string);     // returns Boolean"string".search(/expression/); // returns position Number"string".replace(/expression/, replacement);// Here are some examplesif (/Tom/.test("My name is Tom")) console.log("Hello Tom!");console.log("My name is Tom".search(/Tom/));          // == 11 (letters before Tom)console.log("My name is Tom".replace(/Tom/, "John")); // == "My name is John"

Классы персонажей

// \d  - digit// \D  - non digit// \s  - space// \S  - non space// \w  - word char// \W  - non word// [ ] - one of// [^] - one not of//  -  - rangeif (/\d/.test('0'))                   console.log('Digit');if (/[0-9]/.test('6'))                console.log('Digit');if (/[13579]/.test('1'))              console.log('Odd number');if (/\S\S\s\S\S\S\S/.test('My name')) console.log('Format OK');if (/\w\w\w/.test('Tom'))             console.log('Hello Tom');if (/[a-zA-Z]/.test('B'))             console.log('Letter');

Соответствие символов

// A...Z a...z 0...9  - alphanumeric// \u0000...\uFFFF    - Unicode hexadecimal// \x00...\xFF        - ASCII hexadecimal// \t                 - tab// \n                 - new line// \r                 - CR// .                  - any character// |                  - ORif (/T.m/.test('Tom')) console.log ('Hi Tom, Tam or Tim');if (/A|B/.test("A"))  console.log ('A or B');

Ретрансляторы

// ?   - 0 or 1 match// *   - 0 or more// +   - 1 or more// {n}   - exactly n// {n,}  - n or more// {0,n} - n or less// {n,m} - range n to mif (/ab?c/.test("ac"))       console.log("OK"); // match: "ac", "abc"if (/ab*c/.test("ac"))       console.log("OK"); // match: "ac", "abc", "abbc", "abbbc" etc.if (/ab+c/.test("abc"))      console.log("OK"); // match: "abc", "abbc", "abbbc" etc.if (/ab{3}c/.test("abbbc"))  console.log("OK"); // match: "abbbc"if (/ab{3,}c/.test("abbbc")) console.log("OK"); // match: "abbbc", "abbbbc", "abbbbbc" etc.if (/ab{1,3}c/.test("abc"))  console.log("OK"); // match: "abc", "abbc", "abbbc"

Якоря

// ^  - string starts with// $  - string ends withif (/^My/.test("My name is Tom"))   console.log ("Hi!");if (/Tom$/.test("My name is Tom"))  console.log ("Hi Tom!");

Подвыражение

// ( )  - groups charactersif (/water(mark)?/.test("watermark")) console.log("Here is water!"); // match: "water", "watermark",if (/(Tom)|(John)/.test("John"))      console.log("Hi Tom or John!");

Флаги

// /g  - global// /i  - ignore upper/lower case// /m  - allow matches to span multiple linesconsole.log("hi tom!".replace(/Tom/i, "John"));  // == "hi John!"console.log("ratatam".replace(/ta/, "tu"));      // == "ratutam"console.log("ratatam".replace(/ta/g, "tu"));     // == "ratutum"

Расширенные методы

my_array = my_string.split(my_delimiter);// examplemy_array = "dog,cat,cow".split(",");      // my_array==["dog","cat","cow"];my_array = my_string.match(my_expression);// examplemy_array = "We start at 11:30, 12:15 and 16:45".match(/\d\d:\d\d/g); // my_array==["11:30","12:15","16:45"];

Группы захвата

const myRe = /(\d{4}-\d{2}-\d{2}) (\d{2}:\d{2}:\d{2})/;const results = myRe.exec("The date and time are 2009-09-08 09:37:08.");if (results) {  console.log("Matched: " + results[0]); // Entire match  const my_date = results[1]; // First group == "2009-09-08"  const my_time = results[2]; // Second group == "09:37:08"  console.log(`It is ${my_time} on ${my_date}`);} else console.log("Did not find a valid date!");

Функция

Каждая функция в JavaScript является экземпляром Function конструктор:

// x, y is the argument. 'return x + y' is the function body, which is the last in the argument list.const add = new Function('x', 'y', 'return x + y');add(1, 2); // => 3

Приведенную выше функцию добавления также можно определить с помощью функционального выражения:

const add = function(x, y) {  return x + y;};add(1, 2); // => 3

В ES6 был добавлен синтаксис стрелочных функций, что позволяет функциям, возвращающим значение, быть более краткими. Они также сохраняют this глобального объекта вместо того, чтобы наследовать его от того, откуда он был вызван/как он был вызван, в отличие от function() {} выражение.

const add = (x, y) => {return x + y;};// values can also be implicitly returned (i.e. no return statement is needed)const addImplicit = (x, y) => x + y;add(1, 2); // => 3addImplicit(1, 2) // => 3

Для функций, которые необходимо поднять, есть отдельное выражение:

function add(x, y) {  return x + y;}add(1, 2); // => 3

Подъем позволяет использовать функцию до ее «объявления»:

add(1, 2); // => 3, not a ReferenceErrorfunction add(x, y) {  return x + y;}

Экземпляр функции имеет свойства и методы.

function subtract(x, y) {  return x - y;}console.log(subtract.length); // => 2, arity of the function (number of arguments)console.log(subtract.toString());/*"function subtract(x, y) {  return x - y;}"*/

Операторы

Оператор «+» перегружен : он используется для объединения строк и арифметического сложения. Это может вызвать проблемы при случайном смешивании строк и чисел. Как унарный оператор, он может преобразовать числовую строку в число.

// Concatenate 2 stringsconsole.log('He' + 'llo'); // displays Hello// Add two numbersconsole.log(2 + 6);  // displays 8// Adding a number and a string results in concatenation (from left to right)console.log(2 + '2');    // displays 22console.log('$' + 3 + 4);  // displays $34, but $7 may have been expectedconsole.log('$' + (3 + 4)); // displays $7console.log(3 + 4 + '7'); // displays 77, numbers stay numbers until a string is added// Convert a string to a number using the unary plusconsole.log(+'2' === 2); // displays trueconsole.log(+'Hello'); // displays NaN

Аналогичным образом перегружен оператор «*»: он может преобразовать строку в число.

console.log(2 + '6'*1);  // displays 8console.log(3*'7'); // 21console.log('3'*'7'); // 21console.log('hello'*'world'); // displays NaN

Арифметика

JavaScript поддерживает следующие операторы двоичной арифметики :

+	добавление
-	вычитание
*	умножение
/	деление (возвращает значение с плавающей запятой)
%	по модулю (возвращает остаток)
**	возведение в степень

JavaScript поддерживает следующие унарные арифметические операторы :

+	унарное преобразование строки в число
-	унарное отрицание (меняет знак)
++	приращение (может быть префиксным или постфиксным)
--	декремент (может быть префиксным или постфиксным)

let x = 1;console.log(++x); // x becomes 2; displays 2console.log(x++); // displays 2; x becomes 3console.log(x);  // x is 3; displays 3console.log(x--); //  displays 3; x becomes 2console.log(x);  //  displays 2; x is 2console.log(--x); //  x becomes 1; displays 1

Оператор modulo отображает остаток от деления на модуль. Если используются отрицательные числа, возвращаемое значение зависит от операнда.

const x = 17;console.log(x%5); // displays 2console.log(x%6); // displays 5console.log(-x%5); // displays -2console.log(-x%-5); // displays -2console.log(x%-5); // displays 2

Чтобы всегда возвращать неотрицательное число, повторно добавьте модуль и снова примените оператор модуля:

const x = 17;console.log((-x%5+5)%5); // displays 3

Вы также можете сделать:

const x = 17;console.log(Math.abs(-x%5)); // also 3

Назначение

=	назначать
+=	добавить и назначить
-=	вычесть и присвоить
*=	умножить и присвоить
/=	раздели и назначь
%=	по модулю и присвоить
**=	возведение в степень и присвоение

Присвоение примитивных типов

let x = 9;x += 1; console.log(x); // displays: 10x *= 30;console.log(x); // displays: 300x /= 6;console.log(x); // displays: 50x -= 3;console.log(x); // displays: 47x %= 7;console.log(x); // displays: 5

Назначение типов объектов

/** * To learn JavaScript objects... */const object_1 = {a: 1};		// assign reference of newly created object to object_1let object_2 = {a: 0};let object_3 = object_2;	    // object_3 references the same object as object_2 does	 object_3.a = 2;message();	        	// displays 1 2 2	 object_2 = object_1;		// object_2 now references the same object as object_1	        	        // object_3 still references what object_2 referenced beforemessage();		        // displays 1 1 2	 object_2.a = 7;  	        // modifies object_1message();		        // displays 7 7 2object_3.a = 5;                 // object_3 doesn't change object_2message();	                // displays 7 7 5object_3 = object_2;	object_3.a=4;                  // object_3 changes object_1 and object_2message();                     // displays 4 4 4/** * Prints the console.log message */function message() {	console.log(object_1.a + " " + object_2.a + " " + object_3.a);}

Деструктуризация задания

В JavaScript Mozilla, начиная с версии 1.7, деструктурирующее присваивание позволяет присваивать части структур данных нескольким переменным одновременно. Левая часть присваивания представляет собой шаблон, напоминающий произвольно вложенный литерал объекта/массива, содержащий значения l-l в своих листьях, которые должны получить подструктуры присвоенного значения.

let a, b, c, d, e;[a, b, c] = [3, 4, 5];console.log(`${a},${b},${c}`); // displays: 3,4,5e = {foo: 5, bar: 6, baz: ['Baz', 'Content']};const arr = [];({baz: [arr[0], arr[3]], foo: a, bar: b} = e);console.log(`${a},${b},${arr}`);	// displays: 5,6,Baz,,,Content[a, b] = [b, a];		// swap contents of a and bconsole.log(a + ',' + b);		// displays: 6,5[a, b, c] = [3, 4, 5]; // permutations[a, b, c] = [b, c, a];console.log(`${a},${b},${c}`); // displays: 4,5,3

Оператор распространения/остановки

Стандарт ECMAScript 2015 представил « ..." оператор массива, для связанных понятий "расширенного синтаксиса" и «параметры покоя». Распространение объектов было добавлено в ECMAScript 2018.

Синтаксис расширения предоставляет еще один способ деструктуризации массивов и объектов. Для массивов это указывает, что элементы следует использовать в качестве параметров при вызове функции или элементов в литерале массива. Для объектов его можно использовать для объединения объектов или переопределения свойств.

Другими словами, " ..."превращает" [...foo]" в " [foo[0], foo[1], foo[2]]", и " this.bar(...foo);" в " this.bar(foo[0], foo[1], foo[2]);", и " { ...bar }" в { prop: bar.prop, prop2: bar.prop2 }.

const a = [1, 2, 3, 4];// It can be used multiple times in the same expressionconst b = [...a, ...a]; // b = [1, 2, 3, 4, 1, 2, 3, 4];// It can be combined with non-spread items.const c = [5, 6, ...a, 7, 9]; // c = [5, 6, 1, 2, 3, 4, 7, 9];// For comparison, doing this without the spread operator // creates a nested array.const d = [a, a]; // d = [[1, 2, 3, 4], [1, 2, 3, 4]]// It works the same with function callsfunction foo(arg1, arg2, arg3) {    console.log(`${arg1}:${arg2}:${arg3}`);}// You can use it even if it passes more parameters than the function will usefoo(...a); // "1:2:3" → foo(a[0], a[1], a[2], a[3]);// You can mix it with non-spread parametersfoo(5, ...a, 6); // "5:1:2" → foo(5, a[0], a[1], a[2], a[3], 6);// For comparison, doing this without the spread operator// assigns the array to arg1, and nothing to the other parameters.foo(a); // "1,2,3,4:undefined:undefined"const bar = { a: 1, b: 2, c: 3 };// This would copy the objectconst copy = { ...bar }; // copy = { a: 1, b: 2, c: 3 };// "b" would be overridden hereconst override = { ...bar, b: 4 }; // override = { a: 1, c: 3, b: 4 }

Когда ... используется в объявлении функции и указывает на оставшийся параметр . Оставшийся параметр должен быть последним именованным параметром в списке параметров функции. Ему будет присвоен Array содержащий любые аргументы, переданные функции, сверх других именованных параметров. Другими словами, он получает «остальные» аргументы, переданные функции (отсюда и название).

function foo(a, b, ...c) {    console.log(c.length);}foo(1, 2, 3, 4, 5); // "3" → c = [3, 4, 5]foo('a', 'b'); // "0" → c = []

Остальные параметры аналогичны параметрам Javascript arguments объект, который представляет собой объект, подобный массиву, который содержит все параметры (именованные и безымянные) в текущем вызове функции. В отличие от arguments, однако остальные параметры верны Array объекты, поэтому такие методы, как .slice() и .sort() можно использовать непосредственно на них.

Сравнение

==	равный
!=	не равный
>	больше, чем
>=	больше или равно
<	меньше, чем
<=	меньше или равно
===	идентичный (равный и одного типа)
!==	не идентичны

Переменные, ссылающиеся на объекты, равны или идентичны, только если они ссылаются на один и тот же объект:

const obj1 = {a: 1};const obj2 = {a: 1};const obj3 = obj1;console.log(obj1 == obj2);  //falseconsole.log(obj3 == obj1);  //trueconsole.log(obj3 === obj1); //true

См. также Строка .

Логический

JavaScript предоставляет четыре логических оператора:

• унарное отрицание ( NOT = !a)
• бинарная дизъюнкция ( OR = a || b) и союз ( AND = a && b)
• троичный условный ( c ? t : f)

В контексте логической операции любое выражение имеет значение true, за исключением следующих :

• Струны: "", '',
• Числа: 0, -0, NaN,
• Особенный: null, undefined,
• Логическое значение: false.

Логическую функцию можно использовать для явного преобразования в примитив типа Boolean:

// Only empty strings return falseconsole.log(Boolean("")      === false);console.log(Boolean("false") === true);console.log(Boolean("0")     === true);// Only zero and NaN return falseconsole.log(Boolean(NaN) === false);console.log(Boolean(0)   === false);console.log(Boolean(-0)  === false); // equivalent to -1*0console.log(Boolean(-2)  === true);// All objects return trueconsole.log(Boolean(this) === true);console.log(Boolean({})   === true);console.log(Boolean([])   === true);// These types return falseconsole.log(Boolean(null)      === false);console.log(Boolean(undefined) === false); // equivalent to Boolean()

Оператор NOT оценивает свой операнд как логическое значение и возвращает отрицание. Использование оператора дважды подряд, например двойного отрицания , явно преобразует выражение в примитив логического типа:

console.log( !0 === Boolean(!0));console.log(Boolean(!0) === !!1);console.log(!!1 === Boolean(1));console.log(!!0 === Boolean(0));console.log(Boolean(0) === !1);console.log(!1 === Boolean(!1));console.log(!"" === Boolean(!""));console.log(Boolean(!"") === !!"s");console.log(!!"s" === Boolean("s"));console.log(!!"" === Boolean(""));console.log(Boolean("") === !"s");	console.log(!"s" === Boolean(!"s"));

Тернарный оператор также можно использовать для явного преобразования:

console.log([] == false); console.log([] ? true : false); // “truthy”, but the comparison uses [].toString()console.log([0] == false); console.log([0]? true : false); // [0].toString() == "0"console.log("0" == false); console.log("0"? true : false); // "0" → 0 ... (0 == 0) ... 0 ← falseconsole.log([1] == true); console.log([1]? true : false); // [1].toString() == "1"console.log("1" == true); console.log("1"? true : false); // "1" → 1 ... (1 == 1) ... 1 ← trueconsole.log([2] != true); console.log([2]? true : false); // [2].toString() == "2"console.log("2" != true); console.log("2"? true : false); // "2" → 2 ... (2 != 1) ... 1 ← true

Выражения, использующие такие функции, как постинкрементирование ( i++) имеют ожидаемый побочный эффект . JavaScript обеспечивает сокращенную оценку выражений; правый операнд выполняется только в том случае, если левого операнда недостаточно для определения значения выражения.

console.log(a || b);  // When a is true, there is no reason to evaluate b.console.log(a && b);  // When a is false, there is no reason to evaluate b.console.log(c ? t : f); // When c is true, there is no reason to evaluate f.

В ранних версиях JavaScript и JScript бинарные логические операторы возвращали логическое значение (как и в большинстве языков программирования, производных от C). Однако все современные реализации вместо этого возвращают один из своих операндов:

console.log(a || b); // if a is true, return a, otherwise return bconsole.log(a && b); // if a is false, return a, otherwise return b

Программистам, более знакомым с поведением C, эта функция может показаться удивительной, но она позволяет более кратко выражать такие шаблоны, как объединение значений null :

const s = t || "(default)"; // assigns t, or the default value, if t is null, empty, etc.

Логическое задание

??=	Нулевое присвоение
||=	Логическое ИЛИ присваивание
&&=	Логическое И присваивание

Побитовый

JavaScript поддерживает следующие двоичные побитовые операторы :

&	И
|	ИЛИ
^	БЕСПЛАТНО
!	НЕТ
<<	сдвиг влево (заполнение нулями справа)
>>	сдвиг вправо (с распространением знака); копии Крайний левый бит (знаковый бит) сдвигается слева
>>>	сдвиг вправо (заполнение нулями слева). Для положительных чисел >> и >>> дать тот же результат.

Примеры:

const x = 11 & 6;console.log(x); // 2

JavaScript поддерживает следующий унарный побитовый оператор :

~	НЕ (инвертирует биты)

Побитовое присваивание

JavaScript поддерживает следующие операторы двоичного присваивания:

&=	и
|=	или
^=	бесплатно
<<=	сдвиг влево (заполнение нулями справа)
>>=	сдвиг вправо (с распространением знака); копии Крайний левый бит (знаковый бит) сдвигается слева
>>>=	сдвиг вправо (заполнение нулями слева). Для положительных чисел >>= и >>>= дать тот же результат.

Примеры:

let x=7;console.log(x); // 7x<<=3;console.log(x); // 7->14->28->56

Нить

=	назначение
+	конкатенация
+=	объединить и назначить

Примеры:

let str = "ab" + "cd";  // "abcd"str += "e";      // "abcde"const str2 = "2" + 2;     // "22", not "4" or 4.

??

Этот раздел представляет собой отрывок из оператора объединения Null § JavaScript . [ редактировать ]

JavaScript : Ближайший оператор ??, «нулевой оператор объединения», который был добавлен в стандарт в ECMAScript . 11-м издании В более ранних версиях его можно было использовать через плагин Babel и в TypeScript . Он оценивает свой левый операнд и, если значение результата не является «нулевым» ( null или undefined), принимает это значение как результат; в противном случае он оценивает правый операнд и принимает полученное значение в качестве результата.

В следующем примере a будет присвоено значение b если значение b не null или undefined, в противном случае ему будет присвоено 3.

const a = b ?? 3;

Перед нулевым оператором объединения программисты использовали бы логический оператор ИЛИ ( ||). Но где ?? ищет специально для null или undefined, || оператор ищет любое ложное значение: null, undefined, "", 0, NaN, и, конечно, false.

В следующем примере a будет присвоено значение b если значение b является правдивым , в противном случае ему будет присвоено 3.

const a = b || 3;

Структуры управления

Сложные утверждения

Пара фигурных скобок { } а вложенная последовательность операторов представляет собой составной оператор, который можно использовать везде, где можно использовать оператор.

Если... еще

if (expr) {  //statements;} else if (expr2) {  //statements;} else {  //statements;}

Условный (тройной) оператор

Условный оператор создает выражение, которое оценивается как одно из двух выражений в зависимости от условия. Это похоже на оператор if , который выбирает один из двух операторов для выполнения в зависимости от условия. Т. е. условный оператор относится к выражениям, а что если — к операторам.

const result = condition ? expression : alternative;

то же самое, что:

if (condition) {    const result = expression;} else {    const result = alternative;}

В отличие от оператора if , условный оператор не может опустить свою «другую ветвь».

Оператор переключения

Основная статья: Оператор Switch

Синтаксис оператора переключателя JavaScript следующий:

 switch (expr) {  case SOMEVALUE:   // statements;   break;  case ANOTHERVALUE:    // statements for when ANOTHERVALUE || ORNAOTHERONE    // no break statement, falling through to the following case  case ORANOTHERONE:   // statements specific to ORANOTHERONE (i.e. !ANOTHERVALUE && ORANOTHER);   break; //The buck stops here.  case YETANOTHER:   // statements;   break;  default:   // statements;   break; }

• break; является необязательным; однако обычно это необходимо, поскольку в противном случае выполнение кода продолжится до тела следующего блока case. Такое провальное поведение можно использовать, когда один и тот же набор утверждений применяется в нескольких случаях, эффективно создавая различие между этими случаями.
• Добавьте оператор прерывания в конец последнего случая в качестве меры предосторожности на случай, если позже будут добавлены дополнительные случаи.
• Строковые литералы также могут использоваться для значений регистра.
• Вместо значений можно использовать выражения.
• Случай по умолчанию (необязательный) выполняется, когда выражение не соответствует ни одному другому указанному случаю.
• Брекеты обязательны.

Для цикла

Синтаксис цикла for в JavaScript следующий:

 for (initial; condition; loop statement) {  /*   statements will be executed every time   the for{} loop cycles, while the   condition is satisfied  */ }

или

 for (initial; condition; loop statement(iteration)) // one statement

Для... в цикле

Синтаксис JavaScript for ... in loop заключается в следующем:

for (var property_name in some_object) {  // statements using some_object[property_name];}

• Перебирает все перечислимые свойства объекта.
• Перебирает все используемые индексы массива, включая все определяемые пользователем свойства объекта массива, если таковые имеются. Таким образом, возможно, лучше использовать традиционный цикл for с числовым индексом при переборе массивов.
• Между различными веб-браузерами существуют различия в отношении того, какие свойства будут отражены в операторе цикла for...in. Теоретически это контролируется внутренним свойством состояния, определенным стандартом ECMAscript и называемым DontEnum, но на практике каждый браузер во время самоанализа возвращает немного отличающийся набор свойств. Полезно проверить заданное свойство, используя if (some_object.hasOwnProperty(property_name)) { ...}. Таким образом, добавив метод в прототип массива с помощью Array.prototype.newMethod = function() {...} может вызвать for ... in циклы для перебора имени метода.

Пока цикл

Синтаксис цикла while в JavaScript следующий:

while (condition) {  statement1;  statement2;  statement3;  ...}

Сделайте... цикл while

Синтаксис JavaScript do ... while loop заключается в следующем:

do {  statement1;  statement2;  statement3;  ...} while (condition);

С

Оператор with добавляет все свойства и методы данного объекта в область действия следующего блока, позволяя ссылаться на них, как если бы они были локальными переменными.

with (document) {  const a = getElementById('a');  const b = getElementById('b');  const c = getElementById('c');};

• Обратите внимание на отсутствие документ. перед каждым Вызов getElementById() .

Семантика аналогична оператору with Паскаля .

Поскольку наличие операторов with снижает производительность программы и, как полагают, снижает ясность кода (поскольку любая данная переменная на самом деле может быть свойством включающей с ), этот оператор не разрешен в строгом режиме .

Этикетки

JavaScript поддерживает вложенные метки в большинстве реализаций. Циклы или блоки могут быть помечены для оператора Break, а циклы для continue. Хотя goto это зарезервированное слово, goto не реализован в JavaScript.

loop1: for (let a = 0; a < 10; ++a) {  if (a === 4) break loop1; // Stops after the 4th attempt  console.log('a = ' + a);  loop2: for (let b = 0; b < 10; ++b) {    if (b === 3) continue loop2; // Number 3 is skipped    if (b === 6) continue loop1; // Continues the first loop, 'finished' is not shown    console.log('b = ' + b);  } //end of loop2  console.log('finished');} //end of loop1block1: {  console.log('Hello'); // Displays 'Hello'  break block1;  console.log('World'); // Will never get here}goto block1; // Parse error.

Функции

Основная статья: Функция (компьютерное программирование)

Функция — это блок со списком параметров (возможно, пустым), которому обычно присваивается имя. Функция может использовать локальные переменные. Если вы выйдете из функции без оператора return, значение неопределенное значение возвращается .

function gcd(number1, number2) {  if (isNaN(number1*number2)) throw TypeError("Non-Numeric arguments not allowed.");  number1 = Math.round(number1);  number2 = Math.round(number2);  let difference = number1 - number2;  if (difference === 0) return number1;  return difference > 0 ? gcd(number2, difference) : gcd(number1, -difference);}console.log(gcd(60, 40)); // 20//In the absence of parentheses following the identifier 'gcd' on the RHS of the assignment below,//'gcd' returns a reference to the function itself without invoking it.let mygcd = gcd; // mygcd and gcd reference the same function.console.log(mygcd(60, 40)); // 20

Функции являются объектами первого класса и могут быть присвоены другим переменным.

Количество аргументов, передаваемых при вызове функции, может не обязательно соответствовать количеству аргументов в определении функции; именованный аргумент в определении, который не имеет соответствующего аргумента в вызове, будет иметь значение undefined (которому можно неявно привести к false). Внутри функции доступ к аргументам также можно получить через объект аргументов ; это обеспечивает доступ ко всем аргументам с использованием индексов (например, arguments[0], arguments[1], ... arguments[n]), включая те, которые выходят за рамки количества именованных аргументов. (Хотя в списке аргументов есть .length свойство, оно не является примером Множество ; у него нет таких методов, как .slice() , .sort() и т. д.)

function add7(x, y) {  if (!y) {    y = 7;  }  console.log(x + y + arguments.length);};add7(3); // 11add7(3, 4); // 9

Примитивные значения (число, логическое значение, строка) передаются по значению. Для объектов это ссылка на передаваемый объект.

const obj1 = {a : 1};const obj2 = {b : 2};function foo(p) {  p = obj2; // Ignores actual parameter  p.b = arguments[1];}foo(obj1, 3); // Does not affect obj1 at all. 3 is additional parameterconsole.log(`${obj1.a} ${obj2.b}`); // writes 1 3

Функции могут быть объявлены внутри других функций и иметь доступ к локальным переменным внешней функции. Более того, они реализуют полное замыкание , запоминая локальные переменные внешней функции даже после ее завершения.

let t = "Top";let bar, baz;function foo() {  let f = "foo var";  bar = function() { console.log(f) };  baz = function(x) { f = x; };}foo();baz("baz arg");bar(); // "baz arg" (not "foo var") even though foo() has exited.console.log(t); // Top

Асинхронный/ожидание

Этот раздел представляет собой отрывок из Async/await § In JavaScript . [ редактировать ]

Оператор await в JavaScript можно использовать только внутри асинхронной функции или на верхнем уровне модуля . Если параметром является промис , выполнение асинхронной функции возобновится, когда промис будет разрешен (если промис не будет отклонен, в этом случае будет выдана ошибка, которую можно обработать с помощью обычной обработки исключений JavaScript ). Если параметр не является обещанием, сам параметр будет возвращен немедленно.

Многие библиотеки предоставляют объекты-промисы, которые также можно использовать с await, если они соответствуют спецификации собственных промисов JavaScript. Однако промисы из библиотеки jQuery не были совместимы с Promises/A+ до версии jQuery 3.0.

Вот пример (измененный из этого статья):

async function createNewDoc() {  let response = await db.post({}); // post a new doc  return db.get(response.id); // find by id}async function main() {  try {    let doc = await createNewDoc();    console.log(doc);  } catch (err) {    console.log(err);  }}main();

Node.js версии 8 включает утилиту, которая позволяет использовать методы на основе обратного вызова стандартной библиотеки в качестве обещаний.

Объекты

Для удобства типы обычно подразделяются на примитивы и объекты . Объекты — это сущности, которые имеют идентичность (они равны только самим себе) и которые сопоставляют имена свойств значениям («слоты» в терминологии программирования на основе прототипов ). Объекты можно рассматривать как ассоциативные массивы или хэши, и они часто реализуются с использованием этих структур данных. Однако у объектов есть дополнительные возможности, такие как цепочка прототипов , которых нет у обычных ассоциативных массивов.

В JavaScript есть несколько типов встроенных объектов, а именно: Array, Boolean, Date, Function, Math, Number, Object, RegExp и String. Другие объекты являются «хост-объектами», определяемыми не языком, а средой выполнения. Например, в браузере типичные хост-объекты принадлежат DOM (окно, форма, ссылки и т. д.).

Создание объектов

Объекты можно создавать с помощью конструктора или литерала объекта. Конструктор может использовать либо встроенную функцию объекта, либо пользовательскую функцию. По соглашению функциям-конструкторам присваиваются имена, начинающиеся с заглавной буквы:

// Constructorconst anObject = new Object();// Object literalconst objectA = {};const objectA2 = {};  // A != A2, {}s create new objects as copies.const objectB = {index1: 'value 1', index2: 'value 2'};// Custom constructor (see below)

Литералы объектов и литералы массивов позволяют легко создавать гибкие структуры данных:

const myStructure = {  name: {    first: "Mel",    last: "Smith"  },  age: 33,  hobbies: ["chess", "jogging"]};

Это основа JSON — простой нотации, использующей для обмена данными синтаксис, подобный JavaScript.

Методы

Метод — это просто функция , присвоенная имени свойства объекта. В отличие от многих объектно-ориентированных языков, в объектно-ориентированном JavaScript нет различия между определением функции и определением метода. Скорее, различие возникает во время вызова функции; функцию можно вызвать как метод.

При вызове как метод стандартная локальная переменная это просто автоматически устанавливается на экземпляр объекта слева от " . ". (Есть также позвони и применять методы, которые могут установить это явно — некоторые пакеты, такие как jQuery, делают необычные вещи с этот .)

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

Обратите внимание, что в приведенном ниже примере Foo просто присваивает значения слотам, некоторые из которых являются функциями. Таким образом, он может назначать разные функции разным экземплярам. В этом примере нет прототипирования.

function px() { return this.prefix + "X"; }function Foo(yz) {  this.prefix = "a-";  if (yz > 0) {    this.pyz = function() { return this.prefix + "Y"; };  } else {    this.pyz = function() { return this.prefix + "Z"; };  }  this.m1 = px;  return this;}const foo1 = new Foo(1);const foo2 = new Foo(0);foo2.prefix = "b-";console.log("foo1/2 " + foo1.pyz() + foo2.pyz());// foo1/2 a-Y b-Zfoo1.m3 = px; // Assigns the function itself, not its evaluated result, i.e. not px()const baz = {"prefix": "c-"};baz.m4 = px; // No need for a constructor to make an object.console.log("m1/m3/m4 " + foo1.m1() + foo1.m3() + baz.m4());// m1/m3/m4 a-X a-X c-Xfoo1.m2(); // Throws an exception, because foo1.m2 doesn't exist.

Конструкторы

Функции конструктора просто присваивают значения слотам вновь созданного объекта. Значения могут быть данными или другими функциями.

Пример: Манипулирование объектом:

function MyObject(attributeA, attributeB) {  this.attributeA = attributeA;  this.attributeB = attributeB;}MyObject.staticC = "blue"; // On MyObject Function, not objectconsole.log(MyObject.staticC); // blueconst object = new MyObject('red', 1000);console.log(object.attributeA); // redconsole.log(object.attributeB); // 1000console.log(object.staticC); // undefinedobject.attributeC = new Date(); // add a new propertydelete object.attributeB; // remove a property of objectconsole.log(object.attributeB); // undefined

прототипа объекта Ссылка на сам конструктор находится в слоте конструктора . Так,

function Foo() {}// Use of 'new' sets prototype slots (for example, // x = new Foo() would set x's prototype to Foo.prototype,// and Foo.prototype has a constructor slot pointing back to Foo).const x = new Foo();// The above is almost equivalent toconst y = {};y.constructor = Foo;y.constructor();// Exceptx.constructor == y.constructor; // truex instanceof Foo; // truey instanceof Foo; // false// y's prototype is Object.prototype, not// Foo.prototype, since it was initialised with// {} instead of new Foo.// Even though Foo is set to y's constructor slot,// this is ignored by instanceof - only y's prototype's// constructor slot is considered.

Функции сами по себе являются объектами, которые можно использовать для создания эффекта, аналогичного «статическим свойствам» (используя терминологию C++/Java), как показано ниже. (Объект функции также имеет специальный prototype свойство, как описано в разделе «Наследование» ниже.)

Удаление объектов используется редко, поскольку механизм сценариев будет собирать мусор для объектов, на которые больше нет ссылок.

Наследование

JavaScript поддерживает иерархию наследования посредством прототипирования наподобие Self .

В следующем примере Производный класс наследуется от Базовый класс.Когда d создается как Derived , ссылка на базовый экземпляр База копируется в д.база .

Производное не содержит значения для aBaseFunction , поэтому она извлекается из aBaseFunction, когда aBaseFunction Доступ к . Это становится очевидным, если изменить значение base.aBaseFunction , что отражается в значении d.aBaseFunction .

Некоторые реализации позволяют получить доступ к прототипу или установить его явно с помощью Слот __proto__, как показано ниже.

function Base() {  this.anOverride = function() { console.log("Base::anOverride()"); };  this.aBaseFunction = function() { console.log("Base::aBaseFunction()"); };}function Derived() {  this.anOverride = function() { console.log("Derived::anOverride()"); };}const base = new Base();Derived.prototype = base; // Must be before new Derived()Derived.prototype.constructor = Derived; // Required to make `instanceof` workconst d = new Derived();    // Copies Derived.prototype to d instance's hidden prototype slot.d instanceof Derived; // trued instanceof Base;    // truebase.aBaseFunction = function() { console.log("Base::aNEWBaseFunction()"); };d.anOverride();    // Derived::anOverride()d.aBaseFunction(); // Base::aNEWBaseFunction()console.log(d.aBaseFunction == Derived.prototype.aBaseFunction); // trueconsole.log(d.__proto__ == base); // true in Mozilla-based implementations and false in many others.

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

function m1() { return "One"; }function m2() { return "Two"; }function m3() { return "Three"; }function Base() {}Base.prototype.m = m2;const bar = new Base();console.log("bar.m " + bar.m()); // bar.m Twofunction Top() { this.m = m3; }const t = new Top();const foo = new Base();Base.prototype = t;// No effect on foo, the *reference* to t is copied.console.log("foo.m " + foo.m()); // foo.m Twoconst baz = new Base();console.log("baz.m " + baz.m()); // baz.m Threet.m = m1; // Does affect baz, and any other derived classes.console.log("baz.m1 " + baz.m()); // baz.m1 One

На практике используется множество вариаций этих тем, и они могут быть как мощными, так и запутанными.

Обработка исключений

JavaScript включает в себя try ... catch ... finally оператор обработки исключений для обработки ошибок во время выполнения.

The try ... catch ... finally Оператор перехватывает исключения, возникающие в результате ошибки или оператора throw. Его синтаксис следующий:

try {  // Statements in which exceptions might be thrown} catch(errorValue) {  // Statements that execute in the event of an exception} finally {  // Statements that execute afterward either way}

Первоначально выполняются инструкции внутри блока try. Если генерируется исключение, поток управления сценарием немедленно переходит к операторам в блоке catch, при этом исключение доступно в качестве аргумента ошибки. В противном случае блок catch пропускается. Блок улова может throw(errorValue) , если он не хочет обрабатывать конкретную ошибку.

В любом случае операторы в блокеfinally выполняются всегда. Это можно использовать для освобождения ресурсов, хотя память автоматически очищается от мусора.

Предложение catch или предложениеfinally можно опустить. Аргумент catch является обязательным.

Реализация Mozilla позволяет использовать несколько операторов catch в качестве расширения стандарта ECMAScript. Они следуют синтаксису, аналогичному используемому в Java :

try { statement; }catch (e if e == "InvalidNameException")  { statement; }catch (e if e == "InvalidIdException")    { statement; }catch (e if e == "InvalidEmailException") { statement; }catch (e)                                 { statement; }

В браузере функция Событие onerror чаще используется для перехвата исключений.

onerror = function (errorValue, url, lineNr) {...; return true;};

Собственные функции и методы

(Не относится к веб-браузерам.)

оценка (выражение)

Оценивает первый параметр как выражение, которое может включать операторы присваивания. Выражение может ссылаться на переменные, локальные для функций. Однако, eval представляет серьезную угрозу безопасности, поскольку позволяет злоумышленнику выполнять произвольный код, поэтому его использование не рекомендуется.

> (function foo() {...   var x = 7;...   console.log("val " + eval("x + 2"));... })();val 9undefined

См. также

• Сравнение редакторов исходного кода на основе JavaScript
• JavaScript

Дальнейшее чтение

• Дэнни Гудман: Библия JavaScript , Wiley, John & Sons, ISBN   0-7645-3342-8 .
• Дэвид Фланаган, Паула Фергюсон: JavaScript: полное руководство , O'Reilly & Associates, ISBN   0-596-10199-6 .
• Томас А. Пауэлл, Фриц Шнайдер: JavaScript: полный справочник , Компании McGraw-Hill, ISBN   0-07-219127-9 .
• Аксель Раушмайер: «Разговор на JavaScript: подробное руководство для программистов» , 460 страниц, O'Reilly Media, 25 февраля 2014 г., ISBN   978-1449365035 . ( бесплатное онлайн-издание )
• Эмили Вандер Вир: JavaScript для чайников, 4-е издание , Wiley, ISBN   0-7645-7659-3 .

Внешние ссылки

• Повторное знакомство с JavaScript - Центр разработчиков Mozilla
• Циклы JavaScript
• Ссылки на стандарты ECMAScript: ECMA-262.
• Интерактивные уроки JavaScript – на основе примеров
• JavaScript на сайте About.com: уроки и объяснения. Архивировано 25 февраля 2017 г. на Wayback Machine.
• Обучение JavaScript
• Основные ссылки Центра разработчиков Mozilla для версий JavaScript 1.5 , 1.4 , 1.3 и 1.2.
• Документация по языку Mozilla JavaScript