01.字符串

1.字符串的基本操作

1. 创建字符串：可以使用单引号（'）或双引号（"）来创建字符串。例如：

var str1 = 'Hello World';
var str2 = "JavaScript";

2. 字符串长度：可以使用length属性来获取字符串的长度。例如：

var str = 'Hello World';
console.log(str.length); // 输出 11

3. 字符串连接：可以使用加号（+）来连接两个字符串。例如：

var str1 = 'Hello';
var str2 = 'World';
var result = str1 + ' ' + str2;
console.log(result); // 输出 'Hello World'

4. 字符串索引：可以使用方括号（[]）和索引值来访问字符串中的字符。索引值从0开始，表示字符串中的位置。例如：

var str = 'JavaScript';
console.log(str[0]); // 输出 'J'
console.log(str[4]); // 输出 'S'

5. 子字符串提取：可以使用substring方法来提取字符串中的一部分。该方法接受两个参数，起始位置和结束位置（可选）。例如：

var str = 'Hello World';
console.log(str.substring(0, 5)); // 输出 'Hello'
console.log(str.substring(6)); // 输出 'World'

6. 字符串查找：可以使用indexOf方法来查找一个子字符串在字符串中的位置。该方法接受一个参数，表示要查找的子字符串。如果找到了，返回子字符串的起始位置；如果没找到，返回-1。例如：

var str = 'Hello World';
console.log(str.indexOf('World')); // 输出 6
console.log(str.indexOf('JavaScript')); // 输出 -1

2.字符串常用方法

chartAt（索引）

在JavaScript中，字符串的charAt()方法用于获取指定索引位置的字符。该方法接受一个参数，即要获取的字符的索引。索引从0开始，表示字符串的第一个字符。

下面是一个示例：

var str = "Hello";
console.log(str.charAt(0)); // 输出 "H"
console.log(str.charAt(1)); // 输出 "e"
console.log(str.charAt(4)); // 输出 "o"

需要注意的是，如果指定的索引超出了字符串的范围，charAt()方法将返回一个空字符串。

var str = "Hello";
console.log(str.charAt(5)); // 输出 ""

另外，可以使用方括号（[]）来获取字符串中的字符，如下所示：

var str = "Hello";
console.log(str[0]); // 输出 "H"
console.log(str[1]); // 输出 "e"
console.log(str[4]); // 输出 "o"

这种方式与charAt()方法的效果相同。同样需要注意的是，如果指定的索引超出了字符串的范围，方括号方式将返回undefined。

charCodeat（索引）

字符串charCodeAt是一个字符串方法，用于返回指定索引处字符的Unicode编码值。它接受一个参数，即要返回其编码值的字符的索引。

示例：

var str = "Hello";
console.log(str.charCodeAt(0)); // 72
console.log(str.charCodeAt(1)); // 101
console.log(str.charCodeAt(4)); // 111

在上面的例子中，字符串"Hello"的索引从0开始，所以str.charCodeAt(0)返回的是字符"H"的Unicode编码值72，str.charCodeAt(1)返回的是字符"e"的Unicode编码值101，str.charCodeAt(4)返回的是字符"o"的Unicode编码值111。

注意：charCodeAt返回的是一个整数表示字符的Unicode编码值，而不是字符本身。如果索引超出字符串的范围，charCodeAt将返回NaN。

toUpperCase toLowerCase（转换大小写）

字符串的toUpperCase()方法用于将字符串中的所有字母转换为大写形式。它不会改变原始字符串，而是返回一个新的字符串。

示例：

var str = "hello";
console.log(str.toUpperCase()); // "HELLO"

在上面的例子中，字符串"hello"调用了toUpperCase()方法，返回的新字符串"HELLO"中的所有字母都是大写形式。

字符串的toLowerCase()方法用于将字符串中的所有字母转换为小写形式。它也不会改变原始字符串，而是返回一个新的字符串。

示例：

var str = "HELLO";
console.log(str.toLowerCase()); // "hello"

在上面的例子中，字符串"HELLO"调用了toLowerCase()方法，返回的新字符串"hello"中的所有字母都是小写形式。

注意：这两个方法只会转换字母字符，对于非字母字符不会进行任何操作。

substr || substring || slice

字符串的substr()、substring()和slice()都是用于提取字符串中的子字符串的方法，但它们的用法和行为有一些不同。

1. substr(start, length):

-   start：表示要提取的子字符串的起始位置。如果start为负数，则从字符串末尾开始计算，-1表示倒数第一个字符。
-   length：表示要提取的子字符串的长度。如果省略length参数，则提取从start位置到字符串末尾的所有字符。

