JS基础学习
- JS迈出第一步
- 控制台打印
- 网页直接显示内容
- 标识符与变量
- 标识符的命名规范
- 变量的声明与使用
- 运算符与表达式
- 算术运算符
- 赋值运算符
- 比较运算符
- 逻辑运算符
- 程序控制结构
- 分支结构
- if-else 语句
- switch 语句
- 循环结构
- for 循环
- while 循环
- do-while 循环
- JS 函数
- 函数的声明与调用
- 函数的参数与返回值
- 函数的简化写法：函数表达式
- 自定义函数
- 全局函数
- 局部函数
- 新手避坑小贴士
JS迈出第一步
学习任何语言，都是从输出一句简单的内容开始，JS 也不例外，常见的两种输出方式如下：
控制台打印
通过 console.log() 可以在浏览器开发者工具的控制台输出内容，步骤简单易操作：
html
<!DOCTYPEhtml><htmllang="zh-CN"><head><metacharset="UTF-8"><title>JS第一个程序</title></head><body><script>// 单行注释：控制台输出 Hello JSconsole.log("Hello JS!");</script></body></html>用浏览器打开后按 F12 切换到 Console 面板，就能看到输出结果。
网页直接显示内容
想要内容直接呈现在网页上，可以使用 document.write() 方法，替换上述代码中的 console.log 即可：
document.write("这是我写的第一个JS程序！");标识符与变量
变量是用来存储数据的容器，而标识符是给变量、函数等命名的符号，两者是 JS 程序的基础组成部分。
标识符的命名规范
- 组成规则：可以由字母（A-Z/a-z）、数字（0-9）、下划线（_）、美元符号（$）组成。
- 禁止规则：不能以数字开头；不能使用 JS 的关键字（如 var if for）和保留字（如 class let const）；区分大小写（如 age 和 Age 是两个不同的标识符）
- 命名建议：采用小驼峰命名法，即第一个单词首字母小写，后续单词首字母大写，例如 userName studentScore。
变量的声明与使用
JS 中声明变量有三个关键字：var、let、const，各自的特点和用法不同：
// 1. var 声明：作用域较宽，可重复声明varnum=10;varnum=20;// 不会报错// 2. let 声明：块级作用域，不可重复声明（推荐）letage=18;// let age = 20; // 会报错// 3. const 声明：声明常量，值不可修改，必须初始化constPI=3.1415926;// PI = 3.14; // 会报错注意：变量声明后如果没有赋值，默认值为 undefined。
运算符与表达式
运算符是用来执行运算的符号，表达式则是由运算符和操作数组成的式子，常见的运算符分类如下：
算术运算符
用于基本的数学运算，包括 + - * / %（取余） ++（自增） --（自减）。
leta=10;letb=3;console.log(a+b);// 13console.log(a%b);// 1 取余运算console.log(a++);// 10 先输出a，再让a自增console.log(++a);// 12 先让a自增，再输出赋值运算符
最基础的是 =，还有复合赋值运算符 += -= *= /=。
letx=5;x+=3;// 等价于 x = x + 3，结果为 8比较运算符
用于比较两个值，返回布尔值 true 或 false，包括 > < >= <= ==（值相等） =（值和类型都相等） != !。
console.log(5=="5");// true 只比较值console.log(5==="5");// false 比较值和数据类型逻辑运算符
用于逻辑判断，包括 &&（与） ||（或） !（非）。
letm=10;letn=20;console.log(m>5&&n<25);// true 两个条件都满足console.log(m>15||n>15);// true 满足一个条件即可程序控制结构
JS 程序默认是顺序执行的，而控制结构可以改变执行顺序，分为分支结构和循环结构两类
分支结构
- 根据条件判断执行不同的代码块，常见的有 if-else 和 switch。
if-else 语句
letscore=85;if(score>=90){console.log("优秀");}elseif(score>=80){console.log("良好");}else{console.log("继续努力");}switch 语句
适合多条件等值判断的场景：
letday=3;switch(day){case1:console.log("星期一");break;case3:console.log("星期三");break;default:console.log("其他日期");}循环结构
用于重复执行一段代码，常见的有 for、while、do-while。
for 循环
// 循环输出1-5for(leti=1;i<=5;i++){console.log(i);}while 循环
先判断条件，再执行循环体：
letcount=1;while(count<=3){console.log(count);count++;}do-while 循环
先执行一次循环体，再判断条件，确保循环至少执行一次：
letnum=1;do{console.log(num);num++;}while(num<=2);JS 函数
函数是封装好的、可以重复调用的代码块，能让代码更简洁、更易维护。
函数的声明与调用
使用 function 关键字声明函数，语法格式如下：
/声明函数：计算两个数的和functionsum(a,b){returna+b;// return 返回函数执行结果}// 调用函数letresult=sum(3,5);console.log(result);// 8函数的参数与返回值
参数：声明时写的是形参，调用时传入的是实参；如果实参个数少于形参，多余的形参值为 undefined。
返回值：通过 return 语句返回结果，return 后面的代码不会执行；如果没有 return，函数默认返回 undefined。
函数的简化写法：函数表达式
除了常规声明，还可以用变量存储函数，这种方式叫函数表达式：
letmultiply=function(x,y){returnx*y;};console.log(multiply(4,5));// 20自定义函数
开发者根据需求编写的函数（区别于 alert() 等内置函数），有两种写法：
- 函数声明：function 函数名(参数) { 逻辑 }（支持函数提升）
- 函数表达式：let 变量名 = function(参数) { 逻辑 }（不支持声明前调用）
全局函数
定义在全局作用域（script 最外层）的自定义函数，代码任意位置均可调用，缺点是易造成全局命名污染。
functionglobalFunc(){console.log("全局函数");}globalFunc();// 任意位置能调用局部函数
定义在其他函数内部的自定义函数，仅限父函数内调用，私有性强、避免冲突，还能访问父函数变量（闭包特性）
functionparentFunc(){functionlocalFunc(){console.log("局部函数");}localFunc();// 父函数内可调用}// localFunc(); 外部调用报错新手避坑小贴士
声明变量时，优先使用 let 和 const，避免 var 的作用域问题。
比较值时，尽量用 === 代替 ==，防止类型转换导致的判断错误。
循环中要注意设置终止条件，避免出现死循环。
函数调用时，实参和形参的顺序要对应，否则会得到错误的结果。
写在最后
