javascript數據類型基礎示例代碼分析

JavaScript數據類型基礎示例代碼分析

JavaScript是一種動態類型的編程語言，這意味著變量在聲明時不需要指定數據類型，數據類型會在運行時自動確定。JavaScript中的數據類型可以分為兩大類：原始類型（Primitive Types）和引用類型（Reference Types）。本文將詳細分析JavaScript中的數據類型，并通過示例代碼來幫助理解這些數據類型的使用。

1. 原始類型（Primitive Types）

原始類型是JavaScript中最基本的數據類型，它們是不可變的（immutable），即一旦創建就不能被修改。JavaScript中的原始類型包括：

• Number
• String
• Boolean
• Null
• Undefined
• Symbol（ES6新增）
• BigInt（ES2020新增）

1.1 Number

Number類型用于表示整數和浮點數。JavaScript中的數字是雙精度64位浮點數，遵循IEEE 754標準。

let integer = 42; // 整數
let float = 3.14; // 浮點數
let scientific = 5e3; // 科學計數法，表示5000
let infinity = Infinity; // 無窮大
let nan = NaN; // 非數字（Not-a-Number）

console.log(integer); // 42
console.log(float); // 3.14
console.log(scientific); // 5000
console.log(infinity); // Infinity
console.log(nan); // NaN

1.2 String

String類型用于表示文本數據。字符串可以用單引號、雙引號或反引號（模板字符串）定義。

let singleQuoted = 'Hello, World!';
let doubleQuoted = "Hello, World!";
let templateLiteral = `Hello, World!`;

console.log(singleQuoted); // Hello, World!
console.log(doubleQuoted); // Hello, World!
console.log(templateLiteral); // Hello, World!

模板字符串支持多行文本和嵌入表達式：

let name = "Alice";
let greeting = `Hello, ${name}!
Welcome to JavaScript.`;

console.log(greeting);
// 輸出:
// Hello, Alice!
// Welcome to JavaScript.

1.3 Boolean

Boolean類型只有兩個值：true和false，用于表示邏輯上的真和假。

let isTrue = true;
let isFalse = false;

console.log(isTrue); // true
console.log(isFalse); // false

1.4 Null

Null類型只有一個值：null，表示一個空值或不存在的對象。

let emptyValue = null;

console.log(emptyValue); // null

1.5 Undefined

Undefined類型也只有一個值：undefined，表示變量已聲明但未賦值。

let undefinedValue;

console.log(undefinedValue); // undefined

1.6 Symbol

Symbol類型是ES6新增的原始類型，表示唯一的、不可變的值，通常用作對象屬性的鍵。

let sym1 = Symbol("description");
let sym2 = Symbol("description");

console.log(sym1 === sym2); // false，每個Symbol都是唯一的

let obj = {
  [sym1]: "value"
};

console.log(obj[sym1]); // value

1.7 BigInt

BigInt類型是ES2020新增的原始類型，用于表示任意精度的整數。BigInt類型的值可以通過在整數后面加上n來創建。

let bigInt = 1234567890123456789012345678901234567890n;

console.log(bigInt); // 1234567890123456789012345678901234567890n

2. 引用類型（Reference Types）

引用類型是JavaScript中的復雜數據類型，它們是可變的（mutable），即可以在創建后修改。引用類型包括：

• Object
• Array
• Function
• Date
• RegExp
• Map
• Set
• WeakMap
• WeakSet

2.1 Object

Object是JavaScript中最常用的引用類型，用于存儲鍵值對。對象的鍵是字符串或Symbol類型，值可以是任意類型。

let person = {
  name: "Alice",
  age: 25,
  isStudent: false
};

console.log(person.name); // Alice
console.log(person.age); // 25
console.log(person.isStudent); // false

2.2 Array

Array是用于存儲有序數據集合的引用類型。數組中的元素可以是任意類型，包括其他數組和對象。

let numbers = [1, 2, 3, 4, 5];
let mixed = [1, "two", true, { name: "Alice" }];