示例：

var str = "Hello World";
console.log(str.substr(6)); // "World"
console.log(str.substr(0, 5)); // "Hello"
console.log(str.substr(-5)); // "World"
console.log(str.substr(6, 3)); // "Wor"

在上面的例子中，字符串"Hello World"调用了substr()方法来提取子字符串。第一个示例中，省略了length参数，所以返回从索引位置6开始到字符串末尾的所有字符。第二个示例中，提供了start和length参数，所以返回从索引位置0开始的5个字符。第三个示例中，start为负数，表示从倒数第5个字符开始提取。第四个示例中，start为6，length为3，表示从索引位置6开始提取3个字符。

2. substring(start, end):

-   start：表示要提取的子字符串的起始位置。如果start为负数，则被视为0。
-   end：表示要提取的子字符串的结束位置（不包括该位置的字符）。如果省略end参数，则提取从start位置到字符串末尾的所有字符。

示例：

var str = "Hello World";
console.log(str.substring(6)); // "World"
console.log(str.substring(0, 5)); // "Hello"
console.log(str.substring(6, 11)); // "World"

在上面的例子中，字符串"Hello World"调用了substring()方法来提取子字符串。第一个示例中，省略了end参数，所以返回从索引位置6开始到字符串末尾的所有字符。第二个示例中，提供了start和end参数，所以返回从索引位置0开始到索引位置5（不包括索引位置5）的字符。第三个示例中，提供了start和end参数，所以返回从索引位置6开始到索引位置11（不包括索引位置11）的字符。

3. slice(start, end):

-   start：表示要提取的子字符串的起始位置。如果start为负数，则从字符串末尾开始计算，-1表示倒数第一个字符。
-   end：表示要提取的子字符串的结束位置（不包括该位置的字符）。如果省略end参数，则提取从start位置到字符串末尾的所有字符。

示例：

var str = "Hello World";
console.log(str.slice(6)); // "World"
console.log(str.slice(0, 5)); // "Hello"
console.log(str.slice(6, 11)); // "World"

在上面的例子中，字符串"Hello World"调用了slice()方法来提取子字符串。它的行为与substring()方法类似。第一个示例中，省略了end参数，所以返回从索引位置6开始到字符串末尾的所有字符。第二个示例中，提供了start和end参数，所以返回从索引位置0开始到索引位置5（不包括索引位置5）的字符。第三个示例中，提供了start和end参数，所以返回从索引位置6开始到索引位置11（不包括索引位置11）的字符。

需要注意的是，substr()方法在某些情况下可能会有不一样的行为，因此在使用时需要注意其差异。substring()和slice()的主要区别在于如何处理负数参数。

replace(替换)

replace() 是一个字符串方法，用于在字符串中替换指定的子串。

语法：

string.replace(old, new, count)

参数：

old: 要被替换的子串
new: 替换后的新子串
count: 可选参数，指定替换的次数

示例：

string = "Hello, World!"
new_string = string.replace("Hello", "Hi")
print(new_string)  # 输出：Hi, World!

在上面的示例中，字符串 "Hello, World!" 中的 "Hello" 被替换为 "Hi"，并且输出了替换后的新字符串。

split 分割

split() 是一个字符串方法，用于将字符串分割成子串，并返回一个包含分割后子串的列表。

语法：

string.split(sep, maxsplit)

参数：

sep: 可选参数，指定分割的字符串，默认为所有的空白字符，包括空格、制表符、换行符等
maxsplit: 可选参数，指定最大分割次，默认为 -1，即全部分割

示例：

string = "apple,banana,orange"
fruits = string.split(",")
print(fruits)  # 输出：['apple', 'banana', 'orange']

在上面的示例中，字符串 "apple,banana,orange" 被以逗号为分隔符进行分割，返回一个包含分割后子串的列表。

indexOf lastIndexOf

字符串的 indexOf 和 lastIndexOf 方法用于查找指定子字符串在字符串中的位置。

indexOf 方法返回指定子字符串在字符串中第一次出现的位置，如果找不到则返回 -1。
语法：
```
string.indexOf(substring, start)
```
其中：
- substring：要查找的子字符串
- start：可选参数，指定开始查找的位置，默认为 0
示例：
```
var string = "Hello, World!";
var index = string.indexOf("o");
console.log(index);  // 输出：4
```
lastIndexOf 方法返回指定子字符串在字符串中最后一次出现的位置，如果找不到则返回 -1。
语法：
```
string.lastIndexOf(substring, start)
```
其中：
- substring：要查找的子字符串
- start：可选参数，指定开始查找的位置，默认为字符串的末尾
示例：
```
var string = "Hello, World!";
var index = string.lastIndexOf("o");
console.log(index);  // 输出：8
```

