独立网站需要多少钱网络推广免费平台
1. JavaScript概述
JavaScript是一种高级、解释型的编程语言，通常用于在网页上实现动态交互和改善用户体验。它是一种脚本语言，可以嵌入到HTML中，并由浏览器解释执行。JavaScript广泛用于前端开发，但也可以用于服务器端开发（Node.js等）。
2. 变量命名规范
JavaScript 变量的命名规范是一种良好的编程实践，它有助于代码的可读性和维护性。
- 驼峰命名法（Camel Case）：在驼峰命名法中，变量名的第一个单词小写，后面的单词首字母大写，没有空格或其他字符。
let myVariable = 10;
- 避免使用单个字符： 除非是临时变量或循环计数器，应该避免使用单个字符作为变量名，以提高代码的可读性。
// 不好的例子
let x = 5;// 好的例子
let itemCount = 5;
- 有意义的命名： 变量名应该反映其所表示的数据或功能，以提高代码的可理解性。
// 不好的例子
let a = 100;// 好的例子
let maximumScore = 100;
- 避免使用保留字： 不要使用 JavaScript 的保留字（例如 function、if、else 等）作为变量名。
// 不好的例子
let function = 10;// 好的例子
let myFunction = 10;
- 常量全大写： 如果变量是常量，即其值在程序执行期间不会改变，可以使用全大写字母和下划线来命名。
const MAX_COUNT = 100;
- 下划线分隔（Snake Case）： 在一些代码风格中，变量名使用下划线 _ 进行分隔，这种风格被称为下划线分隔。
let my_variable = 10;
- 避免使用特殊字符： 尽量避免在变量名中使用特殊字符，以免引起混淆或错误。
// 不好的例子
let $%& = 5;// 好的例子
let totalAmount = 5;
3. 变量声明
JavaScript中有三种声明变量的方式，分别是使用 var、let 和 const 关键字。它们的使用方式和作用域略有不同。
var：是在ES5（ECMAScript 5）中引入的关键字。var声明的变量属于函数作用域（function scope），而不是块级作用域（block scope）。如果在函数内使用var声明变量，该变量在函数内都是可见的，而在函数外则不可见。
function example() {var x = 10;if (true) {var y = 20;console.log(x); // 10}console.log(y); // 20
}
let：是在ES6中引入的关键字，它引入了块级作用域的概念。使用let声明的变量的作用域限制在其代码块内。
function example() {let x = 10;if (true) {let y = 20;console.log(x); // 10}// console.log(y); // 由于 y 在块级作用域外，这里会报错
}
const：也是在ES6中引入的关键字，用于声明常量。常量在声明后不能被重新赋值，并且也具有块级作用域。
const pi = 3.14;
// pi = 3; // 试图修改常量会导致错误if (true) {const foo = 'bar';console.log(foo); // 'bar'
}
// console.log(foo); // 由于 foo 在块级作用域外，这里会报错
4. 作用域与变量提升
4.1 作用域
JavaScript 中的作用域是指变量在代码中可访问的范围，即定义了变量在何处可以被引用或修改。作用域规定了变量的可见性和生命周期。JavaScript有两种主要的作用域：
- 全局作用域（Global Scope）： 全局作用域是整个程序的范围，定义在全局作用域中的变量在整个代码中都是可见的。在浏览器环境中，全局作用域通常是指整个页面，而在Node.js环境中，是指整个Node.js进程。
var globalVar = "I'm global!";function example() {console.log(globalVar); // 在函数内部可以访问全局变量
}example();
console.log(globalVar); // 在函数外部也可以访问全局变量
- 局部作用域（Local Scope）： 局部作用域是在函数内部声明的变量的作用域，也叫函数作用域。变量在这种作用域中只能在函数内部访问，称为局部变量。
function example() {var localVar = "I'm local!";console.log(localVar); // 在函数内部可以访问局部变量
}example();
// console.log(localVar); // 在函数外部不可访问局部变量，这里会报错
- JavaScript 的作用域还涉及到词法作用域（Lexical Scope），也叫静态作用域。它是指变量的作用域是在代码写的时候就确定的，而不是在运行时确定的。JavaScript采用的是词法作用域。
var globalVar = "I'm global!";function outer() {var outerVar = "I'm outer!";function inner() {var innerVar = "I'm inner!";console.log(globalVar); // 全局变量在任何地方都可见console.log(outerVar); // 外部函数的变量在内部函数可见console.log(innerVar); // 自己的变量自然可见}inner();// console.log(innerVar); // 在外部函数无法访问内部函数的变量，这里会报错
}outer();
// console.log(outerVar); // 在外部函数无法访问内部函数的变量，这里会报错
// console.log(innerVar); // 在外部函数无法访问内部函数的变量，这里会报错
4.2 变量提升
- var 变量提升：通过
var关键字变量声明会被提升到函数或全局作用域的顶部。这意味着在函数内部，无论变量是在函数体的哪个位置声明的，都会被视为在函数顶部声明的。注意，变量声明可以被提升，但是赋值不会被提升。
function example() {console.log(x); // undefined，变量提升，但尚未赋值var x = 10;console.log(x); // 10
}
let 和 const 关键字声明的变量与 var 有一些不同之处，其中之一就是它们的变量提升行为。
- let 变量提升： 使用
let声明的变量在声明之前是不可访问的，这称为"暂时性死区"（Temporal Dead Zone，简称 TDZ）。变量提升仍然发生，但在进入声明语句之前，任何引用该变量的操作都会抛出一个错误。
console.log(x); // ReferenceError: Cannot access 'x' before initialization
let x = 10;
在上面的例子中，尽管存在变量提升，但在 let x = 10; 之前访问 x 会抛出错误，因为此时 x 处于暂时性死区。
- const 变量提升：
const也存在变量提升，但与let不同，使用const声明的变量必须在声明时进行初始化，而且一旦初始化就不能再被修改。在声明语句之前访问 const 变量也会引发暂时性死区。
console.log(y); // ReferenceError: Cannot access 'y' before initialization
const y = 20;
虽然 let 和 const 会进行变量提升，但由于暂时性死区的存在，我们不能在声明之前访问它们，而是应该在声明之后再使用。这种行为有助于提高代码的可靠性，并防止在变量还未初始化的情况下使用它们。
5. 数据类型
JavaScript 是一种动态类型的语言，它支持多种数据类型。动态类型特性允许变量在运行时动态改变其类型，因此可以在同一个变量中存储不同类型的值。JavaScript 中常见的数据类型主要有三类，基本数据类型、复合数据类型、特殊数据类型。
5.1 基本数据类型（Primitive Types）
- Number（数字）: 用于表示数字，包括整数和浮点数。
let num = 42;
let floatNum = 3.14;
- String（字符串）: 用于表示文本。
let str = "Hello, World!";
- Boolean（布尔）: 用于表示逻辑值，只能是 true 或 false。
let isTrue = true;
let isFalse = false;
- Undefined（未定义）: 表示变量声明了但未赋值时的默认值。
let undefinedVar;
- Null（空）: 表示变量的值为空或不存在。
let nullVar = null;
- Symbol（符号）: ES6 中引入的数据类型，用于创建唯一的标识符。
let sym = Symbol("unique");
5.2 复合数据类型（Composite Types）
- Object（对象）: 用于存储键值对。
let person = {name: "John",age: 30,gender: "male"
};
- Array（数组）: 用于按顺序存储多个值。
let numbers = [1, 2, 3, 4, 5];
- Function（函数）: 用于封装可执行的代码块。
function add(a, b) {return a + b;
}
- Date（日期）: 用于表示日期和时间。
let currentDate = new Date();
- RegExp（正则表达式）: 用于匹配字符串的模式。
let pattern = /abc/;
5.3 特殊数据类型
- BigInt（大整数）: 用于表示任意精度的整数。
let bigIntNum = BigInt(9007199254740991);
- 特殊值:
- NaN（非数值）: 表示不是一个合法数字。
- Infinity（正无穷）: 表示正无穷大。
- -Infinity（负无穷）: 表示负无穷大。
6. 运算符
7. 类型转换
JavaScript 是一种弱类型语言，这意味着变量的数据类型可以在运行时自动转换，或者通过一些手动的类型转换操作来实现。类型转换主要分为隐式类型转换和显式类型转换两种。
7.1 隐式类型转换
在某些操作中，JavaScript 会自动进行类型转换，以满足操作的需求。这种转换是由 JavaScript 引擎在运行时自动完成的。
// 隐式类型转换
let num = 5 + "5"; // 字符串拼接，结果是 "55"
let sum = "10" - 5; // 数字运算，结果是 5
7.2 显式类型转换
开发者可以通过一些内建的函数或操作符来手动进行类型转换。
- 转换为字符串
let number = 42;
let str = String(number);
- 转换为数字
let strNum = "42";
let num = Number(strNum); // 结果是数字 42
- 转换为布尔值
let value = 0;
let bool = Boolean(value); // 结果是布尔值 false
- 使用 parseInt 和 parseFloat 进行字符串到数字的转换
let strNumber = "42.5";
let parsedNumber = parseFloat(strNumber); // 结果是数字 42.5
- 手动进行类型转换
let x = "5";
let y = 10;
let result = x + y; // 结果是字符串 "510"// 手动将字符串转换为数字
result = Number(x) + y; // 结果是数字 15
8. JS内置对象属性和方法
| 内置对象名称 | 属性名 | 作用 |
|---|---|---|
| Object 对象 | Object.prototype | 通过该属性可以访问对象的原型 |
| Object.keys(obj) | 返回一个包含对象自身的所有可枚举属性名称的数组 | |
| Object.values(obj) | 返回一个包含对象自身的所有可枚举属性值的数组 | |
| Object.entries(obj) | 返回一个包含对象自身的所有可枚举属性键值对的数组 |