console.log(numbers[0]); // 1
console.log(mixed[2]); // true
console.log(mixed[3].name); // Alice

2.3 Function

Function是JavaScript中的函數類型，函數也是對象，可以像其他對象一樣被賦值、傳遞和返回。

function greet(name) {
  return `Hello, ${name}!`;
}

let sayHello = greet;

console.log(sayHello("Alice")); // Hello, Alice!

2.4 Date

Date類型用于表示日期和時間。JavaScript中的Date對象提供了豐富的日期和時間操作方法。

let now = new Date();

console.log(now); // 當前日期和時間
console.log(now.getFullYear()); // 當前年份
console.log(now.getMonth() + 1); // 當前月份（注意：月份從0開始）
console.log(now.getDate()); // 當前日期

2.5 RegExp

RegExp類型用于表示正則表達式，正則表達式用于匹配字符串中的模式。

let regex = /hello/i; // 不區分大小寫的正則表達式

console.log(regex.test("Hello, World!")); // true
console.log(regex.test("hi there")); // false

2.6 Map

Map是ES6新增的引用類型，用于存儲鍵值對。與Object不同，Map的鍵可以是任意類型。

let map = new Map();

map.set("name", "Alice");
map.set(1, "one");

console.log(map.get("name")); // Alice
console.log(map.get(1)); // one

2.7 Set

Set是ES6新增的引用類型，用于存儲唯一值的集合。

let set = new Set();

set.add(1);
set.add(2);
set.add(2); // 重復值不會被添加

console.log(set.size); // 2
console.log(set.has(1)); // true

2.8 WeakMap 和 WeakSet

WeakMap和WeakSet是ES6新增的引用類型，它們與Map和Set類似，但鍵只能是對象，并且是弱引用，不會阻止垃圾回收。

let weakMap = new WeakMap();
let obj1 = {};

weakMap.set(obj1, "value");

console.log(weakMap.get(obj1)); // value

let weakSet = new WeakSet();
let obj2 = {};

weakSet.add(obj2);

console.log(weakSet.has(obj2)); // true

3. 類型檢測

在JavaScript中，可以使用typeof操作符來檢測變量的數據類型。

console.log(typeof 42); // "number"
console.log(typeof "hello"); // "string"
console.log(typeof true); // "boolean"
console.log(typeof null); // "object"（注意：這是一個歷史遺留問題）
console.log(typeof undefined); // "undefined"
console.log(typeof Symbol("sym")); // "symbol"
console.log(typeof 123n); // "bigint"
console.log(typeof {}); // "object"
console.log(typeof []); // "object"
console.log(typeof function() {}); // "function"

需要注意的是，typeof null返回"object"，這是一個歷史遺留問題。要檢測null，可以使用===操作符：

let value = null;

console.log(value === null); // true

4. 類型轉換

JavaScript中的類型轉換可以分為隱式轉換和顯式轉換。

4.1 隱式轉換

隱式轉換是JavaScript在運行時自動進行的類型轉換。例如，在字符串和數字之間進行加法操作時，數字會被轉換為字符串。

let num = 42;
let str = "The answer is " + num;

console.log(str); // The answer is 42

4.2 顯式轉換

顯式轉換是通過調用內置函數或操作符手動進行的類型轉換。

let str = "42";
let num = Number(str);

console.log(num); // 42

let bool = Boolean(0);

console.log(bool); // false

5. 總結

JavaScript中的數據類型分為原始類型和引用類型。原始類型是不可變的，包括Number、String、Boolean、Null、Undefined、Symbol和BigInt。引用類型是可變的，包括Object、Array、Function、Date、RegExp、Map、Set、WeakMap和WeakSet。

理解JavaScript中的數據類型及其特性對于編寫高效、可靠的代碼至關重要。通過本文的示例代碼分析，希望讀者能夠更好地掌握JavaScript中的數據類型及其使用方法。