以上是 JavaScript 中字符串的 indexOf 和 lastIndexOf 方法的使用方法和示例。

concat 连接字符串

在JavaScript中，concat() 方法用于连接两个或多个字符串，并返回一个新的字符串。

语法：

string.concat(string1, string2, ..., stringN)

示例：

var str1 = "Hello";
var str2 = "World";
var result = str1.concat(", ", str2);
console.log(result);  // 输出：Hello, World

在上面的示例中，我们使用了 concat() 方法将两个字符串 "Hello" 和 "World" 连接在一起，得到了新的字符串 "Hello, World"。

需要注意的是，concat() 方法并不会修改原始字符串而是返回一个新的字符串。

trim 去掉首尾空格

在JavaScript中，目前只有一个字符串方法可以去除字符串两端的空格和其他空白字符，那就是 trim() 方法。

在ECMAScript 2022中，引入了 trimStart() 和 trimEnd() 方法，用于去除字符串开头和结尾的空格和其他空白字符。这些方法和 trim() 方法的功能相同，只是名称不同。

示例：

const str = "   Hello, World!   ";
const trimmedStartStr = str.trimStart();
const trimmedEndStr = str.trimEnd();
console.log(trimmedStartStr);  // 输出：Hello, World!   
console.log(trimmedEndStr);  // 输出：   Hello, World!

案例模糊查询

在 JavaScript 中，可以使用数组的 filter() 方法结合字符串的 indexOf() 方法来实现模糊查询。

首先，我们可以使用数组的 filter() 方法来过滤包含指定子字符串的元素。

示例：

var fruits = ["apple", "banana", "orange", "kiwi", "pineapple"];
var keyword = "ap";
var filteredFruits = fruits.filter(function(fruit) {
  return fruit.indexOf(keyword) !== -1;
});
console.log(filteredFruits);  // 输出：["apple", "grape"]

在上面的示例中，我们定义了一个包含水果名称的数组 fruits，然后使用 filter() 方法来过滤包含子字符串 "ap" 的水果名称。

filter() 方法会遍历数组中的每个元素，对每个元素执行给定的回调函数，如果回调函数返回 true，则该元素会被包含在新的数组中。

在回调函数中，我们使用了字符串的 indexOf() 方法来判断水果名称是否包含指定的子字符串，如果包含则返回 true，否则返回 false。

这样就实现了模糊查询的功能，返回了包含指定子字符串的水果名称。

这种方法可以用于对数组中的元素进行模糊查询，根据具体需求可以灵活地调整关键字和判断条件。

3.json格式字符串

JSON（JavaScript Object Notation）是一种数据交换格式，它以人类可读的文本格式表示数据对象，同时也是一种数据格式标准。JSON 格式通常用于在不同系统之间传输和存储数据。

JSON 格式的字符串由键值对组成，键值对之间用逗号分隔，键和值之间用冒号分隔，整个对象使用大括号 {} 包裹。下面是一个简单的 JSON 字符串的示例：

{
  "name": "John",
  "age": 30,
  "isStudent": false,
  "address": {
    "city": "New York",
    "zipCode": "10001"
  },
  "hobbies": ["reading", "traveling", "photography"]
}

在上面的示例中，我们定义了一个包含个人信息的 JSON 对象。它包含了姓名、年龄、是否为学生、地址和爱好等键值对。

JSON 格式的字符串可以被解析为 JavaScript 对象，也可以用于数据的传输和存储。同时，JavaScript 中也提供了 JSON 对象，它包含了一些方法用于解析 JSON 字符串和将 JavaScript 对象转换为 JSON 字符串。

4.模板字符串

模板字符串是一种包含占位符的字符串，可以在运行时动态替换这些占位符。在JavaScript中，模板字符串使用反引号 （``）来定义，占位符使用${}包裹。

例如：

const name = 'Alice';
const age = 25;
const greeting = `Hello, my name is ${name} and I am ${age} years old.`;

console.log(greeting);

在上面的例子中，模板字符串中的{name}和{age}会在运行时被替换为变量name和age的值，最终输出的结果是"Hello, my name is Alice and I am 25 years old."。模板字符串的使用可以使字符串拼接更加简洁和易读。

02.数字

1.数字常用方法

toFixed

Number.toFixed() 是JavaScript中的一个内置方法，用于将数字转换为指定小数位数的字符串表示形式。

