JavaScript青少年简明教程：数据类型和运算符-优快云博客

本文链接：https://blog.youkuaiyun.com/cnds123/article/details/140461778

JavaScript青少年简明教程：数据类型和运算符

JavaScript数据类型

JavaScript数据类型，先给出几个直观的例子：

let number = 100; // 数字

let text = "Hello, world!"; // 字符串

let isJavaScriptFun = true; // 布尔值

let person = {name: "John", age: 30}; // 对象

let colors = ["red", "green", "blue"]; // 数组

JavaScript数据类型分类

一、原始（primitive：原始、基本）数据类型，也称为原始值（primitive value），包括：

1.布尔值（Boolean），其字面值只有两个，分别是true和false。

在JavaScript中，真值（truthy）与假值（falsy）：
Falsy 值包括：false、0、-0、0n、""、null、undefined、NaN
除 Falsy 值外的所有其他值都是 Truthy 的
常用的布尔运算符包括：AND（&&）、OR（||）、NOT（!）
console.log(true && false); // false
console.log(true || false); // true
console.log(!true); // false
比较操作会返回布尔值
console.log(5 > 3); // true
console.log(5 === 5); // true
console.log(5 !== 3); // true

2.null，Null类型只有一个唯一的字面值null， null 值的特殊关键字。JavaScript 是大小写敏感的，因此 null 与 Null、NULL或变体完全不同。

null 表示一个故意的空值或不存在的对象。通常用来表示一个对象变量尚未指向任何对象。
虽然 null 是一个原始值，但 typeof null 返回 "object"。这实际上是 JavaScript 语言中的一个历史遗留 bug。
console.log(typeof null); // "object"
当被转换为数字时，null 变为 0。
当被转换为布尔值时，null 变为 false。
null 与 undefined 是不同的:
null 是一个表示"无"的对象，转为数值时为 0。
undefined 是一个表示"缺少值"的原始值，转为数值时为 NaN。

3.undefined，Undefined类型只有一个唯一的字面值undefined，undefined 表示变量未赋值时的属性。而undefined是JavaScript中的一个全局变量，即挂载在window对象上的一个变量，并不是关键字。

当如下情况时，出现undefined值：
1)声明变量（如使用let或var声明变量但不赋值时）时，没有赋初值：
let a;
console.log(a); // undefined
2)使用创建的数组，对象中不存在的属性值：
let obj = {};
console.log(obj.property); // undefined
let arr = [1, 2, 3];
console.log(arr[5]); // undefined
3)函数没有返回结果
function myFunction() {
// 没有 return 语句
}
console.log(myFunction()); // undefined
4)如果一个变量显式地被赋值为 undefined，它也是 undefined:
let b = undefined;
console.log(b); // undefined
顺便提示，在浏览器的开发者工具中输入let a = 10回车后，也返回Undefined的原因
控制台返回 undefined 不是表示 a 的值，而是表示这个语句（statement）本身没有返回值，而控制台总是显示每个输入的返回值，这种行为是 JavaScript 控制台的一个特性（控制台行为），目的是为了在每次输入后提供一些反馈。当一个操作不返回值时（如变量声明），控制台会显示 undefined 来表示操作已完成。如果您在输入 let a = 10 后立即在控制台输入 a，您会看到输出是 10，这才是 a 的实际值。

4.数字（Number），整数或浮点数，例如： 42 或者 3.14159。

