Типы данных JavaScript

// Numbers:
let length = 16;
let weight = 7.5;

// Strings:
let color = "Yellow";
let lastName = "Johnson";

// Booleans
let x = true;
let y = false;

// Object:
const person = {firstName:"John", lastName:"Doe"};

// Array object:
const cars = ["Saab", "Volvo", "BMW"];

// Date object:
const date = new Date("2022-03-25");

Примечание

Переменная JavaScript может содержать данные любого типа.

Концепция типов данных

В программировании типы данных являются важным понятием.

Чтобы иметь возможность работать с переменными, важно кое-что знать о тип.

Без типов данных компьютер не сможет безопасно решить следующую задачу:

let x = 16 + "Volvo";

Есть ли смысл добавлять к шестнадцати «Вольво»? Произведет ли это ошибка или это даст результат?

JavaScript будет рассматривать приведенный выше пример как:

let x = "16" + "Volvo";

Примечание

При добавлении числа и строки JavaScript будет рассматривать число как нить.

Пример

let x = 16 + "Volvo";

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript</h2>

<p>When adding a number and a string, JavaScript will treat the number as a string.</p>

<p id="demo"></p>

<script>
let x = 16 + "Volvo";
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

Пример

let x = "Volvo" + 16;

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript</h2>

<p>When adding a string and a number, JavaScript will treat the number as a string.</p>

<p id="demo"></p>

<script>
let x = "Volvo" + 16;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

JavaScript оценивает выражения слева направо. Различные последовательности могут дают разные результаты:

JavaScript:

let x = 16 + 4 + "Volvo";

Результат :

20Volvo

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript</h2>

<p>JavaScript evaluates expressions from left to right. Different sequences can produce different results:</p>

<p id="demo"></p>

<script>
let x = 16 + 4 + "Volvo";
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

JavaScript:

let x = "Volvo" + 16 + 4;

Результат :

Volvo164

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript</h2>

<p>JavaScript evaluates expressions from left to right. Different sequences can produce different results:</p>

<p id="demo"></p>

<script>
let x = "Volvo" + 16 + 4;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

В первом примере JavaScript обрабатывает 16 и 4 как числа, пока не достигнет «Volvo».

Во втором примере, поскольку первый операнд является строкой, все операнды рассматриваться как строки.

Типы JavaScript являются динамическими

В JavaScript есть динамические типы. Это означает, что можно использовать одну и ту же переменную. держать разные типы данных:

Пример

let x;       // Now x is undefined
x = 5;       // Now x is a Number
x = "John";  // Now x is a String

Строки JavaScript

Строка (или текстовая строка) представляет собой последовательность символов, например «Джон Доу».

Строки записываются с кавычками. Вы можете использовать одинарные или двойные кавычки:

Пример

// Using double quotes:
let carName1 = "Volvo XC60";

// Using single quotes:
let carName2 = 'Volvo XC60';

Вы можете использовать кавычки внутри строки, если они не соответствуют кавычкам. вокруг строки:

Пример

// Single quote inside double quotes:
let answer1 = "It's alright";
 

// Single quotes inside double quotes:
let answer2 = "He is called 'Johnny'";

// Double quotes inside single quotes:
let answer3 = 'He is called "Johnny"';

Подробнее о строках вы узнаете далее в этом руководстве.

Числа JavaScript

Все числа JavaScript хранятся в виде десятичных чисел (с плавающей запятой).

Числа могут быть записаны с десятичными знаками или без них:

Пример

// With decimals:
let x1 = 34.00;

 
// Without decimals:
let x2 = 34;

Экспоненциальная запись

Очень большие или очень маленькие числа можно записать научными методами. (экспоненциальное) обозначение:

Пример

let y = 123e5;    // 12300000
let z = 123e-5;   // 0.00123

Примечание

Большинство языков программирования имеют множество типов чисел:

Целые числа (целые):
байтовый (8-битный), короткий (16-битный), int (32-битный), длинный (64-битный)

Действительные числа (с плавающей запятой):
float (32-бит), double (64-бит).

Номера Javascript всегда относятся к одному типу:
double (64-битная с плавающей запятой).

Подробнее о числах вы узнаете позже в этом уроке.

JavaScript BigInt

Все числа JavaScript хранятся в 64-битном формате с плавающей запятой.

JavaScript BigInt — это новый тип данных (ES2020), который можно использовать для хранения целочисленных значений, слишком больших для представления. по обычному номеру JavaScript.

Пример

let x = BigInt("123456789012345678901234567890");

Подробнее о BigInt вы узнаете далее в этом руководстве.

Логические значения JavaScript

Логические значения могут иметь только два значения: true или false.

Пример

let x = 5;
let y = 5;
let z = 6;
(x == y)       
  // Returns true
(x == z)       // Returns 
  false

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Booleans</h2>

<p>Booleans can have two values: true or false:</p>

<p id="demo"></p>