语法如下：

const num = 123.456;
const fixedNum = num.toFixed(2);
console.log(fixedNum); // 输出 "123.46"

在上面的例子中，toFixed(2) 将数字123.456转换为一个包含两位小数的字符串"123.46"。

需要注意的是，toFixed() 方法返回的是一个字符串，而不是一个数字。另外，toFixed() 方法会对数字进行四舍五入，因此需要注意其精度问题。

Math对象

random

生成随机数：

let randomNum = Math.random(); // 生成 0 到 1 之间的随机数
console.log(randomNum);

round

四舍五入：

let num = 4.7;
let roundedNum = Math.round(num);
console.log(roundedNum); // 输出 5

ceil（向上取整） floor（向下取整）

当使用 Math 对象时，可以使用 ceil() 和 floor() 方法执行向上取整和向下取整的操作。

向上取整 (ceil)：

let num = 4.3;
let ceilNum = Math.ceil(num);
console.log(ceilNum); // 输出 5

向下取整 (floor)：

let num = 4.9;
let floorNum = Math.floor(num);
console.log(floorNum); // 输出 4

在这两个示例中，我们使用了 Math 对象的 ceil() 方法将 4.3 上取整为 5，以及 floor() 方法将 4.9 下取整为 4。这些方法对于处理需要整数值的情况非常有用，如在计算时需要对结果进行取整操作。

sqrt平方根

当使用 Math.sqrt() 方法时，可以计算一个数的平方根。

示例：

let num = 25;
let sqrtNum = Math.sqrt(num);
console.log(sqrtNum); // 输出 5

在这个示例中，我们使用了 Math.sqrt() 方法来计算 25 的平方根，结果为 5。这个方法对于需要计算平方根的情况非常有用，例如在几何学或物理学中进行数学计算时。

pow（底数，指数）

当使用 Math.pow() 方法时，可以计算一个数的指定次幂。

示例：

let base = 2;
let exponent = 3;
let result = Math.pow(base, exponent);
console.log(result); // 输出 8

在这个示例中，我们使用了 Math.pow() 方法来计算 2 的 3 次幂，结果为 8。这个方法对于需要进行幂运算的情况非常有用，例如在计算复利或进行数学模型计算时。

max（多个参数）min

当使用 Math.max() 和 Math.min() 方法时，可以找到一组数字中的最大值和最小值。

示例：

let numbers = [3, 5, 1, 9, 2];
let maxNum = Math.max(...numbers);
let minNum = Math.min(...numbers);
console.log(maxNum); // 输出 9
console.log(minNum); // 输出 1

在这个示例中，我们使用了 Math.max() 方法找到数组中的最大值，并使用了 Math.min() 方法找到数组中的最小值。这些方法对于需要在一组数字中找到最大值和最小值的情况非常有用，例如在数据分析或排序算法中。

pi（π）

Math对象中的常数π（pi）表示一个圆的周长与直径的比值，通常值为3.14159。在JavaScript中，可以通过Math.PI来访问π的值。

示例：

let piValue = Math.PI;
console.log(piValue); // 输出 3.141592653589793

在这个示例中，我们使用了Math.PI来获取π的值，并将其打印出来。这个常数在数学计算中经常被用到，例如在几何学、物理学和工程学中。

2.案例-随机整数

在 JavaScript 中，可以创建一个名为 getRandomInt 的函数，用于生成指定范围内的随机整数。另外，也可以简化函数名为 getRnd。以下是两个函数的示例：

使用 getRandomInt 函数生成随机整数：

function getRandomInt(min, max) {
  min = Math.ceil(min);
  max = Math.floor(max);
  return Math.floor(Math.random() * (max - min + 1)) + min;
}

let randomNum = getRandomInt(1, 10);
console.log(randomNum);

使用 getRnd 函数生成随机整数：

function getRnd(min, max) {
  min = Math.ceil(min);
  max = Math.floor(max);
  return Math.floor(Math.random() * (max - min + 1)) + min;
}

let randomNum = getRnd(1, 10);
console.log(randomNum);

这两个函数都可以用来生成指定范围内的随机整数。只是函数名不同，功能相同。

03.时间

1.时间对象

以下是一些常见的JavaScript中处理时间的方法和示例：

获取当前时间：

var now = new Date();
console.log(now);

设置特定的日期和时间：

var specificDate = new Date(2022, 0, 1, 12, 0, 0); // 2022年1月1日12点
console.log(specificDate);

2.时间对象常用方法

1. 获取特定时间的年、月、日等信息：

