---

一、数组

数组的概念

数组可以把一组相关的数据一起存放，并提供方便的访问(获取）方式。
数组是指一组数据的集合，其中的每个数据被称作元素，在数组中可以存放任意类型的元素。数组
是一种将一组数据存储在单个变量名下的优雅方式。

创建数组

利用 new 创建数组

var 数组名 = new Array() ；
var arr = new Array();   // 创建一个新的空数组

利用数组字面量创建数组

//1. 使用数组字面量方式创建空的数组
var  数组名 = []；
//2. 使用数组字面量方式创建带初始值的数组
var  数组名 = ['小白','小黑','大⻩','瑞奇'];

二、函数

什么是函数

函数是 JavaScript 的核心组成部分，是可重复使用的代码块，用于封装特定逻辑、接收输入（参数）、返回输出（返回值），也是实现代码模块化、复用性的核心手段。JavaScript 中的函数兼具「普通函数」和「一等公民」特性（可作为参数 / 返回值 / 赋值给变量），还支持闭包、高阶函数等高级特性。

函数的两种声明方式

命名函数

// 声明定义方式
function fn() {...}
// 调用  
fn();  

匿名函数

// 这是函数表达式写法，匿名函数后面跟分号结束
var fn = function(){...}；
// 调用的方式，函数调用必须写到函数体下面
fn()

三、DOM

什么是DOM

DOM（Document Object Model，文档对象模型）是 W3C 制定的跨平台、语言无关的编程接口标准，它将 HTML/XML 文档抽象为树形结构的对象模型，使编程语言（如 JavaScript）能够访问、操作、修改文档的内容、结构和样式。简单来说，DOM 是「文档」与「程序」之间的桥梁，让静态的标记语言具备动态交互能力。

获取元素的方式

getElementById()

// 匹配 <div id="app"></div>
const app = document.getElementById('app'); 
console.log(app); // <div id="app"></div>
console.log(document.getElementById('none')); // null

getElementsByTagName()

// 全局查找所有p标签
const allPs = document.getElementsByTagName('p'); 
// 仅在#app内查找div标签（局部查找）
const appDivs = document.getElementById('app').getElementsByTagName('div');

// HTMLCollection需通过索引访问
console.log(allPs[0]); // 第一个p元素
console.log(allPs.length); // p元素总数

getElementsByClassName()

// 全局查找包含box类的元素
const boxes = document.getElementsByClassName('box');
// 查找同时包含box和active类的元素
const activeBoxes = document.getElementsByClassName('box active');

querySelector()

// 按ID选择
const app = document.querySelector('#app');
// 按类选择第一个box
const firstBox = document.querySelector('.box');
// 复合选择器：#app下的第一个p标签（带active类）
const activeP = document.querySelector('#app p.active');
// 属性选择器：匹配name="email"的输入框
const emailInput = document.querySelector('input[name="email"]');

querySelectorAll()

// 选择所有box类元素
const allBoxes = document.querySelectorAll('.box');
// 遍历NodeList
allBoxes.forEach(box => {
  box.style.color = 'red';
});
// 转为数组（兼容低版本）
const boxArray = Array.from(allBoxes); 
// 或 [].slice.call(allBoxes)

总结

本次学习涵盖 JavaScript 三大核心基础：数组、函数与 DOM。数组作为存储一组数据的集合，可通过 new 关键字或数组字面量创建，能便捷存放并访问任意类型元素；函数是封装可复用代码块的核心，具备参数接收、返回值输出特性，支持命名函数和匿名函数两种声明方式，也是实现代码模块化的关键；DOM 则是连接文档与程序的桥梁，将 HTML/XML 抽象为树形对象模型，可通过 getElementById、getElementsByTagName 等基础方法，或 querySelector/querySelectorAll 这类灵活的 CSS 选择器方法获取元素，进而实现对页面内容、结构和样式的动态操作。掌握这些基础，是实现 JavaScript 数据管理、逻辑封装和页面交互的核心前提