JavaScript 的 Number 类型使用 64 位来表示一个数字，其中包括：
1 位用于符号（表示正负），11 位用于指数，52 位用于有效数字（即尾数）。
由于这种存储方式，JavaScript 在处理某些数学运算时可能会出现精度问题。例如：
console.log(0.1 + 0.2); // 输出 0.30000000000000004，而不是 0.3
0.1 + 0.2 === 0.3 // 返回 false
0.1 + 0.2 // 返回 0.30000000000000004
JavaScript 的 Number 类型还包含几个特殊值：
NaN（Not a Number）：表示非法或未定义的数值操作。
Infinity 和 -Infinity：分别表示正无穷大和负无穷大。
【NaN 是一个特殊的浮点数值，用于表示那些未定义或无法表示的运算结果。NaN 具有一些独特的性质：
1）任何涉及 NaN 的运算结果仍然是 NaN。例如，如果 a 是 NaN，那么 a + 1、a - 1、a * 2 或 a / 2 都将是 NaN。
2)NaN 不等于任何值，包括它自身。这意味着你不能通过简单的比较操作来检测一个值是否是 NaN。相反，你需要使用特定的函数或方法来判断。
3)NaN 是无序的。在比较操作中，NaN 被视为既不大于也不小于任何值，包括它自身。
Infinity含义：表示正无穷大
出现情况：
a) 超出 JavaScript 可以表示的最大数值
b) 正数除以 0
特性：Infinity 大于任何其他数值（除了 NaN）
示例：
console.log(1/0); // Infinity
console.log(Infinity > Number.MAX_VALUE); // true
-Infinity含义：表示负无穷大
出现情况：
a) 超出 JavaScript 可以表示的最小负数值
b) 负数除以 0
特性：-Infinity 小于任何其他数值（除了 NaN）
示例：
console.log(-1/0); // -Infinity
console.log(-Infinity < -Number.MAX_VALUE); // true 】

5.任意精度的整数（BigInt），可以安全地存储和操作大整数。 ECMAScript 2020 引入了一个新的原始数据类型BigInt，用于表示任意精度的整数。在之前的版本中，JavaScript只能表示有限范围的整数，超出范围的整数会被转换为特殊的Infinity值。

通过大整数数据类型BigInt，你可以进行高精度的整数运算，应用在科学计算、金融应用等需要高精度的场景中。

6.字符串（String），字符串是一串表示文本值的字符序列，例如："Howdy"。

在JavaScript中，有三种表示字符串的方法：
1)单引号 ('')：
这是最简单的字符串表示方法之一。
例如：let str = 'Hello, World!';
如果字符串本身包含单引号，需要使用反斜杠()转义。
2)双引号 ("")：
功能上与单引号完全相同。
例如：let str = "Hello, World!";
如果字符串本身包含双引号，需要使用反斜杠()转义。
3)反引号 (``)（ES6引入，也称为模板字面量）：
也称为模板字面量，提供了更多功能。
支持多行字符串。
允许在字符串中嵌入表达式，使用${}语法。
例如：
let name = "Alice";
let greeting = `Hello, ${name}!
Welcome to JavaScript.`;
这三种方法的比较：
单引号和双引号在功能上完全相同，选择使用哪一种通常是个人或项目的编码风格问题。
反引号提供了更多的灵活性，特别是在需要多行字符串或字符串插值时。
在使用单引号或双引号时，如果需要在字符串中包含相同的引号，必须使用反斜杠()进行转义。
反引号不需要对单引号或双引号进行转义。
在使用模板字面量时，如果需要在字符串中包含反引号，仍然需要使用反斜杠()进行转义。

7. 符号（Symbol，在 ECMAScript 2015 / ES6 中新添加的类型）。一种实例是唯一且不可改变的数据类型。

Symbol 常用于为对象属性创建唯一标识符，尤其在处理多次命名相同的属性时非常有用。

二、对象（object）类型，也称为复杂数据类型（Complex Types）,是一种非原始（non-primitive）数据类型，也称为引用值（reference value），用于更复杂的数据结构。JavaScript中的对象类型包括：

1、普通对象（Plain objects）：是指用户自定义的对象类型。这些对象通常是通过使用构造函数或类来定义的。在JavaScript中，有多种方式可以创建对象。在ES6及以后的版本中，JavaScript引入了类（class），这是一种创建和定义对象的新方法。

2、数组（Arrays）：例如let arr = [1, 2, 3]; 数组对象有一些特殊的属性和方法，如length、push、pop等。

3、函数（Functions）：函数也是对象，它们可以有属性和方法。例如：

function sayHello() {

console.log('Hello');

}

sayHello.myProperty = 'This is a property of the function.';