<script>
let x = 5;
let y = 5;
let z = 6;

document.getElementById("demo").innerHTML =
(x == y) + "<br>" + (x == z);
</script>

</body>
</html>

Логические значения часто используются при условном тестировании.

Подробнее о логических значениях вы узнаете позже в этом руководстве.

JavaScript-массивы

Массивы JavaScript записываются в квадратных скобках.

Элементы массива разделяются запятыми.

Следующий код объявляет (создает) массив с именем cars, содержащий три предметы (названия автомобилей):

Пример

const cars = ["Saab", "Volvo", "BMW"];

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Arrays</h2>

<p>Array indexes are zero-based, which means the first item is [0].</p>

<p id="demo"></p>

<script>
const cars = ["Saab","Volvo","BMW"];

document.getElementById("demo").innerHTML = cars[0];
</script>

</body>
</html>

Индексы массивов начинаются с нуля, что означает, что первый элемент равен [0], второй — [1] и так далее.

Подробнее о массивах вы узнаете позже в этом руководстве.

Объекты JavaScript

Объекты JavaScript записываются с помощью фигурных скобок {}.

Объект свойства записываются как пары имя:значение, разделенные запятыми.

Пример

const person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Objects</h2>

<p id="demo"></p>

<script>
const person = {
  firstName : "John",
  lastName  : "Doe",
  age     : 50,
  eyeColor  : "blue"
};

document.getElementById("demo").innerHTML =
person.firstName + " is " + person.age + " years old.";
</script>

</body>
</html>

Объект (человек) в приведенном выше примере имеет 4 свойства: firstName, фамилия, возраст и цвет глаз.

Подробнее о объектах вы узнаете позже в этом уроке.

Тип оператора

Вы можете использовать оператор JavaScript typeof, чтобы найти тип. переменной JavaScript.

Оператор typeof возвращает тип переменной или выражения:

Пример

typeof ""             // Returns 
 "string"
typeof "John"         // Returns 
 "string"
typeof "John Doe"     // Returns 
 "string"

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Operators</h1>
<h2>The typeof Operator</h2>
<p>The typeof operator returns the type of a variable or an expression.</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
typeof "" + "<br>" +
typeof "John" + "<br>" + 
typeof "John Doe";
</script>
</body>
</html>

Пример

typeof 0              // Returns 
 "number"
  typeof 314            // Returns 
 "number"
  typeof 3.14           // Returns 
 "number"
  typeof (3)            // Returns 
 "number"
typeof (3 + 4)        // Returns 
 "number"

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Operators</h1>
<h2>The typeof Operator</h2>
<p>The typeof operator returns the type of a variable or an expression.</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
typeof 0 + "<br>" + 
typeof 314 + "<br>" +
typeof 3.14 + "<br>" +
typeof (3) + "<br>" +
typeof (3 + 4);
</script>

</body>
</html>

Подробнее о typeof вы узнаете позже в этом уроке.

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

В JavaScript переменная без значения имеет значение не определено. Тип также не определен.

Пример

let car;    // Value is undefined, 
    type is undefined

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Operators</h1>
<h2>The typeof Operator</h2>
<p>The value (and the data type) of a variable with no value is <b>undefined</b>.</p>

<p id="demo"></p>

<script>
let car;
document.getElementById("demo").innerHTML =
car + "<br>" + typeof car;
</script>

</body>
</html>

Любую переменную можно очистить, установив для нее значение не определено. Тип также будет неопределенным.

Пример

   car = undefined;    // Value is undefined, 
    type is undefined

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Operators</h1>
<h2>The typeof Operator</h2>
<p>Variables can be emptied if you set the value to <b>undefined</b>.</p>

<p id="demo"></p>

<script>
let car = "Volvo";
car = undefined;

document.getElementById("demo").innerHTML = car + "<br>" + typeof car;
</script>

</body>
</html>

Пустые значения

Пустое значение не имеет ничего общего с undefined.

Пустая строка имеет как допустимое значение, так и тип.

Пример

let car = "";    // The value is  "", the typeof is "string"

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript</h2>

<p>An empty string has both a legal value and a type:</p>

<p id="demo"></p>

<script>
let car = "";
document.getElementById("demo").innerHTML =
"The value is: " +
car + "<br>" +
"The type is: " + typeof car;
</script>

</body>
</html>

Типы данных JavaScript

Оглавление

JavaScript имеет 8 типов данных

Тип данных объекта

Примеры

Примечание

Концепция типов данных

Примечание

Пример

Пример

JavaScript:

JavaScript:

Типы JavaScript являются динамическими

Пример

Строки JavaScript

Пример

Пример

Числа JavaScript

Пример

Экспоненциальная запись

Пример

Примечание

JavaScript BigInt

Пример

Логические значения JavaScript

Пример

JavaScript-массивы

Пример

Объекты JavaScript

Пример

Тип оператора

Пример

Пример

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

Пример

Пример

Пустые значения

Пример