‼JavaScript
Синтаксис
Назначение
Типы данных
Строка string
Булевый boolean
Число number
"Текст"
true
Операторы
Арифметические
click to edit
Подключение
Загрузка
Инлайн #
Инлайн #
123, 0.45, .065е5, -65, 56е-6
Любые числа в 10-ой (по умолчанию), 2ой (префикс 0b), 16-ой (префикс 0х) или 8-ой (префикс 0, в строгом режиме не допускается) системах счисления
Внешним файлом #
<script src="bobik.js"></script>
Внешний #
Без атрибутов - так же как инлайн
С атрибутом async - загружается параллельно с формированием ДОМ и ЦССОМ, выполняется сразу после загрузки (при выполнении также блокирует формирование ДОМ и ЦССОМ)
С атрибутом defer - загружается также как с атрибутом async, выполняется перед самым завершением формирования ДОМ и ЦССОМ
Инлайн - как только встретится на странице (формирование ДОМ и ЦССОМ при этом приостанавливается до полной загрузки и выполнения скрипта)
Выполнение
Инлайн
Внешний
по очереди по мере появления в хтмл
Без атрибутов - так же как инлайн
С атрибутом async - первым выполнится тот, что первым загрузился (предсказать какой загрузится первым трудно)
С атрибутом defer - выполняются по очереди в самом конце формирования ДОМ и ЦССОМ.
*Внешний файл отнимает время на загрузку, инлайн загружать не надо, он уже присутствует на странице.
Методы
Работа с числами
Работа со строками
Комментарии
Строчные
Блочные
// Строчный комментарий
/* Блочный комментарий
Может располагаться
В несколько строк */
Бинарные
вычитание -
деление /
умножение *
false
сложение +
Результат зависит от порядка. Порядок такой же как в математике
Переменные
Объявлениe
Имена
Присвоение
в теге
в хтмл
<button onclick="alert( 'Хорошо сделано!' );">Сделать хорошо</button>
<script>document.write( 'Космос!' )</script>
*Если скрипт попытается повлиять на часть ДОМ, которая еще не сформировалась, ничего не произойдет, так как скрипт будет пытаться изменить узел, который еще не сформирован.
**Скрипт может менять любой узел в ДОМ: добавлять/удалять узлы, менять значение их атрибутов, добавлять/удалять атрибуты.
*Атрибуты async и defer действуют только на внешние скрипты.
Логические
Имя может состоять из: букв, цифр, символов $ и _
Первый символ не должен быть цифрой.
Регистр букв имеет значение
Русские буквы допустимы, но не рекомендуются
Зарезервированные имена
abstract
boolean
break
byte
case
catch
char
class
const
continue
debugger
default
delete
do
double else
enum
export
extends
false
final
finally
float
for
function
goto
if
implements
import
in instanceof
int
interface
long
native
new
null
package
private
protected
public
return
short
static
super switch
synchronized
this
throw
throws
transient
true
try
typeof
var
void
volatile
while
with
const
Не поднимается, нельзя переопределять и повторно объявлять
let
Не поднимаются, можно повторно присваивать (переопределять), нельзя повторно объявлять
var
Поднимаются, можно переопределять и повторно объявлять
Значение переменной присваивается через знак =
Например var newVariable = 5;
Имена из нескольких слов оформляются
либо
вВерблюжьемРегистре
либо
через_нижние_подчеркивания
|| (ИЛИ)
вычисляет операнды слева направо до первого «истинного» и возвращает его, а если все ложные – то последнее значение
Преобразование (приведение) типов данных
Работа с булевыми значениями
&& (И)
вычисляет операнды слева направо до первого «ложного» и возвращает его, а если все истинные – то последнее значение
! (НЕ)
остаток от деления %
Унарные
унарный -
(меняет знак числа на противоположный)
инкремент ++
унарный +
(преобразовывает переменную в числовой тип)
декремент --
i++
(сначала выводит значение i, затем увеличивает его на 1)
++i
(сначала увеличивает i на 1, затем выводит его значение)
i--
(сначала выводит значение i, затем уменьшает его на 1)
--i
(сначала уменьшает i на 1, затем выводит его значение)
typeof
возвращает строку, содержащую тип переданного аргумента. Аргумент можно передать без скобок
Сравнения
Присваивания
click to edit
click to edit
object
undefined
null
Имеет тип "объект", обычно ставится вручную, например чтобы обнулить переменную
При приведении к числу возвращает ноль
Указывает что переменной не присвоено значение, либо что функция ничего не возвращает
При приведении к числу возвращает NaN
void вычисляет переданное выражение и возвращает undefined
click to edit
NaN
При выполнении некорректной математической операции
Infinity
При делении на 0, и операциями с бесконечностью
Экранирование \
Спецсимволы
\b Backspace
\f Form feed
\n New line
\r Carriage return
\t Tab
\uNNNN Символ в кодировке Юникод с шестнадцатеричным кодом NNNN
. Например, \u00A9
Кавычки
" ", ' '
Строки шаблоны
`text ${} text `
перенос строк внутри отображается
Логическое преобразование
Происходит в логическом контексте, таком как if(), и при применении логических операторов
Двойное отрицание !!
Вызов Boolean()
Что возвращает "ложь"
if (false)
if (null)
if (undefined)
if (0)
if (NaN)
if ('')
if ("")
if (document.all) [1]
Численное преобразование
Численное преобразование происходит в математических функциях и выражениях (кроме бинарного +), а также при сравнении данных различных типов (кроме сравнений ===, !==)
parseInt(12px, сист.счисления*) - для целых
parseFloat(12.3pt, сист.счисления*) - для дробных
*Сист.счисления указывать не обязательно
Number()
Унарный +
string.substr(start[, length]) возвращает указанное количество символов из строки, начиная с указанной позиции
start - Позиция, с которой начинать извлекать символы. Если передано отрицательное число, она трактуется как strLength + start, где strLength равна длине строки
length - Н/п. Количество извлекаемых символов.
number.toString(radix) - возвращает строку
radix - Н\п. Основание системы исчисления. Может принимать следующие значения - от 2 до 36
Не работает с целыми числами
click to edit
Побитовые
click to edit
Операнд – то, к чему применяется оператор. Например: 5 * 2 – оператор умножения с левым и правым операндами. Другое название: «аргумент оператора».
Унарным называется оператор, который применяется к одному операнду. Например, оператор унарный минус "-" меняет знак числа на противоположный:
Бинарным называется оператор, который применяется к двум операндам. Тот же минус существует и в бинарной форме:
Строковое преобразование
Происходит, когда требуется представление чего-либо в виде строки. Например, его производит функция alert()
String()
.toString()
Оператор +, у которого один из аргументов строка, 256+""
Что возвращает преобразование к числу
Number(Undefined) - NaN
Number(Null) - 0
Number(true) - 1
Number(false) - 0
Number(56) - 56
Number("75") - 75
Number("текст") - NaN
Number(" ") - 0
Number("") - 0
Number(Object)
- Вызвать ToPrimitive (входной аргумент, подсказка Number).
- Вызвать ToNumber(Результат(1)).
- Вернуть Результат(2).
Что возвращает "правду"
if (true)
if ({})
if ([])
if (42)
if ("foo")
if (new Date())
if (-42)
if (3.14)
if (-3.14)
if (Infinity)
if (-Infinity)
if("\n ")
if(" ")
Что возвращает преобразование к строке
Преобразование происходит наиболее очевидным способом, «как есть»
string.split([separator[, limit]]) разбивает объект String на массив строк путём разделения строки указанной подстрокой.
separator - Н/п. Указывает символы, используемые в качестве разделителя внутри строки, может быть как строкой, так и регулярным выражением. Если параметр опущен, возвращённый массив будет содержать один элемент со всей строкой. Если параметр равен пустой строке, строка str будет преобразована в массив символов.
limit - Н/п. Целое число, определяющее ограничение на количество найденных подстрок. Всё равно разделяет строку на каждом сопоставлении с разделителем separator, но обрезает возвращаемый массив так, чтобы он содержал не более limit элементов.
var str = "abcdefghij";
alert("(1,2): " + str.substr(1,2)); // (1,2): bc
alert("(-3,2): " + str.substr(-3,2)); // (-3,2): hi
alert("(-3): " + str.substr(-3)); // (-3): hij
alert("(1): " + str.substr(1)); // (1): bcdefghij
alert("(-20, 2): " + str.substr(-20,2)); // (-20, 2): ab
alert("(20, 2): " + str.substr(20,2)); // (20, 2):
alert("(2, 0): " + str.substr(2,0)); // (2,0):
10.toString() // error
10..toString() // "10"
10.0.toString() // "10"
10 .toString() // "10"
var tags = "Лето, зима, осень 2009 года;
console.log(tags.split(",")); // ["Лето", " зима", " осень 2009 года"]
console.log(tags.split("")); // ["Л", "е", "т", "о", ",", " ", "з", "и", "м", "а", ",", " ", "о", "с", "е", "н", "ь", " ", "2", "0", "0", "9", " ", "г", "о", "д", "а"]
console.log(tags.split()); // ["Лето, зима, осень 2009 года"]
console.log(tags.split(" ",2)); // ["Лето,", "зима,"]
console.log(tags.split(/\s,\s/)); // ["Лето", " зима", " осень 2009 года"]
Функции
Встроенные
Работа со строками
parseInt(string, radix) принимает строку в качестве аргумента и возвращает целое число в соответствии с указанным основанием системы счисления
string - Значение, которое необходимо проинтерпретировать. Если значение параметра string не принадлежит строковому типу, оно преобразуется в него (с помощью абстрактной операции ToString). Пробелы в начале строки не учитываются.
radix - Целое число от 2 до 36, представляющее собой основание системы счисления числовой строки string, описанной выше. Всегда указывайте этот параметр, чтобы исключить ошибки считывания!!!
Не предназначен для округления, работы с дробными числами и показателями степени
Преобразует в строку потом в число
parseFloat(строка) принимает строку в качестве аргумента и возвращает десятичное число (число с плавающей точкой)
строка - Текстовая строка, из которой вам надо выделить десятичное число
Не предназначен для округления
Преобразует в строку потом в число
numObj.toFixed([digits]) форматирует число, используя запись с фиксированной запятой
digits - Н\п. Количество цифр после десятичной запятой; может быть значением между 0 и 20 включительно, хотя реализации могут поддерживать и больший диапазон значений. Если аргумент опущен, он считается равным 0.
Возвращает строку
var numObj = 12345.6789;
numObj.toFixed(); // Вернёт '12346': обратите внимание на округление, дробной части нет
numObj.toFixed(1); // Вернёт '12345.7': обратите внимание на округление
numObj.toFixed(6); // Вернёт '12345.678900': обратите внимание на дополнение нулями
(1.23e+20).toFixed(2); // Вернёт '123000000000000000000.00'
(1.23e-10).toFixed(2); // Вернёт '0.00'
2.34.toFixed(1); // Вернёт '2.3'
-2.34.toFixed(1); // Вернёт -2.3 (в соответствии с приоритетом операций,
// отрицательные числовые литералы не возвращают строку...)
(-2.34).toFixed(1); // Вернёт '-2.3' (...до тех пор, пока вы не заключите их в круглые скобки)
Math.floor
Округляет вниз
Math.ceil
Округляет вверх
Math.round
Округляет до ближайшего целого
Math.random()
Возвращает псевдослучайное число в интервале [0,1) – то есть между 0 (включительно) и 1 (не включая). Генератор случайных чисел инициализуется текущим временем.
numObj.toExponential([fractionDigits]) возвращает строку, представляющую объект Number в экспоненциальной записи
fractionDigits - Н\п. Целое число, определяющее количество цифр после десятичной запятой. По умолчанию используется столько цифр, сколько необходимо для указания числа.
var numObj = 77.1234;
console.log(numObj.toExponential()); // выведет 7.71234e+1
console.log(numObj.toExponential(4)); // выведет 7.7123e+1
console.log(numObj.toExponential(2)); // выведет 7.71e+1
console.log(77.1234.toExponential()); // выведет 7.71234e+1
console.log(77 .toExponential()); // выведет 7.7e+1
numObj.toPrecision([precision]) возвращает строку, представляющую объект Number с указанной точностью
precision - Н\п. Целое число, определяющее количество значащих цифр.
var numObj = 5.123456;
console.log(numObj.toPrecision()); // выведет 5.123456
console.log(numObj.toPrecision(5)); // выведет 5.1235
console.log(numObj.toPrecision(2)); // выведет 5.1
console.log(numObj.toPrecision(1)); // выведет 5
var numObj = 0.000123;
console.log(numObj.toPrecision()); // logs '0.000123'
console.log(numObj.toPrecision(5)); // logs '0.00012300'
console.log(numObj.toPrecision(2)); // logs '0.00012'
console.log(numObj.toPrecision(1)); // logs '0.0001'
// обратите внимание, что если заданного количества заданных разрядов недостаточно для точного отображения целой части числа, значение может быть возвращено в экспоненциальной записи
console.log((1234.5).toPrecision(2)); // выведет 1.2e+3
Округление (не корректное)
3.14 << 0;
3.14 | 0;
~~3.14;
null == undefined
Преобразование объектов
String + toString function() {return 'text';}}
Number + valueOf function() {return 100;}}
valueOf в приоритете для Number(), если его нет, то toString
String() воспринимает только toString
Number(
{name: 'Vladimir',
valueOf: function() {return 85;}
}); // 85
String(
{name: 'Vladimir',
toString: function() {return 'Ivan';}}
); // 'Ivan'
Преобразование массивов
Number([]) или унарный + вернет число только в случае если в массиве один элемент
String(["text", 2]) и [2, 'text'].toString() вернет строчку
также строчку вернет сложение массива со строкой
Number(['45']); // 45
Number([45]); // 45
Number(['45', 85]); // NaN
+[5] // 5
+['5'] // 5
String([45, 'text', '85']); // "45,text,85"
[45, 'text', '85'].toString(); // "45,text,85"
['text', 2] + '' // "text,2"
['text', 2] + 'text_second' // "text,2text_second"