数据掌握2026年1月24日星期六

对象与数组

存储数据集合。

广告

查看赞助商以支持 JS Fruggal。

对象和数组是 JavaScript 的容器。掌握它们意味着掌握数据结构操作。

对象 (键值对)

const user = {
  name: "Jane Doe",
  age: 28,
  role: "Admin"
};

// 点符号 (整洁)
console.log(user.name); 

// 括号符号 (动态)
const propToCheck = "role";
console.log(user[propToCheck]);

解构 (解包)

手提箱比喻

想象一个对象是一个打包好的手提箱。
解构 就是打开手提箱,直接把物品拿出来放到你手里。

const settings = {
  theme: "dark",
  fontSize: 16,
  wifi: true
};

// 旧方式:重复
// const theme = settings.theme;
// const fontSize = settings.fontSize;

// 专业方式:解构
const { theme, fontSize } = settings;

console.log(theme); // "dark"

展开运算符 (...)

这将对象或数组“爆炸”成单独的部分。这对 React 至关重要。

const baseUser = { name: "John", age: 30 };

// 创建一个新对象,从 baseUser 复制所有内容,并添加属性
const updatedUser = { ...baseUser, isActive: true };

console.log(updatedUser); 
// { name: "John", age: 30, isActive: true }

数组和方法

const stack = ["HTML", "CSS", "JS"];

// 数组解构
const [first, second] = stack;
console.log(first); // "HTML"

// 数组展开 (合并)
const backend = ["Node", "SQL"];
const fullStack = [...stack, ...backend];
console.log(fullStack);
广告

查看赞助商以支持 JS Fruggal。