狠狠色丁香婷婷综合尤物/久久精品综合一区二区三区/中国有色金属学报/国产日韩欧美在线观看 - 国产一区二区三区四区五区tv

數組解構#

const arr = ["1","2","3"]
let a,b,c
// 解構賦值
//將數組的第一個元素賦值給第一個變量，第二個元素賦值給第二個變量，依次類推
[a,b,c] = arr
console.log(a,b,c) // 1 2 3

// 聲明變量同時解構
let [a,b,c] = ["1","2","3"]
console.log(a,b,c) // 1 2 3

// 如果變量數大于元素數量，則超出的變量部分賦值為undefined
const arr = ["1","2","3"]
let [a,b,c,d] = arr
console.log(a,b,c,d) // 1 2 3 undefined

// 默認值，如果變量聲明了默認值，解構為undefined的時候，則會使用默認值，否則使用對應元素
const arr = ["1","2","3"]
let [a,b,c=10,d=11] = arr
console.log(a,b,c,d) // 1 2 3 11

// 解構數組時可以使用...獲取剩余的元素
const arr = ["1","2","3","4","5"]
// 第一個元素賦值給a，第二個元素賦值給b，其余元素賦值給c
let [a,b, ...c] = arr
console.log(a) // 1
console.log(b) // 2
console.log(c) // ['3','4','4']

// 解構多維數組
const arr = [[1,2,3],[4,5,6]]
let [[a,b,c],obj] = arr
console.log(a,b,c) // 1 2  3
console.log(obj) // [4,5,6]

對象解構#

const user = {"name":"q",age:18}
// 聲明變量同時解構對象
let {name,age} = user
console.log(name,age) // q  18

// 先聲明變量，再解構對象
const user = {"name":"q",age:18}
let name,age
({name,age} = user)  // {} 在js中是代碼塊，所以需要在外面使用()
console.log(name,age) // q 18

const user = {"name":"q",age:18}
// 如果變量名與屬性名不匹配，則解構為undefined
let {a,b} = user
console.log(a,b) // undefined undefined
// 可以給變量起別名再解構
// 可以給變量既起別名，又設置默認值
let {name:c,age:d=20} = user
console.log(c,d) // q  18

對象的序列化#

JS中的對象使用時都是存在于計算機的內存中的,序列化指將對象轉換為一個可以存儲的格式,在JS中對象的序列化通常是將一個對象轉換為字符串（JSON字符串）

const user = {name:"l",age:18}
// 將一個對象轉換為json字符串
const strUser = JSON.stringify(user)
console.log(strUser)
// 將一個json字符串轉換為js對象
const objUser = JSON.parse(strUser)
console.log(objUser)

編寫JSON的注意事項：

1. JSON字符串有兩種類型：

   • JSON對象 {}
   • JSON數組 []

2. JSON字符串的屬性名必須使用雙引號引起來

3. JSON中可以使用的屬性值（元素）

   • 數字（Number）
   • 字符串（String） 必須使用雙引號
   • 布爾值（Boolean）
   • 空值（Null）
   • 對象（Object {}）
   • 數組（Array []）

// 利用json完成深復制，將對象轉換成字符串，再將字符串轉換成一個新對象
const strUser = JSON.stringify(user)
const objUser = JSON.parse(strUser)

Map#

Map用來存儲鍵值對結構的數據（key-value）

Object中存儲的數據就可以認為是一種鍵值對結構

Map和Object的主要區別：

• Object中的屬性名只能是字符串或符號，如果傳遞了一個其他類型的屬性名，JS解釋器會自動將其轉換為字符串
• Map中任何類型都可以稱為數據的key

map的使用#

const info = new Map()
// 設置鍵值對
info.set("name","l")
info.set({},"a")
info.set(NaN,"b")
console.log(info)  // Map(3) { 'name' => 'l', {} => 'a', NaN => 'b' }
// 當前map大小
console.log(info.size) // 3
// 獲取map的所有的key
console.log(info.keys())  // [Map Iterator] { 'name', {}, NaN }
// 獲取map所有的value
console.log(info.values()) // [Map Iterator] { 'l', 'a', 'b' }
// 檢查map是否包含指定key，包含true否則false
console.log(info.has(NaN)) // true
// 通過key獲取指定元素
console.log(info.get("name"))  // l
// 刪除元素
info.delete("name")
console.log(info)  // Map(2) { {} => 'a', NaN => 'b' }
// 清空map
info.clear()
console.log(info)  // Map(0) {}

