（02）javascript 中变量与数据类型详解

以下是 JavaScript 中 变量 和 数据类型 的全面详解，包含示例说明：

一、变量（Variables）

JavaScript 中变量用于存储数据，通过 var、let、const 声明。

1. var (ES5)

• 作用域：函数作用域（在函数内声明）或全局作用域。
• 提升（Hoisting）：变量声明会被提升到作用域顶部。
• 可重复声明：允许重复声明同一变量。
• 示例：

  var a = 10;
  if (true) {
    var a = 20; // 覆盖外部的 a
  }
  console.log(a); // 20
  

2. let (ES6)

• 作用域：块级作用域（{} 内有效）。
• 不可重复声明：同一作用域内不可重复声明。
• 暂时性死区：声明前访问会报错。
• 示例：

  let b = 10;
  if (true) {
    let b = 20; // 与外部的 b 无关
    console.log(b); // 20
  }
  console.log(b); // 10
  

3. const (ES6)

• 作用域：块级作用域。
• 不可重新赋值：声明时必须初始化，且不能重新赋值。
• 对象/数组可修改：对象属性或数组元素可修改。
• 示例：

  const c = 30;
  c = 40; // 报错：Assignment to constant variable
  
  const obj = { name: "Alice" };
  obj.name = "Bob"; // 允许修改属性
  

二、数据类型（Data Types）

JavaScript 是动态类型语言，数据类型分为 原始类型（Primitive） 和 对象类型（Object）。

1. 原始类型（Primitive Types）

• string：字符串。

  let str = "Hello";
  let templateStr = `Hello, ${str}!`; // 模板字符串（ES6）
  

• number：数字（整数、浮点数、Infinity、NaN）。

  let num = 42;
  let float = 3.14;
  let nan = NaN; // 非数字
  let inf = Infinity;
  

• boolean：布尔值（true/false）。

  let isTrue = true;
  let isFalse = false;
  

• null：表示空值（需显式赋值）。

  let empty = null; // 通常用于主动清空对象
  

• undefined：未定义的值（默认初始值）。

  let uninitialized;
  console.log(uninitialized); // undefined
  

• symbol (ES6)：唯一且不可变的值，用于对象属性键。

  const sym1 = Symbol("key");
  const sym2 = Symbol("key");
  console.log(sym1 === sym2); // false（唯一性）
  

• bigint (ES2020)：大整数（以 n 结尾）。

  const bigNum = 123456789012345678901234567890n;
  

2. 对象类型（Object Types）

• Object：通用对象。

  const person = {
    name: "Alice",
    age: 30,
    greet() { console.log("Hello!"); }
  };
  

• Array：数组。

  const arr = [1, "two", true];
  arr.push({ name: "Bob" });
  

• Function：函数。

  function add(a, b) { return a + b; }
  const multiply = (a, b) => a * b; // 箭头函数
  

• Date：日期。

  const now = new Date();
  console.log(now.toISOString());
  

• 其他内置对象：
  • RegExp：正则表达式。
  • Error：错误对象（如 new Error("Oops!")）。
  • Map/Set (ES6)：键值对集合/唯一值集合。

三、类型检测与转换

1. 类型检测

• typeof：检测原始类型（注意 typeof null 返回 "object"）。

  typeof "hello"; // "string"
  typeof null;    // "object"（历史遗留问题）
  typeof [1,2,3]; // "object"
  

• instanceof：检测对象类型。

  [] instanceof Array;  // true
  {} instanceof Object; // true
  

• Array.isArray()：检测数组。

  Array.isArray([1,2,3]); // true
  

2. 类型转换

• 显式转换：

  Number("123");    // 123
  String(123);      // "123"
  Boolean(0);       // false
  

• 隐式转换：

  "5" + 1;  // "51"（字符串拼接）
  "5" - 1;  // 4（数字运算）
  

四、注意事项

1. null vs undefined：
   • null 是开发者主动赋值的空值。
   • undefined 表示变量未初始化。
2. 引用类型比较：

   {} === {};          // false（不同对象）
   [1,2] === [1,2];    // false（不同数组）
   

3. 原始类型包装对象：

   const str = "hello";
   str.toUpperCase(); // 自动转换为 String 对象
   

五、总结

• 变量声明：优先使用 const 和 let，避免 var。
• 数据类型：
  • 原始类型：直接存储值，不可变。
  • 对象类型：存储引用，属性可变。
• 类型检测：结合 typeof、instanceof 和专用方法（如 Array.isArray()）。