一、JavaScript的基础知识
1. 数据类型与变量
JavaScript是一门动态类型的语言，它具有以下基本数据类型：
- 布尔值（Boolean）：表示真或假的值。例如：
var isTrue = true;
var isFalse = false;
- 数字（Number）：表示数值。包括整数和浮点数。例如：
var age = 25;
var pi = 3.14;
- 字符串（String）：表示文本。需要使用引号包裹起来。例如：
var name = "Tom";
var message = 'Hello, World!';
- 数组（Array）：表示多个值的有序集合。例如：
var fruits = ["apple", "banana", "orange"];
- 对象（Object）：表示键值对的集合。例如：
var person = {
name: "Tom",
age: 25,
gender: "male"
};
- 空（Null）：表示空值。例如：
var emptyValue = null;
- 未定义（Undefined）：表示变量未被赋值。例如：
var undefinedValue;
2. 运算符与表达式
JavaScript提供了一系列的运算符和表达式，用于进行数字、字符串和布尔值的操作。
- 算术运算符：支持加、减、乘、除等基本运算。例如：
var sum = 2 + 3; // 5
var difference = 5 - 2; // 3
var product = 3 * 4; // 12
var quotient = 10 / 2; // 5
- 字符串拼接：使用加号（+）将字符串拼接在一起。例如：
var greeting = "Hello, " + "World!"; // "Hello, World!"
- 比较运算符：用于比较两个值的大小关系。例如：
var greaterThan = 5 > 3; // true
var lessThanEqual = 10 <= 10; // true
var equalValue = "5" == 5; // true
var strictEqualValue = "5" === 5; // false
- 逻辑运算符：用于组合多个布尔值进行逻辑操作。例如：
var andResult = true && false; // false
var orResult = true || false; // true
var notResult = !true; // false
- 条件运算符：可简化条件语句的写法。例如：
var age = 20;
var isAdult = age >= 18 ? true : false;
3. 控制流程与循环
JavaScript中的控制流程语句和循环语句用于根据条件执行不同的代码块或者重复执行代码块。
- 条件语句（if...else）：根据条件执行不同的代码块。例如：
var hour = new Date().getHours();
if (hour < 12) {
console.log("Good morning!");
} else if (hour < 18) {
console.log("Good afternoon!");
} else {
console.log("Good evening!");
}
- 循环语句（for、while和do...while）：用于重复执行代码块。例如：
// for循环
for (var i = 0; i < 5; i++) {
console.log(i);
}
// while循环
var count = 0;
while (count < 5) {
console.log(count);
count++;
}
// do...while循环
var num = 0;
do {
console.log(num);
num++;
} while (num < 5);
4. 函数与作用域
JavaScript中的函数是可重复使用的代码块，用于封装代码和实现特定功能。
- 定义函数：使用function关键字定义函数，并指定函数名、参数和函数体。例如：
function greet(name) {
console.log("Hello, " + name + "!");
}
greet("Tom"); // Hello, Tom!
- 匿名函数：可以将函数赋值给变量，并使用变量进行调用。例如：
var greet = function(name) {
console.log("Hello, " + name + "!");
};
greet("Tom"); // Hello, Tom!
- 作用域：函数内部的变量只在函数内部有效，称为局部变量；在函数外部定义的变量为全局变量，全局变量可以在代码的任何地方被访问。例如：
var globalVariable = "I'm a global variable";
function sayHello() {
var localVariable = "I'm a local variable";
console.log(localVariable);
console.log(globalVariable);
}
sayHello(); // I'm a local variable
console.log(globalVariable); // I'm a global variable
console.log(localVariable); // Uncaught ReferenceError: localVariable is not defined
5. 对象与类
JavaScript是基于对象的语言，对象用于封装数据和行为。
- 对象的创建：使用对象字面量{}或者通过new关键字与构造函数创建对象。例如：
// 对象字面量
var person = {
name: "Tom",
age: 25,
gender: "male",
sayHello: function() {
console.log("Hello, I'm " + this.name);
}
};
person.sayHello(); // Hello, I'm Tom
// 通过构造函数创建对象
function Animal(name, age) {
this.name = name;
this.age = age;
this.speak = function() {
console.log("I'm a " + this.name);
};
}
var dog = new Animal("Dog", 2);
dog.speak(); // I'm a Dog
- 类与继承：JavaScript使用构造函数和原型链实现类和继承的概念。例如：
// 父类
function Shape() {
this.name = "shape";
}
Shape.prototype.sayName = function() {
console.log("My name is " + this.name);
};
// 子类
function Circle() {
this.radius = 5;
}
Circle.prototype = new Shape();
var circle = new Circle();
circle.sayName(); // My name is shape
console.log(circle.radius); // 5
6. 函数的高阶用法 - 将函数作为参数传递
function calculate(operation, num1, num2) {
return operation(num1, num2);
}
function add(a, b) {
return a + b;
}
function multiply(a, b) {
return a * b;
}
var result1 = calculate(add, 5, 3); // 使用add函数计算 5 + 3
console.log(result1); // 输出：8
var result2 = calculate(multiply, 4, 2); // 使用multiply函数计算 4 * 2
console.log(result2); // 输出：8
7. 高阶函数 - 返回一个函数
function createGreeting(language) {
if (language === "en") {
return function(name) {
console.log("Hello, " + name + "!");
};
} else if (language === "es") {
return function(name) {
console.log("¡Hola, " + name + "!");
};
} else {
return function(name) {
console.log("你好，" + name + "！");
};
}
}
var greetInEnglish = createGreeting("en");
greetInEnglish("Tom"); // 输出：Hello, Tom!
var greetInSpanish = createGreeting("es");
greetInSpanish("Tom"); // 输出：¡Hola, Tom!
var greetInChinese = createGreeting("zh");
greetInChinese("Tom"); // 输出：你好，Tom！
8. 使用数组的高阶方法 - map、filter和reduce
var numbers = [2, 4, 6, 8];
// 使用map方法将数组中的每个元素乘以2
var doubledNumbers = numbers.map(function(num) {
return num * 2;
});
console.log(doubledNumbers); // 输出：[4, 8, 12, 16]
// 使用filter方法筛选出数组中大于5的元素
var filteredNumbers = numbers.filter(function(num) {
return num > 5;
});
console.log(filteredNumbers); // 输出：[6, 8]
// 使用reduce方法对数组中的所有元素求和
var sum = numbers.reduce(function(acc, num) {
return acc + num;
}, 0);
console.log(sum); // 输出：20
这些例子展示了JavaScript基础知识的一些高级用法。通过灵活应用这些概念，我们可以构建出更复杂和功能强大的JavaScript应用程序。当然，JavaScript的世界非常广阔，这些只是其中的一小部分。