map的轉換#

const info = new Map()
info.set("name","l")
info.set({},"a")
info.set(NaN,"b")
// 使用Array.from將 map轉換為數組
const arr = Array.from(info)
console.log(arr)  // [ [ 'name', 'l' ], [ {}, 'a' ], [ NaN, 'b' ] ]

const arr = [["name",1],["age",2]]
// 將二維數組轉換為map
const map = new Map(arr)
console.log(map) // Map(2) { 'name' => 1, 'age' => 2 }

遍歷map#

const info = new Map()
info.set("a",1)
info.set("b",2)
// 方式一
for (const entry of info){
    const [key,value] = entry
    console.log(key,value)
}
for (const [key,value] of info){
    console.log(key,value)
}
// 方式二
info.forEach((key,value)=>{
    console.log(key,value)
})

Set#

• Set用來創建一個集合
• 它的功能和數組類似，不同點在于Set中不能存儲重復的數據

// 創建集合
const set = new Set()
// 添加數據,如果集合中已經存在要添加的元素，則不會添加
set.add("a")
set.add("b")
// 獲取集合的大小
console.log(set.size) // 2
// 檢查集合中是否包含指定元素，包含true否則false
console.log(set.has("a")) // true
// 讀取指定元素-需要將set轉換成數組，然后通過下標讀取
const arr = [...set]
console.log(arr[0]) // a
// 刪除元素
set.delete("b")
//  遍歷集合
for (const v of set){
    console.log(v)
}

// 通過數組創建集合，基于集合元素的唯一性，會對數組進行去重
const arr = [1,2,3,4,4,1,1,5]
const set =  new Set(arr)
console.log(set) // Set(5) { 1, 2, 3, 4, 5 }

Math#

Math是一個工具類，提供了數學運算的一些常量和方法

用法大全

// 常量 圓周率
console.log(Math.PI)  // 3.141592653589793
// 求一個數的絕對值
console.log(Math.abs(-123))  // 123
// 求多個值中的最小值
console.log(Math.min(1, 2, 3))  // 1
// 求多個值中的最大值
console.log(Math.max(1,2,3))  // 3
// 求指定數值的冪次方
console.log(Math.pow(2,3)) // 8
// 求一個數的平方根
console.log(Math.sqrt(4)) // 2
// 向下取整
console.log(Math.floor(1.5)) // 1
// 向上取整
console.log(Math.ceil(1.5)) // 2
// 四舍五入取整
console.log(Math.round(3.5)) // 4
// 去除小數位
console.log(Math.trunc(3.5)) // 3
// 生成0~1之間的隨機浮點數，不包含0和1
console.log(Math.random()) // 0.11258771607929718
// 生成 0~5之間的隨機整數
// Math.random范圍 是0~1，*5將范圍擴大5倍 0~5 默認不包含0和5，然后四舍五入，根據四舍五入包含0和5
console.log(Math.round(Math.random() * 5))
// 生成 x ~ y 任意范圍的隨機數
/*
1~6之間的隨機數
范圍擴大5倍，是0~5，然后+1是1~6，得出隨機小數后四舍五入，包含1和6
*/
console.log(Math.round(Math.random() * 5 + 1))
// 11~20之間的整數
// [0,1] -> [0,9] -> [0+11,9+11]
// 先寫+號后面的部分，11，,20-11=9
console.log(Math.round(Math.random() * 9 + 11))
// 根據 四舍五入、取證等方法的規則，來決定左右數值是否包含

Date#

在JS中所有的和時間相關的數據都由Date對象來表示

用法大全

Date使用#

// 創建當前的時間的對象
let date = new Date()
console.log(date) // 2024-10-30T10:48:29.454Z
// 創建指定時間對象-年,月(從下標0開始),日,時,分,秒,毫秒
date = new Date(2024,9,30,13,13,13,13)
console.log(date) // 2020-01-01T05:13:13.000Z
// 創建指定時間的對象-通過時間字符串-年-月-日 時:分:秒
date = new Date("2024-10-30 12:00:00")
console.log(date) // 2024-10-30T04:00:00.000Z
// 創建指定時間的對象-通過時間戳
date = new Date(1730265193013)
console.log(date) // 2024-10-30T05:13:13.013Z
// 獲取時間對象的年份
console.log(date.getFullYear())
// 獲取時間對象的月份-返回的是月份的索引，索引從0開始
console.log(date.getMonth())
// 獲取時間對象的日
console.log(date.getDate())
// 獲取日期對象是周幾（0-6） 0表示周日
console.log(date.getDay())
// 返回當前日期對象的時間戳
console.log(date.getTime())
// 返回當前時間的時間戳
console.log(Date.now())

