React 是一个流行的前端框架，但在学习 React 前，了解 JavaScript 基础知识是必须的。在本文中，我们将探讨初学者必须掌握的 JavaScript 基础知识，并提供实用的示例代码和指导意义，帮助初学者更好地理解 React 并开始构建 React 应用程序。
变量和数据类型
在 JavaScript 中，变量是用于存储数据的工具。变量定义是通过 var 关键字进行的，如下所示：
var myVariable = "Hello World!";
在此示例中，myVariable 是变量的名称，可以为任何名称。等号右侧的 "Hello World!" 是将存储在 myVariable 中的值。在 JavaScript 中，有几种数据类型，最常见的有以下几种：
- 字符串
- 数字
- 布尔值
- 数组
- 对象
- null
- undefined
例如：
var myString = "Hello World!"; // 字符串类型
var myNumber = 42; // 数字类型
var myBoolean = true; // 布尔值类型
var myArray = ["apple", "banana", "orange"]; // 数组类型
var myObject = {name: "John", age: 30}; // 对象类型
var myNull = null; // null类型
var myUndefined = undefined; // undefined类型函数
函数是一段可重复使用的代码块。我们可以在函数内部处理数据并返回结果。JavaScript 中的函数定义如下：
function myFunction(param1, param2) {
var result = param1 + param2;
return result;
}在此函数定义中，我们使用 function 关键字创建了一个名为 myFunction 的函数，包含两个参数 param1 和 param2，它们代表我们将要传递给函数的值。函数体执行一些逻辑，将结果保存在 result 变量中，然后将结果返回。
示例代码：
function calculateAreaOfCircle(radius) {
var area = Math.PI * radius * radius;
return area;
}
var circleArea = calculateAreaOfCircle(2);
console.log(circleArea); // 输出：12.566370614359172 此代码计算圆的面积并将结果打印到控制台上。
对象和属性
在 JavaScript 中，对象是一组属性和值的集合。可以使用以下方法创建一个对象：
var myObject = {firstName: "John", lastName: "Doe", age: 30};在此示例中，我们创建了一个名为 myObject 的对象，该对象包含三个属性：firstName、lastName 和 age。
我们可以通过以下方式访问和设置对象属性：
myObject.firstName; // 获取属性值 myObject.age = 31; // 设置属性值
示例代码：
var person = {firstName: "John", lastName: "Doe", age: 30};
person.age = 31; // 修改person的age属性
console.log(person.age); // 输出：31在此示例中，我们创建了一个名为 person 的对象，将它的 age 属性值修改为 31，然后将 age 属性值打印到控制台上。
数组和循环
一个数组是一个按特定顺序排列的值的集合。可以使用以下方法创建一个数组：
var myArray = ["apple", "banana", "orange"];
在此示例中，我们创建了一个名为 myArray 的数组，该数组包含三个字符串值。
我们可以通过以下方式访问和设置数组元素：
myArray[0]; // 获取第一个元素 myArray[2] = "lemon"; // 设置第三个元素
示例代码：
var fruit = ["apple", "banana", "orange"];
for (var i = 0; i < fruit.length; i++) {
console.log(fruit[i]);
}此代码以循环方式输出数组元素。
条件语句
条件语句允许您根据不同条件执行不同的代码块。以下是一个基本的 if 语句的示例：
if (age > 18) {
console.log("You are an adult.");
}在此示例中，如果变量 age 的值大于 18，则输出 "You are an adult."。
示例代码：
var age = 20;
if (age > 18) {
console.log("You are an adult.");
} else {
console.log("You are a minor.");
}在此示例中，如果年龄大于 18，则输出 "You are an adult."，否则输出 "You are a minor."。
总结
本文涵盖了初学者可能需要了解的 JavaScript 基础知识：变量、数据类型、函数、对象和属性、数组和循环、条件语句等。本文所提供的示例代码和指导意义旨在帮助初学者更好地掌握这些基础知识，以便更好地开始学习 React 并构建 React 应用程序。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/648c01ac48841e9894a4bbc3