4、日期（Dates）：例如let date = new Date();

5、正则表达式（RegExp，Regular expressions）：例如let regex = /ab+c/;

6、其他内置对象，如Math，Set，Map等。

对于对象（object）类型目前可以不必深究，后面适当的时候将介绍。

JavaScript的数值类型只有一种，即 Number，它遵循 IEEE 754 双精度 64 位浮点数格式。这意味着 JavaScript 的数值类型可以表示整数和浮点数，例如：42 或 3.14159。但其精度和范围都受到双精度浮点数的限制。例如：

let i = 42; // 整数

let f = 3.14; // 浮点数

JavaScript使用Infinity 和 -Infinity：表示正无穷大和负无穷大。例如：

console.log(1 / 0); // Infinity

console.log(-1 / 0); // -Infinity

注意，除以0 在 JavaScript 中并不会引发一个异常，而是返回 Infinity。

为了解决对大整数的需求，JavaScript 引入了 BigInt 类型。BigInt 可以表示任意精度的整数，但不能与 Number 类型混合运算。

例如： javascript let bigInt = 1234567890123456789012345678901234567890n;

【其他语言如C++ 提供多种数值类型，如包括不同大小和精度的整数（如 int, long, long long 等）和浮点数（如 float, double, long double 等），允许更精细的控制和优化，而 JavaScript 只有一种数值类型 Number（除了大整数的 BigInt）。】

不同数据类型的取值范围和大小受特定JavaScript引擎实现方式和底层机制的控制。

JavaScript 的 Number 类型表示双精度 64 位二进制格式的值（IEEE 754 标准）。Number 类型包括整数和浮点数。取值范围：

最小值（最接近 0 的正数）：Number.MIN_VALUE，约为 5e-324

最大值：Number.MAX_VALUE，约为 1.7976931348623157e+308

可以使用如下代码获取它们的取值范围：

console.log("Number.MIN_VALUE:", Number.MIN_VALUE);

console.log("Number.MAX_VALUE:", Number.MAX_VALUE);

BigInt 类型用于表示任意精度的整数。

取值范围：可以表示非常大的整数，它没有具体的大小限制，但受内存限制。

String 类型用于表示文本数据。

取值范围：字符串的长度限制由实现环境决定，但一般可认为是 2^53-1 个字符。可以通过 length 属性获取字符串长度。如：

let str = "Hello, World!";

console.log(str.length); // 13

数组的大小由其元素数量决定。可以使用 length 属性获取数组的长度。如：

let arr = [1, 2, 3, 4, 5];

console.log(arr.length);

JavaScript运算符

JavaScript 中有多种类型的运算符，包括算术运算符、比较运算符、逻辑运算符、赋值运算符、位运算符、字符串运算符、条件（三元）运算符、以及类型运算符。以下是对这些运算符的介绍。

算术运算符

用于执行基本的数学运算。

+: 加法

-: 减法

*: 乘法

/: 除法

%: 取余

++: 自增，值增加1

--: 自减，值减少1

例：

let a = 10;

let b = 5;

console.log(a + b); // 输出 15

console.log(a - b); // 输出 5

console.log(a * b); // 输出 50

console.log(a / b); // 输出 2

console.log(a % b); // 输出 0

比较运算符

用于比较两个值，并返回布尔值（true 或 false）。

==: 等于

===: 全等（值和类型都相等）

!=: 不等于

!==: 全不等（值和类型都不等）

>: 大于

<: 小于

>=: 大于或等于

<=: 小于或等于

例：

console.log(5 == '5'); // 输出 true

console.log(5 === '5'); // 输出 false

console.log(5 != '5'); // 输出 false

console.log(5 !== '5'); // 输出 true

console.log(5 > 3); // 输出 true

console.log(5 < 3); // 输出 false

逻辑运算符

用于逻辑操作，通常与布尔值一起使用。

&&: 逻辑与（AND）

||: 逻辑或（OR）

!: 逻辑非（NOT）

例：

console.log(true && false); // 输出 false