var date = new Date();
var year = date.getFullYear();
var month = date.getMonth() + 1; // 月份从0开始，需要加1
var day = date.getDate();
console.log(year, month, day);

2.getTime时间戳

在 JavaScript 中，Date 对象的 getTime() 方法用于返回自 1970 年 1 月 1 日零时以来的毫秒数。这个毫秒数也被称为时间戳。

以下是使用 getTime() 方法获取时间戳的示例：

var date = new Date(); // 创建一个日期对象
var timestamp = date.getTime(); // 获取日期对象的时间戳
console.log(timestamp); // 打印时间戳

在这个示例中，我们创建了一个日期对象并使用 getTime() 方法获取了该日期对象的时间戳，然后将其打印出来。

这样的时间戳可以用于进行日期比较、计算时间差，或者在需要时进行日期的存储和传输。

3.定时器

setTimeout setInterval

setTimeout 和 setInterval 都是 JavaScript 中用于执行异步操作的定时器函数。

1. setTimeout 函数用于在指定的时间间隔后执行一次特定的代码。它接受两个参数，第一个参数是要执行的函数或要执行的代码块，第二个参数是延迟的时间（以毫秒为单位）。

示例：

// 在 3 秒后执行特定的代码
setTimeout(function() {
  console.log('3 秒后执行的代码');
}, 3000);

2. setInterval 函数用于在每个指定的时间间隔重复执行特定的代码。它也接受两个参数，第一个参数是要执行的函数或要执行的代码块，第二个参数是时间间隔（以毫秒为单位）。

示例：

// 每隔 1 秒执行特定的代码
setInterval(function() {
  console.log('每隔 1 秒执行的代码');
}, 1000);

需要注意的是，setTimeout 会在延迟时间后执行一次特定的代码，而 setInterval 会在每个时间间隔重复执行特定的代码。在使用时，需要根据具体的需求来选择合适的定时器函数。

claerTimeout clearInterval

clearTimeout 和 clearInterval 是用于取消 setTimeout 和 setInterval 创建的定时器的函数。

clearTimeout 函数用于取消通过 setTimeout 创建的定时器。它接受一个参数，即要取消的定时器的标识符。

示例：

// 创建一个定时器
var timeoutId = setTimeout(function() {
  console.log('这段代码将会被取消');
}, 3000);

// 取消定时器
clearTimeout(timeoutId);

clearInterval 函数用于取消通过 setInterval 创建的定时器。它也接受一个参数，即要取消的定时器的标识符。

示例：

// 创建一个定时器
var intervalId = setInterval(function() {
  console.log('这段代码将会重复执行');
}, 1000);

// 取消定时器
clearInterval(intervalId);

这两个函数可用于在需要时停止定时器的执行，以避免不必要的重复操作或节省资源。

异步执行-初

案例-倒计时

以下是一个使用 JavaScript 实现的简单倒计时的例子：

HTML:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Countdown Timer</title>
</head>
<body>
  <div id="countdown"></div>

  <script src="countdown.js"></script>
</body>
</html>

JavaScript (countdown.js):

// 设置目标日期时间
var targetDate = new Date('2022-12-31T23:59:59').getTime();

// 更新倒计时
function updateCountdown() {
  var currentDate = new Date().getTime();
  var timeDifference = targetDate - currentDate;

  var days = Math.floor(timeDifference / (1000 * 60 * 60 * 24));
  var hours = Math.floor((timeDifference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  var minutes = Math.floor((timeDifference % (1000 * 60 * 60)) / (1000 * 60));
  var seconds = Math.floor((timeDifference % (1000 * 60)) / 1000);

  // 更新页面显示
  document.getElementById('countdown').innerHTML = days + ' days ' + hours + ' hours ' + minutes + ' minutes ' + seconds + ' seconds ';

  // 检查是否已经到达目标日期时间
  if (timeDifference < 0) {
    clearInterval(interval);
    document.getElementById('countdown').innerHTML = 'Countdown expired';
  }
}

// 每秒更新一次倒计时
var interval = setInterval(updateCountdown, 1000);

在这个例子中，我们定义了一个目标日期时间 targetDate，然后使用 setInterval 函数每秒调用一次 updateCountdown 函数来更新倒计时。在 updateCountdown 函数中，我们计算当前日期时间与目标日期时间之间的时间差，并将结果更新到页面上。当时间差小于0时，表示已经到达目标日期时间，我们清除定时器 interval 并显示倒计时已经结束的消息。

04.总结

累！！！！！！！！！！！！！！

03.字符串~初识BOM前(57~67)