一、JS 是什么？核心定位
JavaScript 是一门解释型、弱类型、面向对象的脚本语言，主要用于：
网页交互（如按钮点击、表单验证、动态修改页面内容）；
前端逻辑处理（数据计算、条件判断、循环遍历）；
也可通过 Node.js 做后端开发。
二、JS 基础语法（核心必学）
- 运行方式（新手入门）
方式 1：嵌入 HTML（最常用）
html
预览
<!DOCTYPE html>
方式 2：外部文件引入（项目开发规范） 创建 index.js 文件，写入代码： javascript 运行 console.log("外部JS文件"); 在 HTML 中引入： html 预览
JS 是弱类型语言，变量类型由赋值决定，常用声明关键字：
关键字 作用 示例
let 块级作用域变量（推荐） let age = 18;
const 常量（值不可改） const PI = 3.14;
var 旧版声明（不推荐） var name = "张三";
核心数据类型：
javascript
运行
// 1. 基本类型
let num = 20; // 数字（Number）：整数/小数都算
let str = "JS基础"; // 字符串（String）：单/双引号包裹
let bool = true; // 布尔值（Boolean）：true/false
let empty = null; // 空值：表示无值
let undef; // 未定义：变量声明但未赋值
// 2. 引用类型（后续进阶）
let arr = [1, 2, 3]; // 数组
let obj = {name: "张三", age: 18}; // 对象
- 运算符（和 Java 类似，新增细节）
javascript
运行
// 算术运算符
let a = 10, b = 3;
console.log(a + b); // 13（加）
console.log(a / b); // 3.333...（除，JS除法不会取整）
console.log(a % b); // 1（取余）
// 赋值运算符
let c = 5;
c += 2; // 等价于 c = c + 2 → 7
// 比较运算符（重点：== 与 ===）
console.log(18 == "18"); // true（只比值，自动转换类型）
console.log(18 === "18"); // false（值+类型都要相等，推荐用===）
// 逻辑运算符
console.log(true && false); // false（与）
console.log(true || false); // true（或）
console.log(!true); // false（非）
- 条件判断
javascript
运行
// if-else（最常用）
let score = 85;
if (score >= 90) {
console.log("优秀");
} else if (score >= 60) {
console.log("及格");
} else {
console.log("不及格");
}
// 三元运算符（简化if-else）
let result = score >= 60 ? "及格" : "不及格";
console.log(result); // 及格
- 循环
javascript
运行
// for 循环（遍历/重复执行）
for (let i = 1; i <= 5; i++) {
console.log(i); // 输出1-5
}
// while 循环
let j = 1;
while (j <= 5) {
console.log(j);
j++;
}
// forEach（数组专用，常用）
let arr = [10, 20, 30];
arr.forEach(function(item) {
console.log(item); // 依次输出10、20、30
});
- 函数（核心）
javascript
运行
// 方式1：函数声明（最常用）
function add(a, b) {
return a + b; // 返回值
}
let sum = add(3, 5);
console.log(sum); // 8
// 方式2：箭头函数（ES6 新增，简化写法）
const multiply = (a, b) => a b;
console.log(multiply(2, 4)); // 8
三、JS 核心特性（和 Java 区别）
弱类型：变量类型可动态改变，如 let x = 10; x = "JS"; 合法；
解释执行：无需编译，浏览器逐行解析运行；
DOM 操作（JS 独有，网页交互核心）：
javascript
运行
// 获取页面元素并修改内容
document.getElementById("title").innerText = "JS基础学习";
// 给按钮绑定点击事件
document.getElementById("btn").onclick = function() {
alert("按钮被点击了！");
};
四、新手必练小案例（巩固基础）
javascript
运行
// 案例1：计算BMI（对应你之前的Java需求）
let weight = prompt("请输入体重（kg）"); // 弹窗输入
let height = prompt("请输入身高（m）");
let bmi = weight / (height height);
// 保留2位小数
bmi = bmi.toFixed(2);
let status;
if (bmi < 18.5) {
status = "体重过低";
} else if (bmi < 25) {
status = "正常";
} else if (bmi < 30) {
status = "超重";
} else {
status = "肥胖";
}
alert(你的BMI值是${bmi}，评估结果：${status});
总结
JS 核心基础：变量 / 数据类型、运算符、条件判断、循环、函数 是入门必掌握的核心；
关键区别：和 Java 比，JS 是弱类型、解释执行，且独有 DOM 操作能力；
练习重点：先写简单逻辑（如计算、判断），再尝试网页交互（按钮点击、弹窗）。
如果想针对性学习某部分（比如数组、对象、DOM 操作），或者想做某个具体小案例，我可以帮你拆解讲解～
JavaScript的变量
你想深入了解 JavaScript 的变量相关知识，我会从变量声明方式、作用域、数据类型、核心特性四个维度，用新手易懂的方式讲清楚，搭配对比和示例，帮你彻底掌握 JS 变量的核心逻辑。
一、变量的核心：3 种声明方式（重点区分）
JS 中有 var、let、const 三种声明变量的关键字，其中 let/const 是 ES6 新增的，也是现在开发的主流用法，三者的核心区别如下：
声明关键字 作用域 变量提升 重复声明 能否修改值 适用场景
var 函数级作用域 有 允许 能 旧版代码（不推荐使用）
let 块级作用域 无 禁止 能 需修改的变量（推荐）
const 块级作用域 无 禁止 基本类型不能改；引用类型可改内部值 常量 / 无需修改的变量（推荐）
- let（最常用）
javascript
运行
// 块级作用域：只在 {} 内生效
if (true) {
let age = 18;
console.log(age); // 18（块内可访问）
}
console.log(age); // 报错：age is not defined（块外不可访问）
// 禁止重复声明
let name = "张三";
// let name = "李四"; // 报错：Identifier 'name' has already been declared
// 可以修改值
let score = 80;
score = 90;
console.log(score); // 90
- const（声明常量）
javascript
运行
// 基本类型：值不可改
const PI = 3.14;
// PI = 3.1415; // 报错：Assignment to constant variable.
// 引用类型（数组/对象）：地址不可改，但内部值可改
const arr = [1, 2, 3];
arr.push(4); // 合法，数组内部值修改
console.log(arr); // [1,2,3,4]
const person = { name: "张三" };
person.name = "李四"; // 合法，对象属性修改
console.log(person); // {name: "李四"}
// person = { age: 18 }; // 报错：地址不能改
- var（不推荐，了解即可）
javascript
运行
// 函数级作用域：if/for 的 {} 不限制作用域
if (true) {
var num = 10;
}
console.log(num); // 10（块外仍可访问，易出bug）
// 变量提升：声明会被提升到作用域顶部，赋值不提升
console.log(x); // undefined（不会报错）
var x = 5;
// 允许重复声明
var a = 1;
var a = 2;
console.log(a); // 2（无报错，但易混淆）
二、变量的命名规则（必须遵守）
只能以 ** 字母、下划线 (_)、美元符号 (
开
头
，
后
续
可
跟
字
母
、
数
字
、
下
划
线
、
；
区分大小写（age 和 Age 是两个不同变量）；
不能使用 JS 关键字 / 保留字（如 let、const、if、function 等）；
建议语义化命名（见名知意），多个单词用小驼峰（如 userName）。
✅ 合法命名：
javascript
运行
let userName = "张三";
let _score = 95;
let $price = 99;
let age18 = 18;
❌ 非法命名：
javascript
运行
// let 18age = 18; // 数字开头
// let user-name = "李四"; // 包含减号
// let let = 10; // 使用关键字
三、变量的数据类型（动态类型特性）
JS 是弱类型 / 动态类型语言：变量的类型由赋值决定，且可以随时改变。
javascript
运行
// 同一变量可切换类型
let x = 10; // 数字类型
x = "JavaScript"; // 字符串类型
x = true; // 布尔类型
x = [1, 2, 3]; // 数组类型
// 查看变量类型：typeof 运算符
console.log(typeof x); // "object"（数组的typeof返回object，是JS的小坑）
console.log(typeof "hello"); // "string"
console.log(typeof 20); // "number"
console.log(typeof undefined); // "undefined"
console.log(typeof null); // "object"（历史遗留bug，记住即可）
四、新手常见误区
混淆 let/const 的修改规则：
const 限制的是「变量指向的地址」，不是「值本身」，所以数组 / 对象内部值可改；
基本类型（数字、字符串、布尔）存在栈内存，值直接存储，所以 const 声明后不可改。
变量提升陷阱：
避免用 var，改用 let/const 可杜绝变量提升导致的逻辑错误；
即使是 let/const，也建议「先声明，后使用」。
未声明直接赋值：
javascript
运行
// 不推荐：未声明直接赋值，会变成全局变量（易污染）
num = 10;
console.log(num); // 10（但严格模式下会报错）
总结
声明变量优先用 let（需修改值）和 const（无需修改值），彻底放弃 var；
const 不是 “绝对常量”：基本类型值不可改，引用类型可改内部值；
变量命名遵守语义化 + 语法规则，动态类型特性让 JS 变量更灵活，但也需注意类型混乱问题；
块级作用域（let/const）是 ES6 的核心改进，能大幅减少变量作用域相关的 bug。
