一、深浅拷贝深浅拷贝的概念仅适用于引用类型。
（一）浅拷贝
核心概念：浅拷贝是指拷贝对象的地址。
用法
对象拷贝：可使用 Object.assign() 方法或者展开运算符 {...obj} 来实现。
数组拷贝：通过 Array.prototype.concat() 方法或者展开运算符 [...arr] 达成。
案例：当拷贝对象为单层结构时，浅拷贝通常能满足需求。但若是多层嵌套的对象，由于只是拷贝地址，可能会在对新对象操作时影响到原对象。例如：
12345678910111213// 单层对象浅拷贝示例let obj1 = { a: 1 };let obj2 = {...obj1 };obj2.a = 2;console.log(obj1); // { a: 1 }console.log(obj2); // { a: 2 }// 多层对象浅拷贝示例let nestedObj1 = { b: { c: 3 } };let nestedObj2 ...
所有的对象里面都有 __proto__ 对象原型 指向原型对象
所有的原型对象里面有 constructor， 指向 创造改原型对象的构造函数
一、编程思想：从面向过程到面向对象（一）面向过程
核心逻辑：聚焦 “步骤”，将问题拆解为一系列连续的操作，用函数实现每个步骤，最终按顺序调用完成任务。
案例
：制作蛋炒饭
函数 1：准备食材(米饭、鸡蛋、葱花)
函数 2：热油(锅、油)
函数 3：炒鸡蛋(鸡蛋、油)
函数 4：混合翻炒(米饭、鸡蛋、盐)
执行顺序：准备食材() → 热油() → 炒鸡蛋() → 混合翻炒()
适用场景：简单任务（如计算器、单步骤工具），逻辑直接但扩展性差。
（二）面向对象
核心逻辑：聚焦 “对象”，将问题拆解为具有特定功能的对象，通过对象间的协作完成任务。每个对象包含 “数据”（属性）和 “操作”（方法）。
三大特性
封装性：对象内部数据和方法被包裹，仅暴露必要接口（如 “手机” 对象封装了 “芯片”“电池” 等内部组件，只暴露 “打电话”“发消息” 等方法）。
继承性：子类可复用父类的属性和方法（如 “智能手机” 继承 “手机” 的 “通话” ...
一、学习目标
理解面向对象编程的基础概念，明确构造函数的作用。
体会 JavaScript “一切皆对象” 的语言特性。
熟练掌握常见对象属性和方法的使用。
二、知识要点（一）深入对象构造函数
核心概念：构造函数是用于创建对象的函数，使用new关键字调用的函数即为构造函数。
用法及案例
123456<script> function foo() { console.log('通过 new 也能调用函数...'); } new foo;</script>
总结拓展
使用new关键字调用函数称为实例化。
实例化构造函数无参数时可省略()。
构造函数返回值为新创建的对象，内部return返回值无效。
习惯将构造函数首字母大写以区分普通函数。
实例成员
核心概念：通过构造函数创建的对象为实例对象，其属性和方法是实例成员。
用法及案例
123456789101112<script> function Person() { this.name = '小明 ...
学习作用域、变量提升、闭包等语言特征，加深对 JavaScript 的理解，掌握变量赋值、函数声明的简洁语法，降低代码的冗余度。
理解作用域对程序执行的影响
能够分析程序执行的作用域范围
理解闭包本质，利用闭包创建隔离作用域
了解什么变量提升及函数提升
掌握箭头函数、解析剩余参数等简洁语法
作用域
了解作用域对程序执行的影响及作用域链的查找机制，使用闭包函数创建隔离作用域避免全局变量污染。
作用域（scope）规定了变量能够被访问的“范围”，离开了这个“范围”变量便不能被访问，作用域分为全局作用域和局部作用域。
局部作用域局部作用域分为函数作用域和块作用域。
函数作用域在函数内部声明的变量只能在函数内部被访问，外部无法直接访问。
123456789101112<script> // 声明 counter 函数 function counter(x, y) { // 函数内部声明的变量 const s = x + y console.log(s) // 18 } // 设用 counter 函数 counter(10, ...
一、正则表达式正则表达式（Regular Expression）是一种字符串匹配的模式（规则）。
（一）使用场景
验证表单：如手机号表单要求用户只能输入 11 位数字（匹配）。
过滤页面内容中的敏感词（替换），或从字符串中获取特定部分（提取）等。
（二）正则基本使用
定义规则：
1const reg = /表达式/
/ / 是正则表达式字面量。
正则表达式也是 对象。
使用正则：
test() 方法用来查看正则表达式与指定的字符串是否匹配。
如果正则表达式与指定的字符串匹配，返回 true，否则返回 false。
123456789101112<body> <script> // 正则表达式的基本使用 const str = 'web前端开发' // 1. 定义规则 const reg = /web/ // 2. 使用正则 test() console.log(reg.test(str)) // true 如果符合规则匹配上则返回true console.log(reg.t ...
window 对象（一）核心概念BOM（Browser Object Model）即浏览器对象模型，window对象是 BOM 的顶级对象，也是 JavaScript 中的全局对象。
（二）用法
document、alert()、console.log()等都是window的属性，基本 BOM 的属性和方法大多是window的，调用时可省略window。
所有通过var定义在全局作用域中的变量、函数都会变成window对象的属性和方法。
（三）案例略（笔记中相关属性和方法调用示例较多）
（四）拓展window对象还有一些其他属性和方法，如window.innerWidth获取窗口内部宽度，window.open()打开新窗口等，在网页布局和交互中有广泛应用。
定时器 - 延迟函数（一）核心概念setTimeout是 JavaScript 内置的用于延迟执行代码的函数，只执行一次；setInterval为间歇函数，每隔一段时间执行一次。
（二）用法setTimeout语法：setTimeout(回调函数, 延迟时间)，延迟时间单位为毫秒。
123let timerId = setTim ...
一、日期对象掌握 Date 日期对象的使用，动态获取当前计算机的时间。
ECMAScript 中内置了获取系统时间的对象 Date。与 console 和 Math 等内置对象不同，使用 Date 时需借助 new 关键字。
（一）实例化12345// 1. 实例化// const date = new Date(); // 获取系统默认时间const date = new Date('2020-05-01'); // 指定时间// date 变量即所谓的时间对象console.log(typeof date);
（二）方法123456// 1. 实例化const date = new Date();// 2. 调用时间对象方法// 通过方法分别获取年、月、日，时、分、秒const year = date.getFullYear(); // 四位年份const month = date.getMonth(); // 0 ~ 11
**getFullYear**：获取四位年份。
**getMonth**：获取月份，取值范围为 0（代表一月）到 11（代表十二月 ...
一、事件流1. 事件流的两个阶段
捕获阶段：事件从最顶层的父元素（如 html）向目标元素（触发事件的元素）逐层传递，addEventListener 第三个参数为 true 时在此阶段触发。
冒泡阶段：事件从目标元素向最顶层的父元素逐层回溯，addEventListener 第三个参数为 false（默认）时在此阶段触发。
示例：事件流执行顺序
123456789101112131415161718192021<div class="outer" <div class="inner" <div class="child" </div> </div></div><script> const outer = document.querySelector('.outer'); const inner = document.querySelector('.inner'); const child = d ...
学习目标
能够判断函数运行的环境并确定 this 所指代的对象。
理解事件的作用，掌握应用事件的基本步骤。
事件定义与用途事件是编程语言中的术语，用来描述程序的行为或状态。当行为或状态发生改变时，会立即调用一个相应的函数。
示例：
用户使用鼠标点击网页中的按钮
用户拖拽网页中的一张图片
事件监听为了实现DOM元素的交互功能，需要为DOM对象添加事件监听器，等待事件触发时执行特定函数。
12345678910111213141516171819<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>事件监听示例</title></head><body> <h3>事件监听</h3> <p id="text">点击按钮改变文字颜色</p> <button id=" ...
复习：
splice() 方法用于添加或删除数组中的元素。
注意：这种方法会改变原始数组。
删除数组：
splice(起始位置， 删除的个数)
比如：1
123let arr = ['red', 'green', 'blue']arr.splice(1,1) // 删除green元素console.log(arr) // ['red, 'blue']
添加元素
splice(起始位置，删除个数，添加数组元素)
12345let arr = ['red', 'green', 'blue']//arr.splice(1, 0, 'pink') // 在索引号是1的位置添加 pink//console.log(arr) // ['red', 'pink', 'green', 'blue']arr.splice(1, 0, 'p ...
