目录
五、类型转换
5.1 转换必要性
根本原因：JS弱类型特性
典型问题场景：
// 表单/prompt获取的值都是字符串
let price1 = prompt('请输入价格');
let price2 = prompt('请输入价格');
console.log(price1 + price2); // 字符串拼接而非加法！转换本质：将数据转为目标类型再操作
5.2 隐式转换（系统自动）
触发规则：
操作符 |
转换规则 |
示例 |
结果 |
+ |
任一侧为字符串 → 字符串拼接 |
'3' + 2 |
'32' |
- * / |
转为数字计算 |
'8' - '3' |
5 (数字) |
比较符 |
数字优先比较 |
'10' > 9 |
true |
开发技巧：
1.快速转数字：+str（如 +'12' → 12）
2.任何数据+字符串=字符串
5.3 显式转换（主动控制）
三类转换函数对比：
方法 |
特点 |
示例 |
返回值 |
适用场景 |
Number(value) |
严格整体转换 |
Number('12.3px') |
NaN |
需要精确转换时 |
parseInt(str) |
提取整数（忽略非数字后缀） |
parseInt('12.3px') |
12 |
解析带单位的数字 |
parseFloat(str) |
提取浮点数 |
parseFloat('12.3') |
12.3 |
解析含小数的字符串 |
NaN深入理解：
全称：Not a Number
类型：typeof NaN → 'number'
特性：
NaN === NaN; // false！唯一不等于自身的值
isNaN(NaN); // true 检测方法六、常见错误解析
6.1 常量未初始化
错误提示：Uncaught SyntaxError: Missing initializer in const declaration
代码示例：
const age; // 错误！缺少初始化
console.log(age);本质原因：const声明必须立即赋值
修复方案：const age = 18;
6.2 变量未定义
错误提示：Uncaught ReferenceError: age is not defined
典型场景：
// 场景1：忘记声明
console.log(userAge); // userAge未声明
// 场景2：拼写错误
let userName = 'Tom';
console.log(usarName); // 字母拼错调试技巧：使用IDE的变量重命名功能避免拼写错误
6.3 重复声明变量
错误提示：Uncaught SyntaxError: Identifier 'age' has already been declared
冲突案例：
let age = 18;
let age = 21; // 同一作用域禁止重复声明正确做法：
let age = 18;
age = 21; // 直接赋值更新6.4 修改常量值
错误提示：Uncaught TypeError: Assignment to constant variable
经典错误：
const PI = 3.14;
PI = 3.14159; // 禁止修改常量设计原则：
"用const声明，除非确定需要重新赋值"
七、运算符与表达式
7.1 赋值运算符
核心功能：对变量赋值
基础运算符：=（将右侧值赋给左侧变量）
let x = 10; // 基础赋值复合赋值运算符：
运算符 |
等效表达式 |
示例 |
结果 (x初始为10) |
+= |
x = x + y |
x += 5 |
x = 15 |
-= |
x = x - y |
x -= 3 |
x = 7 |
*= |
x = x * y |
x *= 2 |
x = 20 |
/= |
x = x / y |
x /= 4 |
x = 2.5 |
%= |
x = x % y |
x %= 3 |
x = 1 |
开发技巧：
循环计数简化：count += 1 代替 count = count + 1
7.2 一元运算符
自增运算符：
类型 |
符号 |
等效操作 |
特点 |
前置自增 |
++x |
x = x + 1 |
先自增后返回值 |
后置自增 |
x++ |
x = x + 1 |
先返回值后自增 |
自减运算符：
类型 |
符号 |
等效操作 |
前置自减 |
--x |
x = x - 1 |
后置自减 |
x-- |
x = x - 1 |
关键区别示例：
let a = 5;
let b = a++; // b=5, a=6（后置：先赋值后自增）
let c = 5;
let d = ++c; // d=6, c=6（前置：先自增后赋值）使用场景：
1.循环计数器：for(let i=0; i<10; i++) {...}
2.数组遍历索引控制
7.3 比较运算符
基础比较符：
运算符 |
名称 |
说明 |
> |
大于 |
5 > 3 → true |
< |
小于 |
'a' < 'b' → true |
>= |
大于等于 |
5 >= 5 → true |
<= |
小于等于 |
10 <= 9 → false |
相等性判断：
运算符 |
特点 |
示例 |
结果 |
== |
值相等（隐式类型转换） |
'5' == 5 |
true |
=== |
严格相等（类型+值） |
'5' === 5 |
false |
!= |
值不相等 |
'5' != 5 |
false |
!== |
严格不相等 |
'5' !== 5 |
true |
三大黄金规则：
字符串比较：按字符ASCII码逐位对比
'apple' > 'banana' // false（a的ASCII=97, b=98）
'10' > '2' // false（比较首位字符'1'(49)和'2'(50)）NaN特性：
NaN === NaN; // false（唯一不等于自身的值）
isNaN(NaN); // true（正确检测方法）小数精度问题：
0.1 + 0.2 === 0.3; // false（实际≈0.30000000000000004）
// 解决方案：使用精度容差 Math.abs(a-b) < 1e-10开发铁律：
始终使用 === 和 !== 避免隐式转换陷阱
7.4 逻辑运算符
三大逻辑操作：
运算符 |
名称 |
功能 |
真值表规律 |
||
&& |
逻辑与 |
两侧全真为真 |
一假则假 |
||
` |
` |
逻辑或 |
至少一侧为真即真 |
一真则真 |
|
! |
逻辑非 |
取反（真→假，假→真） |
真变假，假变真 |
短路运算原理：
运算符 |
短路规则 |
应用场景 |
||||
&& |
遇假即停，返回假值操作数 |
条件执行：isLogin && showUserMenu() |
||||
` |
` |
遇真即停，返回真值操作数 |
默认值设置：`name |
'匿名用户'` |
7.5 运算符优先级
完整优先级表（从高到低）：
优先级 |
运算符类型 |
具体运算符 |
示例 |
||
1 |
分组 |
() |
(2+3)*4 → 20 |
||
2 |
一元运算符 |
++ -- ! +（正号） |
!false → true |
||
3 |
乘除取模 |
* / % |
5 + 3*2 → 11 |
||
4 |
加减 |
+ - |
10 - 3 + 2 → 9 |
||
5 |
关系比较 |
> < >= <= |
5 > 3 == true → true |
||
6 |
相等性判断 |
== != === !== |
|||
7 |
逻辑与 |
&& |
`true |
false && false→true` |
|
8 |
逻辑或 |
` |
` |
||
9 |
赋值 |
= += -= 等 |
两大黄金法则：
1.同级运算从左到右（除赋值运算符从右到左）
2.不确定时用()显式分组
7.6 表达式 vs 语句
本质区别：
特性 |
表达式 |
语句 |
定义 |
产生值的代码片段 |
执行操作的指令 |
能否赋值 |
可被赋值（有返回值） |
不可被赋值（无返回值） |
示例 |
3 + 4 → 7 |
if(...){...}（条件执行） |
x > 5 → true/false |
for(...){...}（循环控制） |
|
isValid && submit() → 返回值 |
break（中断执行） |
代码形态对比：
// 表达式（可放在赋值右侧）
let result = prompt('输入'); // prompt()是函数表达式
let sum = 10 + 20; // 算术表达式
// 语句（独立指令）
alert('警告！'); // 函数调用语句
if (age > 18) { // 条件语句
console.log('成年');
}开发注意：
1.箭头函数要求返回表达式：() => x * 2
2.控制流语句不能出现在赋值右侧：let x = if(...){...} ❌