console.log(true || false); // 输出 true

console.log(!true); // 输出 false

赋值运算符

用于给变量赋值。

=: 赋值

+=: 加和赋值

-=: 减和赋值

*=: 乘和赋值

/=: 除和赋值

%=: 取余和赋值

例：

let x = 10;

x += 5; // 等效于 x = x + 5

console.log(x); // 输出 15

位运算符

对二进制位进行操作。

&: 按位与

|: 按位或

^: 按位异或

~: 按位非

<<: 左移

>>: 右移

>>>: 无符号右移

例：

console.log(5 & 1); // 输出 1

console.log(5 | 1); // 输出 5

console.log(5 ^ 1); // 输出 4

console.log(~5); // 输出 -6

console.log(5 << 1); // 输出 10

console.log(5 >> 1); // 输出 2

字符串运算符

通常用于连接字符串。

+: 连接字符串

例：

let str1 = "Hello";

let str2 = "World";

console.log(str1 + " " + str2); // 输出 "Hello World"

条件（三元）运算符

用于在一个表达式内做出条件判断。

condition ? exprIfTrue : exprIfFalse

例：

let age = 18;

let canVote = (age >= 18) ? "Yes" : "No";

console.log(canVote); // 输出 "Yes"

类型运算符

用于检测变量的类型。

typeof: 返回变量的数据类型

instanceof: 检查对象是否是某构造函数的实例

例：

console.log(typeof 42); // 输出 "number"

console.log(typeof 'hello'); // 输出 "string"

console.log(typeof true); // 输出 "boolean"

console.log([1, 2, 3] instanceof Array); // 输出 true

上面提到的运算符是比较常用的，除此之外，还有一元（单目）运算符、按位运算符等等。

数据类型转换

类型转换可以分为显式转换和隐式转换。显式转换是通过使用函数或方法明确地将一种数据类型转换为另一种数据类型；隐式转换则是 JavaScript 自动在表达式上下文中进行的转换。

显式转换

显式转换是通过函数或方法将数据类型明确地转换为另一种数据类型。

1. 转换为字符串

使用 String 函数：

let num = 123;

let str = String(num); // "123"

console.log(str);

使用 toString 方法：

let num = 123;

let str = num.toString(); // "123"

console.log(str);

2. 转换为数字

使用 Number 函数：

let str = "123";

let num = Number(str); // 123

console.log(num);

使用 parseInt 和 parseFloat：

let strInt = "123";

let numInt = parseInt(strInt); // 123

console.log(numInt);

let strFloat = "123.45";

let numFloat = parseFloat(strFloat); // 123.45

console.log(numFloat);

3. 转换为布尔值

使用 Boolean 函数：

let value = 0;

let bool = Boolean(value); // false

console.log(bool);

value = "hello";

bool = Boolean(value); // true

console.log(bool);

隐式转换

隐式转换是 JavaScript 自动进行的类型转换，通常在表达式中发生。

1. 字符串拼接

当一个数字与字符串进行拼接时，数字会被转换为字符串：

let num = 123;

let str = "The number is " + num; // "The number is 123"

console.log(str);

2. 数值运算

当字符串包含数字时，进行数值运算时会被转换为数字：

let str = "123";

let result = str - 0; // 123

console.log(result);

result = str * 1; // 123

console.log(result);

result = str / 1; // 123

console.log(result);

以下是一些常见的类型转换示例：

// Number to String

let num = 123;

let str = num.toString(); // "123"

// String to Number

let strNum = "123";

let numFromString = Number(strNum); // 123

// Boolean to String

let bool = true;

let boolStr = bool.toString(); // "true"

// String to Boolean

let falseStr = "";

let trueStr = "hello";

let boolFromString1 = Boolean(falseStr); // false

let boolFromString2 = Boolean(trueStr); // true

// Automatic type coercion

let result = "123" - 0; // 123

result = "123" * 1; // 123

result = "123" / 1; // 123

关于JavaScript数据类型和运算符更多情况可见https://blog.youkuaiyun.com/cnds123/article/details/109307676