前言本周系统完成JavaScript入门基础知识学习覆盖JS整体构成、代码三种书写形式、变量常量、数据类型、类型转换、运算符优先级、分支与循环语句、数组增删改查全套操作复习一下学的内容夯实页面交互开发的基本功。一、JavaScript整体认知JavaScript是运行在浏览器客户端的脚本语言四大核心用途制作网页动态特效、表单合法性校验、前后端数据交互、Node.js服务端开发。整体分为三大部分1. ECMAScriptJS核心语法规范变量、判断、循环、对象等基础规则都由它定义2. DOM文档对象模型用来修改页面标签样式、结构实现页面变化3. BOM浏览器对象模型控制弹窗、窗口尺寸、本地存储等浏览器行为。JS代码共有三种书写方式内嵌式script标签写在body内最常用、外部JS文件引入src导入独立 .js 文件适合大型项目、行内写法直接写在标签事件中Vue框架会用到原生开发不推荐。配套注释快捷键单行 Ctrl/ 多行 ShiftAltA 代码末尾分号可省略依靠换行自动识别语句结束。二、变量、常量与基础输出1. 变量使用使用 let 声明变量支持声明赋值、先声明后赋值、多变量同时定义变量值以最后一次修改为准。命名硬性规则禁止关键字仅能使用字母、数字、下划线数字不能开头严格区分大小写编码规范命名见名知意统一采用驼峰命名法。2. 常量使用const 用来声明常量一经声明必须初始化赋值全程不允许二次修改固定不变的数据全部用常量定义例如圆周率、固定配置值。3. 三种输出方式alert() 浏览器弹窗提示document.write() 直接向页面写入内容可以识别HTML标签console.log() 控制台打印调试开发最常用。配套输入 prompt() 弹窗接收用户手动输入内容。三、JS五大基础数据类型基础数据类型分为基本类型与引用类型入门重点掌握5种基本类型1. Number数字型整数、小数、八进制、十六进制包含特殊值 Infinity 无穷大、 NaN 非法数字通过 isNaN() 判断是否为非数字2. String字符串单引号、双引号、反引号包裹内容反引号支持模板字符串 ${变量} 直接拼接内容支持 \n 换行、 \ 转义引号等转义字符3. Boolean布尔型只有 true(等价1) 、 false(等价0) 用于条件判断4. Undefined变量声明但未赋值的默认状态5. Null手动赋值代表空值 typeof null 检测结果为object属于历史特性。类型检测统一使用 typeof 关键字快速判断变量属于哪一种基础类型。四、数据类型转换1. 隐式自动转换 拼接任意数据和字符串相加整体转为字符串- * / % 运算自动把内容转为数字计算正号 变量 可以快速把字符串转为数字。2. 显式强制转换1. 转字符串 变量.toString() 、 String(变量) 2. 转数字 parseInt() 取整数、 parseFloat() 保留小数、 Number() 整体强制转换3. 转布尔值 Boolean() 空字符串、0、NaN、null、undefined转为false其余全部为true。五、运算符与优先级运算符从上到下优先级递减括号 一元运算符(、--、!) 算数乘除取模 算数加减 比较运算符 相等判断(严格全等推荐使用) 逻辑运算 、 || 赋值运算符 逗号运算符。重点易错点1. 自增前置 num 先自增再取值后置 num 先取值再自增2. 只对比数值 同时对比数值数据类型业务判断强制使用全等3. 逻辑与 两边全true才成立逻辑或 || 一侧为true就成立 ! 布尔取反。六、流程控制分支与循环1. 分支判断结构if单分支、if-else双分支、if-else if多分支三元运算符 条件 ? 成立代码 : 不成立代码 简化简单判断switch匹配固定值匹配场景使用搭配 break 防止穿透分支较多时效率优于if判断。2. 循环结构1. while 循环必须具备初始值、循环条件、变量自增三个要素未知循环次数首选while2. for 循环已知循环次数首选结构紧凑适合数组遍历3. 关键字 break 直接跳出整个循环 continue 跳过当前单次循环直接进入下一轮4. 支持循环嵌套常用于多层遍历场景。七、数组数据集合增删改查1. 数组创建字面量 let arr [] 推荐、 new Array() 构造函数两种写法。2. 核心操作修改 arr[下标] 新值 直接覆盖元素新增 push() 尾部追加元素 unshift() 头部插入元素删除 pop() 删除最后一项、 shift() 删除第一项、 splice(起始下标,删除个数) 定点删除/修改元素。