Date格式化#

let date = new Date()
// 將日期轉換為本地時間格式字符串
let time = date.toLocaleDateString()
console.log(time)  // 10/31/2024
// 將時間轉換為本地時間格式字符串
time = date.toLocaleTimeString()
console.log(time) // 10:32:05 AM
// 日期時間轉換為本地時間格式字符串
time = date.toLocaleString()
console.log(time) // 10/31/2024, 10:32:50 AM
// 日期時間轉換為指定地區、格式字符串-指定國家時間
time = date.toLocaleString(
    "en-US", // 指定語言和國家
    {dateStyle: "full", timeStyle: "full"}
    //                             dateStyle 日期的風格
    //                             timeStyle 時間的風格
    //                                 full
    //                                 long
    //                                 medium
    //                                 short
    //                             hour12 是否采用12小時值
    //                                 true
    //                                 false
    //                             weekday 星期的顯示方式
    //                                 long
    //                                 short
    //                                 narrow
    //
    //                             year
    //                                 numeric
    //                                 2-digit
)
console.log(time)

包裝類#

在JS中，除了直接創建原始值外，也可以創建原始值的對象

//         通過 new String() 可以創建String類型的對象
//         通過 new Number() 可以創建Number類型的對象
//         通過 new Boolean() 可以創建Boolean類型的對象
//         注意:千萬不要這么做,通過該方式創建的是對象，無法與原始值做比較
let str = new String("hello world")
let num = new Number(10)
let bool = new Boolean(true)
num.max = 100 // 給num對象設置屬性
console.log(str) // [String: 'hello world']
console.log(num) // [Number: 10]
console.log(num.max) // 100 
console.log(bool) // [Boolean: true]
console.log(num === 10) // false

包裝類：

• JS中一共有5個包裝類
• String --> 字符串包裝為String對象
• Number --> 數值包裝為Number對象
• Boolean --> 布爾值包裝為Boolean對象
• BigInt --> 大整數包裝為BigInt對象
• Symbol --> 符號包裝為Symbol對象

通過包裝類可以將一個原始值包裝為一個對象

當我們對一個原始值調用方法或屬性時，JS解釋器會臨時將原始值包裝為對應的對象,然后調用這個對象的屬性或方法

// 原始值
let str = "hello world"
// 給原始值添加屬性，會將原始值轉換為一次性臨時的原始值對象
str.name = "11111"
// 賦值和讀取兩次調用str.name,是兩次臨時的原始值對象，無法通過該方法讀取
console.log(str.name) // undefined
let num = 100
// 原始值number是沒有方法的，當調用方法時，將num臨時的轉為number對象，調用number對象的toString方法
num = num.toString()

由于原始值會被臨時轉換為對應的對象，這就意味著原始值對象中的方法都可以直接通過原始值來調用

