目录
一、JavaScript 环境搭建
（一）浏览器环境
（二）Node.js 环境
二、JavaScript 基础语法
（一）基本数据类型
（二）变量与常量
（三）控制流
1. 条件语句
2. 循环语句
（四）函数
三、对象与数组
（一）对象
（二）数组
四、ES6 新特性
（一）箭头函数
（二）模板字符串
（三）解构赋值
（四）Promise
五、异步编程
（一）async/await
六、模块化开发
（一）CommonJS 模块系统
（二）ES6 模块系统
七、高级特性
（一）类
（二）继承
（三）迭代器与生成器
八、总结
JavaScript 是一种广泛使用的编程语言，主要用于网页交互和动态效果的实现。它不仅可以用于前端开发，还可以通过 Node.js 实现服务器端编程。本文将详细介绍 JavaScript 的基本语法、核心特性、常用功能以及一些高级用法，帮助你快速掌握 JavaScript 的开发技能。
一、JavaScript 环境搭建
（一）浏览器环境
浏览器是运行 JavaScript 的最常见环境。你可以直接在浏览器的控制台中运行 JavaScript 代码。
（二）Node.js 环境
Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境，允许你在服务器端运行 JavaScript。
安装 Node.js：
访问 Node.js 官方网站，下载并安装 Node.js。
安装完成后，打开命令行工具，输入以下命令验证安装版本：
bash复制
node -v
npm -v 创建项目：
创建一个新项目目录：
bash复制
mkdir my-js-project
cd my-js-project 初始化项目：
bash复制
npm init -y
二、JavaScript 基础语法
（一）基本数据类型
JavaScript 提供了多种基本数据类型，包括数字、字符串、布尔值、null、undefined 和 Symbol。
JavaScript复制
let number = 10; // 数字
let decimal = 10.5; // 浮点数
let str = "Hello, JS!"; // 字符串
let isTrue = true; // 布尔值
let obj = null; // null
let undef = undefined; // undefined
（二）变量与常量
变量用于存储数据，而常量的值在程序运行过程中不能改变。
JavaScript复制
let count = 10; // 变量
const MAX = 100; // 常量
（三）控制流
JavaScript 提供了丰富的控制流语句，包括条件语句和循环语句。
1. 条件语句
JavaScript复制
let age = 18;
if (age >= 18) {
console.log("You are an adult.");
} else {
console.log("You are a minor.");
}
2. 循环语句
JavaScript复制
// for 循环
for (let i = 0; i < 5; i++) {
console.log(i);
}
// while 循环
let count = 0;
while (count < 5) {
console.log(count);
count++;
}
（四）函数
函数是 JavaScript 中的基本编程单元，用于封装可重用的代码。
JavaScript复制
function greet(name) {
console.log(`Hello, ${name}!`);
}
greet("Alice");
三、对象与数组
（一）对象
对象是 JavaScript 中的基本数据结构，用于存储键值对。
JavaScript复制
let person = {
name: "Alice",
age: 25,
greet: function() {
console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
}
};
person.greet(); // 输出 "Hello, my name is Alice and I am 25 years old."
（二）数组
数组用于存储固定大小的同类型数据。
JavaScript复制
let numbers = [1, 2, 3, 4, 5];
console.log(numbers[0]); // 输出 1
numbers.push(6); // 添加元素
console.log(numbers); // 输出 [1, 2, 3, 4, 5, 6]
四、ES6 新特性
（一）箭头函数
箭头函数提供了一种更简洁的函数书写方式。
JavaScript复制
let add = (a, b) => a + b;
console.log(add(5, 3)); // 输出 8
（二）模板字符串
模板字符串允许你在字符串中嵌入表达式。
JavaScript复制
let name = "Alice";
let age = 25;
console.log(`Hello, my name is ${name} and I am ${age} years old.`);
（三）解构赋值
解构赋值允许你从数组或对象中提取数据并赋值给变量。
JavaScript复制
let [a, b] = [1, 2];
console.log(a, b); // 输出 1 2
let { name, age } = { name: "Alice", age: 25 };
console.log(name, age); // 输出 Alice 25
（四）Promise
Promise 是一种用于异步计算的对象。
JavaScript复制
let promise = new Promise((resolve, reject) => {
setTimeout(() => resolve("Promise resolved!"), 1000);
});
promise.then((result) => {
console.log(result); // 输出 "Promise resolved!"
});
五、异步编程
（一）async/await
async/await 提供了一种更简洁的异步编程方式。
JavaScript复制
async function fetchData() {
let response = await fetch("https://api.example.com/data");
let data = await response.json();
return data;
}
fetchData().then((data) => {
console.log(data);
});
六、模块化开发
（一）CommonJS 模块系统
Node.js 使用 CommonJS 模块系统。
JavaScript复制
// myModule.js
function greet(name) {
console.log(`Hello, ${name}!`);
}
module.exports = { greet };
// index.js
const { greet } = require("./myModule");
greet("Alice");
（二）ES6 模块系统
ES6 模块系统在浏览器中使用。
JavaScript复制
// myModule.js
export function greet(name) {
console.log(`Hello, ${name}!`);
}
// index.js
import { greet } from "./myModule.js";
greet("Alice");
七、高级特性
（一）类
ES6 引入了类的概念，用于实现面向对象编程。
JavaScript复制
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
greet() {
console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
}
}
let person = new Person("Alice", 25);
person.greet(); // 输出 "Hello, my name is Alice and I am 25 years old."
（二）继承
类支持继承，允许子类继承父类的属性和方法。
JavaScript复制
class Animal {
constructor(name) {
this.name = name;
}
makeSound() {
console.log("Some sound");
}
}
class Dog extends Animal {
makeSound() {
console.log("Woof");
}
}
let myDog = new Dog("Buddy");
myDog.makeSound(); // 输出 "Woof"
（三）迭代器与生成器
迭代器和生成器提供了更灵活的迭代方式。
JavaScript复制
function* generator() {
yield 1;
yield 2;
yield 3;
}
let gen = generator();
console.log(gen.next().value); // 输出 1
console.log(gen.next().value); // 输出 2
console.log(gen.next().value); // 输出 3
八、总结
JavaScript 是一种功能强大的编程语言，适用于多种开发场景。本文详细介绍了 JavaScript 的基本语法、核心特性、常用功能以及一些高级用法，希望对你有所帮助。如果你在使用 JavaScript 时遇到任何问题，欢迎在评论区留言，我会及时为你解答。