全部学科
Web前端
TypeScript vue CSS HTML javascript npm pinia vite
GO后端
golang gorm gin
JAVA后端
maven spring Mytatis SpringMVC SpringBoot java
通用技术
redis git docker nginx mysql zookeeper rabbitmq
Python全栈
python
NodeJS全栈
nodejs
javascript / 专题
📝 1 篇文章 20 道配套习题

JS 对象与数组

专题说明

本专题系统讲解JavaScript对象与数组的核心知识，涵盖对象字面量创建、属性访问与修改、数组字面量、数组索引与长度、数组遍历方法、解构赋值、展开运算符、常用数组方法、对象遍历等内容。

学习目标

  1. 掌握对象字面量的创建与属性访问方式
  2. 理解点语法与方括号语法的使用场景
  3. 掌握数组字面量的创建与基本操作
  4. 理解数组索引与length属性的关系
  5. 掌握数组遍历方法（forEach、map、filter、for...of）
  6. 理解数组和对象解构赋值的语法与区别
  7. 掌握展开运算符的应用场景与浅拷贝特性
  8. 理解修改原数组与不修改原数组的方法分类
  9. 掌握对象遍历方法（Object.keys/values/entries）
  10. 学会处理对象与数组的嵌套结构

学习内容

本专题涵盖以下核心知识点：

  • 对象字面量：花括号创建、键值对语法、字符串属性名
  • 属性访问与修改：点语法、方括号语法、添加修改删除属性
  • 数组字面量：方括号创建、任意类型元素、空数组
  • 数组索引与长度：索引从0开始、length属性、稀疏数组
  • 数组遍历：forEach、map、filter、for...of、for...in
  • 解构赋值：数组解构、对象解构、默认值、函数参数解构
  • 展开运算符：复制合并数组、复制合并对象、浅拷贝特性
  • 数组方法：push/pop/shift/unshift、slice/splice、map/filter/reduce
  • 对象遍历：Object.keys/values/entries、for...in
  • 嵌套结构：可选链操作符、链式调用处理嵌套数据

学习建议

  1. 区分点语法和方括号语法的适用场景（特殊属性名必须用方括号）
  2. 理解数组length不一定等于实际元素个数（稀疏数组）
  3. 区分修改原数组的方法与不修改原数组的方法
  4. 理解数组解构按顺序、对象解构按属性名的区别
  5. 注意展开运算符是浅拷贝，嵌套对象仍为引用
  6. 优先使用Object.keys/values/entries遍历对象，避免for...in遍历原型链
  7. 掌握可选链?.安全访问嵌套结构，避免报错

📝 配套习题（20 题）

💡 参考答案在文末
判断题
1

JavaScript 数组可以包含不同类型的元素，如 [1, "hello", true, null, {a:1}]。

A

对

B

错

2

对象字面量中的属性名可以使用字符串形式，如 { "name": "张三" }。

A

对

B

错

3

数组的 length 属性总是等于数组中实际元素的个数。

A

对

B

错

单选题
4

以下哪个方法遍历数组并返回一个新数组？

A

forEach

B

map

C

for...of

D

for...in

5

以下代码执行后，name 和 age 的值分别是？

JavaScript
let {name, age} = {name: "张三", age: 20, city: "北京"};
A

name="张三", age=20

B

name="张三", age={age: 20, city: "北京"}

C

name=undefined, age=undefined

D

name={name: "张三"}, age={age: 20}

6

数组 let arr = ["a", "b", "c"]; 中，访问第二个元素 "b" 应该使用？

A

arr[1]

B

arr[2]

C

arr["b"]

D

arr.b

7

以下哪种方式可以创建一个包含三个元素的数组？

A

let arr = (1, 2, 3);

B

let arr = {1, 2, 3};

C

let arr = [1, 2, 3];

D

let arr = <1, 2, 3>;

8

以下代码输出结果是什么？

JavaScript
let data = {users: null};
console.log(data?.users?.[0]?.name);
A

null

B

undefined

C

报错 TypeError

D

"undefined"

9

以下哪种方式可以正确访问对象的 name 属性？

A

obj.name

B

obj[name]

C

obj->name

D

obj::name

10

以下代码输出结果是什么？

JavaScript
let arr = [1, 2, 3];
arr.forEach((item, index) => {
    console.log(index + ":" + item);
});
A

0:1, 1:2, 2:3

B

1:1, 2:2, 3:3

C

1:0, 2:1, 3:2

D

undefined

11

以下哪种方式可以创建一个包含 name 属性的对象？

A

let obj = [name: "张三"];

B

let obj = {name: "张三"};

C

let obj = (name: "张三");

D

let obj = <name: "张三">;

12

以下代码执行后，a 和 b 的值分别是？

JavaScript
let [a, b] = [1, 2, 3];
A

a=1, b=2

B

a=1, b=[2, 3]

C

a=[1, 2], b=3

D

a=1, b=undefined

13

以下代码输出结果是什么？

JavaScript
let arr = [1, 2, 3, 4];
let sum = arr.reduce((acc, cur) => acc + cur, 0);
console.log(sum);
A

[1, 2, 3, 4]

B

10

C

0

D

4

14

以下代码输出结果是什么？

JavaScript
let arr1 = [1, 2];
let arr2 = [...arr1, 3];
console.log(arr2);
A

[1, 2]

B

[3, 1, 2]

C

[1, 2, 3]

D

[[1, 2], 3]

15

以下哪个方法在数组末尾添加元素？

A

push

B

pop

C

shift

D

unshift

16

以下代码输出结果是什么？

JavaScript
let obj = {a: 1, b: 2, c: 3};
console.log(Object.keys(obj));
A

["a", "b", "c"]

B

[1, 2, 3]

C

[["a", 1], ["b", 2], ["c", 3]]

D

{a: 1, b: 2, c: 3}

多选题
17

以下哪些数组方法会修改原数组？

A

push

B

pop

C

map

D

splice

填空题
18

数组字面量使用 ____________ 创建，元素之间用 ____________ 分隔。空数组写为 ____________。数组可以包含 任意类型 的元素。

19

数组索引从 ____________ 开始，最后一个元素的索引是 ____________。访问不存在的索引返回 ____________。length 属性表示 最大索引加1，可以修改它来 截断数组。

20

遍历嵌套数组对象：使用 ____________ 提取嵌套属性，如 items.map(i => i.name)。使用 ____________ 过滤嵌套条件，如 items.filter(i => i.age > 18)。链式调用 ____________ 多个方法，如 items.map(...).filter(...)。

参考答案
1.正确 2.正确 3.错误 4.B 5.A 6.A 7.C 8.B 9.A 10.A 11.B 12.A 13.B 14.C 15.A 16.A 17.A;B;D 18.方括号;逗号;[] 19.0;arr.length - 1;undefined 20.map;filter;组合
想在手机上练习这套专题？
使用微信卷王开发者小程序，打开首页顶部扫码功能识别二维码
← 上一个专题 JS 基础语法与变量
下一个专题 → JS 异步编程入门
扫码体验小程序
加载中
想在手机上刷题学习？
使用微信卷王开发者小程序，打开首页顶部扫码功能识别二维码