// 字符串的本質是一個字符數組, hello-->["h","e","l","l","0"]
let str = "hello"
// 可以通過操作數組的一些方法去操作字符串
// 索引讀取字符-不可以負索引
console.log(str[0]) // h
// 遍歷字符串
for (let char of str){
    console.log(char)
}
// 獲取字符串長度
console.log(str.length) // 5
// 根據索引獲取字符串，可以接受負數索引
console.log(str.at(-1)) // o
// 索引讀取字符-不可以負索引
console.log(str.charAt(0)) // h
// 用來連接兩個或者多個字符串,返回一個新字符串
console.log(str.concat(" world"," !")) // hello world !
// 檢查字符串中是否包含某個內容，返回true或者false
console.log(str.includes("ll")) //檢測全部字符串 true
console.log(str.includes("h",2)) // 從下標2開始檢測  false
// 檢查指定字符第一次出的位置
console.log(str.indexOf("l")) // 2
// 檢查指定字符最后一次出現的位置
console.log(str.lastIndexOf("l")) // 3
// 檢查字符串是否以指定內容開頭
console.log(str.startsWith("he")) // true
// 檢查字符串是否以指定內容結尾
console.log(str.endsWith("o")) // true
// 給字符串補位 如果字符串長度不夠指定長度，從開頭開始補，返回一個新字符串,不指定補位字符，則默認是空
console.log(str.padStart(7,"0")) // 00hello
// 給字符串補位 如果字符串長度不夠指定長度，從結尾開始補0，返回一個新字符串
console.log(str.padEnd(8,"0")) // hello000
// 使用一個新字符串替換字符串中的一個指定內容，返回一個新字符串
console.log(str.replace("l","a")) // healo
// 使用一個新字符串替換所有指定內容，返回一個新字符串
console.log(str.replaceAll("l","a")) // heaao
// 對字符串進行切片,左閉右開
console.log(str.slice(1,3)) // el
// 截取字符串，左閉右開
console.log(str.substring(1,3)) // el
// 將一個字符串拆分為一個數組,參數指定以什么字符間隔拆分
console.log(str.split("")) // [ 'h', 'e', 'l', 'l', 'o' ]
// 將字符串轉換為小寫
console.log(str.toLowerCase()) // hello
// 將字符串轉換為大寫
console.log(str.toLocaleUpperCase()) // HELLO
// 去除首尾空格
console.log(str.trim())
// 去除開始空格
console.log(str.trimStart())
// 去除結束空格
console.log(str.trimEnd())

正則表達式#

• 正則表達式用來定義一個規則
• 通過這個規則計算機可以檢查一個字符串是否符合規則或者將字符串中符合規則的內容提取出來
• 正則表達式也是JS中的一個對象，所以要使用正則表達式，需要先創建正則表達式的對象

創建正則表達式對象#

// 通過構造函數創建正則表達式對象，RegExp() 接收兩個字符串參數 1.正則表達式 2.匹配模式
// 字符串轉義原因，表達式編寫注意轉義
let regObj = new RegExp("\\w","i")
// 使用字面量創建一個正則表達式對象, /正在表達式/匹配模式
// 字面量創建不用考慮轉義問題
let reg = /\w/i
let reg2 = new RegExp("a")
// test方法:get定的字符串str中測試是否存在與正則表達式re匹配的部分
console.log(reg2.test("abc")) // 字符串str 表達式a  str中包含a   返回true

正則表達式語法#

// 在正則表達式中大部分字符都可以直接寫
// | 在正則表達式中表示或
// 字符串是否有abc或者bcd
let re = /abc|bcd/
// [] 表示字符集
// 字符串是否包含字符集里面的任意字母，等同于 a | b | c
re = /[abc]/
// 任意的小寫字母
re = /[a-z]/
// 任意的大寫字母
re = /[A-Z]/
// 任意的大小寫字母
re = /[a-zA-Z]/
// 任意的數字
re = /[0-9]/
// [^]表示排除
// 除了a以外的任意字符
re = /[^a]/
// .表示除了換行以外的任意字符 ,如果想匹配. 需要轉義 /\./
re = /./
// 其他字符集
// 任意的單詞字符 [A-Za-z0-9_]
re = /\w/
// 排除單詞字符  [^A-Za-z0-9_]
re = /\W/
// 任意數字 [0-9]
re = /\d/
// 排除數字 [^0-9]
re = /\D/
// 空格
re = /\s/
// 排除空格
re = /\S/
// 單詞邊界
re = /\b/
// 排除單詞邊界
re = /\B/
// 開頭和結尾,^表示字符串的開頭，$表示字符串的結尾
// 匹配開始位置的a
re = /^a/
// 匹配結束位置的a
re = /a$/
// 匹配字幕a，完全匹配，字符串和正則完全一致
re = /^a$/

量詞#

