学习js所必须要知道的一些

2023年5月28日上午8:44 • JavaScript

学习JavaScript所必须要知道的一些攻略

简介

学习JavaScript（以下简称JS）时，需要一些基础知识，其中包括语法、DOM操作、Ajax、闭包等等。下面将详细介绍学习JS的一些必备知识。

1. 语法

1.1 数据类型

JS包含7种不同的数据类型，分为原始类型和对象类型。原始类型包括：

数字（Number）：整数或浮点数
字符串（String）：由0个或多个字符组成的文本字符串
布尔型（Boolean）：true和false
空数据（Null）：表示无值
定义数据但未初始化得到的undefined
符号（Symbol）：用于表示唯一的标识
BigInt：可以表示更大范围的整数数字类型

对象类型有：

对象（Object）：用中括号或点表示法表示属性的值
数组（Array）：存储有序的集合
函数（Function）：一种可执行的代码块，可作为"第一类公民"在变量、参数、数组和返回值中使用
正则表达式（RegExp）：描述了一种匹配某个字符或一组字符的字符模式
日期时间（Date）：标准内建Date对象可以存储日期时间信息，并且可以提供日期时间的操作

1.2 变量

变量是存储数据的容器。JS中的变量可以使用var、let和const声明。var声明的变量可以被重新赋值，let和const声明的变量不能被重新赋值，但let声明的变量可以被重新声明。

以下示例创建了一个变量，显示了不同的变量声明和赋值方法：

var a = 1;
let b = 2;
const pi = 3.14;

console.log(a); // 1
console.log(b); // 2
console.log(pi); // 3.14

1.3 运算符

JS中常用的算术运算符有+、-、*、/、%（求余）,也有逻辑运算符、关系运算符、位运算符等。以下示例演示了加法运算、逻辑运算和比较运算：

const c = 1 + 2; // 等于3
const d = true && false; // 等于false
const e = 5 > 3; // true

2. DOM操作

DOM是一个编程接口，它允许JavaScript代码读取和改变HTML和XML文档。在JavaScript中，可以通过以下代码访问页面上的元素：

const element = document.getElementById("myId");

可以使用各种DOM方法设置元素属性和样式，例如，更改文本：

element.textContent = "new text";

3. Ajax

AJAX是一组Web开发技术，可以用来创建异步Web应用程序。JS的XMLHttpRequest对象用于与服务器交互数据并更新页面上的部分内容。以下代码演示如何使用XMLHttpRequest对象创建异步HTTP请求：

const xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    document.getElementById("myId").innerHTML = this.responseText;
  }
};
xhttp.open("GET", "myFile.txt", true);
xhttp.send();

这段代码会向服务器发送GET请求，然后在成功获取响应后更新页面上的元素。

4. 闭包

在JavaScript中，函数是一等公民，允许函数内创建另一个函数。当内部函数从外部函数返回时，它会形成闭包，可以访问外部函数的局部变量、参数和内部函数。以下示例演示了闭包的使用：

function outerFunction() {
  const outerValue = "outer";

  return function innerFunction() {
    console.log(outerValue);
  }
}

const myFunction = outerFunction();
myFunction(); // 输出 "outer"

在这个示例中，innerFunction是一个闭包，它可以访问outerFunction中的变量outerValue。