// 3個a
let re = /a{3}/
// 至少3個a
re = /a{3,}/
// 3~6個a
re = /a{3,6/
// 多字符匹配:兩次匹配只對量詞前面的一個字符生效，比如 /ab{3}/,只會檢測b，不會檢測ab，如果要檢測ab，需要使用()
re = /(ab){3}/
//  開頭任何個小寫字母
re = /^[a-z]{3}/
// + 表示一個以上，等同于{1,}
re = /a+/
// *表示任意數量
re = /a*/
// ?表示0-1次  等同于{0,1}
re = /a?/

正咋表達式匹配模式#

1. 默認（貪婪模式）
   • 在 JavaScript 正則表達式中，默認情況下量詞（如*、+、?）是貪婪的。這意味著它們會盡可能多地匹配字符。
   • 例如，對于正則表達式/a.*b/和字符串"aabbbc"，它會匹配從第一個a到最后一個b的整個字符串，即"aabbbc"。因為.*會盡可能多地匹配中間的字符，直到遇到最后一個b。
2. 非貪婪模式（懶模式）
   • 通過在量詞后面添加?可以將其轉換為非貪婪模式。在非貪婪模式下，量詞會盡可能少地匹配字符。
   • 例如，對于正則表達式/a.*?b/和字符串"aabbbc"，它會匹配"aab"。因為.*?會在遇到第一個b時就停止匹配，只匹配最少的字符來滿足表達式。
3. 全局匹配模式（g）
   • 當在正則表達式末尾添加g標志（如/pattern/g）時，它會進行全局匹配。這意味著會在整個字符串中查找所有匹配的部分，而不是只找到第一個匹配就停止。
   • 例如，對于正則表達式/a/g和字符串"aaab"，它會匹配所有的a，返回一個包含三個a的數組（在使用match方法時）。如果沒有g標志，只會返回第一個a。
4. 不區分大小寫匹配模式（i）
   • 在正則表達式末尾添加i標志（如/pattern/i）會使匹配不區分大小寫。
   • 例如，對于正則表達式/a/i和字符串"Aa"，它會匹配A，因為不區分大小寫。
5. 多行匹配模式（m）
   • 當添加m標志（如/pattern/m）時，^和$的匹配行為會發生改變。^不僅可以匹配字符串開頭，還可以匹配每一行的開頭；$不僅可以匹配字符串結尾，還可以匹配每一行的結尾。
   • 例如，對于正則表達式/^a/m和字符串"a\nb"，它會匹配第一行開頭的a，如果沒有m標志，它只會匹配整個字符串開頭的a，對于這個例子就不會匹配

正則表達式提取#

exec()用于獲取字符串中符合正則表達式的內容

let str = "abc123bcc456cbdd"
let re = /\d+/ig
// '123'是本次匹配到的結果，index是匹配到的字符串在原始輸入字符串中的起始索引位置是 3，input是原始字符串，group是組
console.log(re.exec(str)) // [ '123', index: 3, input: 'abc123bcc456cbdd', groups: undefined ]
console.log(re.exec(str)) // [ '456', index: 9, input: 'abc123bcc456cbdd', groups: undefined ]
// 每調用一次只會匹配一次，調用多次會依次向后匹配，為null說明匹配結束沒有了
console.log(re.exec(str)) // null
// 使用()可以進行分組
str = "abcadcacc"
// 匹配a*c，使用()把中間的字符分組
re = /a([a-z])c/
// abc是本次匹配到的內容，b是分組內的內容
console.log(re.exec(str)) // [ 'abc', 'b', index: 0, input: 'abcadcacc', groups: undefined ]

字符串的正則方法#

let str = "llaacqqabcccaccdd"
// 可以根據正則表達式來對一個字符串進行拆分
console.log(str.split(/a[a-z]c/)) // [ 'll', 'qq', 'cc', 'dd' ]
// 根據正則表達式替換字符串中的指定內容
console.log(str.replace(/a[a-z]c/g,"@")) // ll@qq@cc@dd
// 可以去搜索符合正則表達式的內容第一次在字符串中出現的位置
console.log(str.search(/a[a-z]c/)) // 2
// 根據正則表達式去匹配字符串中所有符合要求的內容
console.log(str.match(/a/g)) // [ 'a', 'a', 'a', 'a' ]
// 根據正則表達式去匹配字符串中符合要求的內容(必須設置g 全局匹配),返回的是一個迭代器
console.log(str.matchAll(/a/g)) // Object [RegExp String Iterator] {}

垃圾回收機制#

• 如果一個對象沒有任何的變量對其進行引用，那么這個對象就是一個垃圾對象
• 垃圾對象的存在，會嚴重的影響程序的性能
• 在JS中有自動的垃圾回收機制，這些垃圾對象會被解釋器自動回收，我們無需手動處理
• 對于垃圾回收來說，我們唯一能做的事情就是將不再使用的變量設置為null

let obj = { value: 1 };
let anotherObj = obj;  // obj的引用次數增加到2
obj = null;            // obj的引用次數減少到1
anotherObj = null;     // obj的引用次數減少到0，可被垃圾收集器回收

?作者：木子七

出處：https://www.cnblogs.com/Mickey-7/p/18517791