Javascript考點
內建物件
Math
Math.<方法名>(引數);
Math.abs(x) --- 絕對
功能:返回數字 x 的絕對值。
語法:Math.abs(x)
console.log(Math.abs(-5)); // 輸出 5
console.log(Math.abs(10)); // 輸出 10
Math.ceil(x) --- 天花板
功能:返回大於或等於 x 的最小整數(向上取整)。
語法:Math.ceil(x)
console.log(Math.ceil(4.2)); // 輸出 5
console.log(Math.ceil(-4.2)); // 輸出 -4
Math.floor(x) --- 地板
功能:返回小於或等於 x 的最大整數(向下取整)。
語法:Math.floor(x)
console.log(Math.floor(4.7)); // 輸出 4
console.log(Math.floor(-4.7)); // 輸出 -5
Math.round(x) --- 大概
功能:返回四捨五入後的整數。
語法:Math.round(x)
console.log(Math.round(4.5)); // 輸出 5
console.log(Math.round(4.4)); // 輸出 4
Math.max(x, y, ...) ---max
功能:返回一組數中的最大值。
語法:Math.max(a, b, c, ...)
console.log(Math.max(1, 2, 3, 4)); // 輸出 4
console.log(Math.max(-1, -2, -3)); // 輸出 -1
Math.min(x, y, ...) ---min
功能:返回一組數中的最小值。
語法:Math.min(a, b, c, ...)
console.log(Math.min(1, 2, 3, 4)); // 輸出 1
console.log(Math.min(-1, -2, -3)); // 輸出 -3
Math.random() ---random
功能:返回一個 0到1 之間的隨機浮動數(包括 0,但不包括 1)。
語法:Math.random()
console.log(Math.random()); // 輸出一個隨機數,例如 0.7623
Math.pow(x, y) ---pow
功能:返回 x 的 y 次冪,即 x^y。
語法:Math.pow(x, y)
console.log(Math.pow(2, 3)); // 輸出 8,因為 2^3 = 8
console.log(Math.pow(3, 2)); // 輸出 9,因為 3^2 = 9
Math.sqrt(x)
功能:返回 x 的平方根。
語法:Math.sqrt(x)
console.log(Math.sqrt(9)); // 輸出 3,因為 9 的平方根是 3
console.log(Math.sqrt(16)); // 輸出 4,因為 16 的平方根是 4
Math.sin(x)、Math.cos(x)、Math.tan(x)
功能:分別返回 x 的正弦、餘弦和正切值。引數 x 必須是弧度制。
語法:
Math.sin(x)
Math.cos(x)
Math.tan(x)
console.log(Math.sin(Math.PI / 2)); // 輸出 1,π/2 的正弦值是 1 //PI是Π
console.log(Math.cos(Math.PI)); // 輸出 -1,π 的餘弦值是 -1
console.log(Math.tan(Math.PI / 4)); // 輸出 1,π/4 的正切值是 1
Math.log(x)
功能:返回 x 的自然對數(以 e 為底)。
語法:Math.log(x)
console.log(Math.log(10)); // 輸出 2.302585092994046,因為 ln(10) ≈ 2.302
Math.exp(x) ---e的X pow
功能:返回 e 的 x 次冪(自然對數的底 e,約為 2.718)。
語法:Math.exp(x)
console.log(Math.exp(1)); // 輸出 2.718281828459045,因為 e^1 ≈ 2.718
常用的 Math 常量
(1)Math.PI
功能:表示圓周率 π(大約 3.14159)。
語法:Math.PI
console.log(Math.PI); // 輸出 3.141592653589793
(2) Math.E
功能:表示自然對數的底數 e(大約 2.718)。
語法:Math.E
console.log(Math.E); // 輸出 2.718281828459045
(3) Math.LN2
功能:表示 2 的自然對數(大約 0.693)。
語法:Math.LN2
console.log(Math.LN2); // 輸出 0.6931471805599453
(4) Math.LN10
功能:表示 10 的自然對數(大約 2.302)。
語法:Math.LN10
console.log(Math.LN10); // 輸出 2.302585092994046
(5) Math.SQRT2
功能:表示 2 的平方根(大約 1.414)。
語法:Math.SQRT2
console.log(Math.SQRT2); // 輸出 1.4142135623730951
(6) Math.SQRT1_2
功能:表示 1/2 的平方根(大約 0.707)。
語法:Math.SQRT1_2
console.log(Math.SQRT1_2); // 輸出 0.7071067811865476
(7) Math.LOG2E
功能:表示 e 的對數,以 2 為底(大約 1.442)。
語法:Math.LOG2E
console.log(Math.LOG2E); // 輸出 1.4426950408889634
Date
在 JavaScript 中,Date 物件用於處理和操作日期和時間。它是一個非常強大的工具,能夠幫助你獲取當前時間、格式化日期、比較日期等。
建立 Date 物件
(1) 建立當前日期和時間
const now = new Date();
console.log(now); // 輸出當前的日期和時間,Sun Nov 10 2024 20:54:08 GMT+0800 (中國標準時間)
這種方式不傳引數,返回當前的日期和時間。
(2) 建立指定日期和時間
1.使用日期字串:
const date1 = new Date("2024-11-10");
console.log(date1); // 輸出 2024-11-10T00:00:00.000Z
2.使用年月日(不帶時間):--->陣列下標規則
const date2 = new Date(2024, 10, 10); // 注意:月份從 0 開始,10 表示 11 月
console.log(date2); // 輸出 2024-11-10T00:00:00.000Z
3.使用年月日時分秒:
const date3 = new Date(2024, 10, 10, 12, 30, 0);
console.log(date3); // 輸出 2024-11-10T12:30:00.000Z
4.使用時間戳:
!!!有點懵
const date4 = new Date(1699680000000); // 時間戳單位為毫秒
console.log(date4); // 輸出對應的日期,例如 2024-11-10T00:00:00.000Z
獲取和設定日期和時間的各個部分
獲取年、月、日、小時、分鐘、秒等
getFullYear():獲取四位年份(例如 2024)。
getMonth():獲取月份(0-11,0 代表 1 月,11 代表 12 月)。
getDate():獲取日期(1-31 !!!!)。
getDay():獲取星期幾(0-6,0 代表星期日,6 代表星期六)。
getHours():獲取小時(0-23)。
getMinutes():獲取分鐘(0-59)。
getSeconds():獲取秒(0-59)。
getMilliseconds():獲取毫秒(0-999)。
const date = new Date("2024-11-10T12:30:00");
console.log(date.getFullYear()); // 輸出 2024
console.log(date.getMonth()); // 輸出 10 (表示 11 月)
console.log(date.getDate()); // 輸出 10
console.log(date.getDay()); // 輸出 0 (星期日)
console.log(date.getHours()); // 輸出 12
console.log(date.getMinutes()); // 輸出 30
console.log(date.getSeconds()); // 輸出 0
console.log(date.getMilliseconds());// 輸出 0
設定年、月、日、小時、分鐘、秒等
setFullYear(year):設定年份。
setMonth(month):設定月份(0-11)。
setDate(date):設定日期(1-31)。
setHours(hour):設定小時(0-23)。
setMinutes(minute):設定分鐘(0-59)。
setSeconds(second):設定秒(0-59)。
setMilliseconds(milliseconds):設定毫秒(0-999)。
const date = new Date();
date.setFullYear(2025);
date.setMonth(0); // 設定為 1 月
date.setDate(15); // 設定日期為 15
console.log(date); // 輸出類似 2025-01-15T... 的日期
日期的比較[時間戳比較]
你可以透過比較兩個 Date 物件來判斷它們的先後關係。
比較時間戳:使用 getTime() 方法獲取時間戳,然後直接進行比較。
const date1 = new Date("2024-11-10");
const date2 = new Date("2025-11-10");
if (date1.getTime() < date2.getTime()) {
console.log("date1 is earlier than date2");
} else {
console.log("date1 is later than or the same as date2");
}
日期格式化 --掌握一兩個就好
JavaScript 中的 Date物件本身沒有內建的格式化方法(即沒有像 toString("yyyy-MM-dd") 這樣的功能),但你可以使用一些方法將日期轉為字串。
toDateString()
將日期轉換為易讀的格式(去掉時間部分)。
const date = new Date("2024-11-10T12:30:00");
console.log(date.toDateString()); // Sun Nov 10 2024
toTimeString() --->好棒!!
將時間轉換為易讀的時間格式。
const date = new Date("2024-11-10T12:30:00");
console.log(date.toTimeString()); // 12:30:00 GMT+0800 (中國標準時間)
toISOString()
返回 ISO 格式的字串,通常用於API 傳輸。
const date = new Date("2024-11-10T12:30:00");
console.log(date.toISOString()); // 2024-11-10T04:30:00.000Z
toLocaleString() --好棒!!
返回本地化的日期和時間字串,格式根據瀏覽器的語言環境而有所不同。
const date = new Date("2024-11-10T12:30:00");
console.log(date.toLocaleString()); // 2024/11/10 12:30:00
日期的加減
JavaScript Date 物件沒有直接支援加減日期的方法,但你可以透過設定日期的各個部分來手動實現。
增加天數
const date = new Date("2024-11-10");
date.setDate(date.getDate() + 5); // 增加 5 天
console.log(date); // Fri Nov 15 2024 08:00:00 GMT+0800 (中國標準時間)
console.log(date.toLocaleString()); //2024/11/15 08:00:00
減少天數
const date = new Date("2024-11-10");
date.setDate(date.getDate() - 5); // 減少 5 天
console.log(date); // 輸出 2024-11-05
增加月份
const date = new Date("2024-11-10");
date.setMonth(date.getMonth() + 2); // 增加 2 個月
console.log(date); // 輸出 2025-01-10
增加年份
const date = new Date("2024-11-10");
date.setFullYear(date.getFullYear() + 1); // 增加 1 年
console.log(date); // 輸出 2025-11-10
日期和時間戳
- 你可以透過 getTime() 方法獲取一個 Date 物件的時間戳
const date = new Date();
console.log(date.getTime()); // 輸出當前時間的時間戳,例如 1678502399973
- 你還可以透過 Date.now() 獲取當前的時間戳:
console.log(Date.now()); // 輸出當前時間的時間戳
總結
Date 物件是 JavaScript 中非常重要的一個工具,能夠幫助你處理日期和時間。
透過它,你可以:
獲取和設定日期、時間的各個部分(如年、月、日、時、分、秒等)。
比較不同日期之間的大小。
格式化日期為字串。
計算日期的加減。
獲取和轉換為時間戳。
Array
//1.find()
const arry1 = [5,12,8,130,44];
const found = arry1.find(a => a > 10);
// 這一行使用了find方法,它是JavaScript陣列物件的一個方法,用於找出第一個滿足提供的測試函式的元素。
// find()的箭頭函式:變數名 => 條件【滿足條件返回它所找到的第一個值,不滿足返回undefined】
console.log(found);//[12]
//2.filter()
const arry1 = [5, 12, 8, 130, 44];
const filtered = arry1.filter(element => element > 10); // 返回所有大於10的元素組成的新陣列
console.log(typeof filtered); // object--->陣列是特殊的物件
console.log(filtered); // [12,130,44]
console.log(Array.isArray(filtered)); // true
// 返回一個新陣列,包含所有滿足條件的元素,沒有就返回空陣列。
// 3.include()
const array = [1, 2, 3, 4, 5];
if (array.includes(3&&4)) { // 檢查陣列是否包含元素3
console.log('陣列包含元素 3和4');
} else {
console.log('陣列不包含元素 3或4');
}
// 檢查陣列裡有沒有相應的值
//4.Array.isArray()
console.log(Array.isArray(變數)); // true
//檢查是不是Array型別
//5.push()
const arr = [1, 2, 3]
arr.push(8)
console.log(arr) // [1, 2, 3, 8]
//在陣列後面新增數字
//6.pop()
const arr = [1, 2, 3]
const popVal = arr.pop()//移除arr裡最後一個元素,並返回它給popVal
console.log(popVal) // 3 -->被移走的元素
console.log(arr) // [1, 2]
//棧 -->
// ① 陣列模擬常見資料結構之一:棧
const stack = [0, 1]
stack.push(2) // 壓棧
console.log(stack) // [0, 1, 2]
const popValue = stack.pop() // 出棧
console.log(popValue) // 2
console.log(stack) // [0, 1]
//7.unshift()
const arr = [1, 2, 3]
arr.unshift(0)
console.log(arr) // [0, 1, 2, 3]
//8.shift()
const arr = [1, 2, 3]
const shiftVal = arr.shift()--移除arr裡第一一個元素,並返回它給shiftVal
console.log(shiftVal) // 1 -->被移走的元素
console.log(arr) // [2, 3]
// ②陣列模擬常見資料結構之一:佇列
const queue = [0, 1]
queue.push(2) // 入隊
console.log(queue) // [0, 1, 2]
const shiftValue = queue.shift() // 出隊
console.log(shiftValue) // 0
console.log(queue) // [1, 2]
//9.concat()
const arr = [1, 2, 3]
const arr2 = arr.concat([7, 8, 9])
console.log(arr) // [1, 2, 3]
console.log(arr2) // [1, 2, 3, 7, 8, 9]
//把concat括號裡的內容放到原陣列的後面
//10.ndexof()
const arr = [1, 2, 3]
console.log(arr.indexOf(2)) // 1
console.log(arr.indexOf(-1)) // -1
// 在陣列中尋找該值,找到則返回其下標,找不到則返回-1。
//11.join()
const arr = [1, 2, 3]
console.log(arr.join()) // ‘1, 2, 3’//將陣列轉化成字串,並返回該字串,不傳值則預設逗號隔開,
console.log(arr) // [1, 2, 3]//原陣列不變。
// 將陣列轉化成字串,並返回該字串,不傳值則預設逗號隔開,原陣列不變。
let fruits = ["Apple", "Banana", "Cherry"];
let result = fruits.join(", "); // 使用逗號和空格作為分隔符
//12.reverse()
console.log(result); // 輸出: Apple, Banana, Cherry
const arr = [1, 2, 3]
console.log(arr.reverse()) // [3, 2, 1]
console.log(arr) // [3, 2, 1]
// 翻轉原陣列,並返回已完成翻轉的陣列,原陣列改變。
13. slice(start,end)
const arr = [1, 2, 3, 4, 5]
console.log(arr.slice(1, 4)) // [2, 3, 4]
//角標為1 --- 角標為3
console.log(arr) // [1, 2, 3, 4, 5]
// 從start 開始擷取到end,但是不包括end
//14.splice(index1,index2,new1,new2,new3.....)
const arr3 = [1, 2, 3, 4, 5, 6, 7, "f1", "f2"];
const arr4 = arr3.splice(2, 3)
console.log(arr4); // [3, 4, 5];
console.log(arr3); // [1, 2, 6, 7, "f1", "f2"];
const arr5 = arr3.splice(2, 0, "wu", "leon"); //插入的元素在選定下標位置前面
console.log(arr5); // [] 返回空陣列
console.log(arr3); // [1, 2, "wu", "leon", 6, 7, "f1", "f2"];
const arr6 = arr3.splice(2, 3, "xiao", "long");
console.log(arr6); // ["wu", "leon", 6]
console.log(arr3); //[ 1, 2, "xiao", "long", 7, "f1", "f2"]
const arr7 = arr3.splice(2);
console.log(arr7);// ["xiao", "long", 7, "f1", "f2"]
console.log(arr3); // [1, 2]
原陣列刪除從下標index1開始num個元素【包括端點】,如果需要被刪元素,將它存到新的變數裡就好
p.s.如果num不寫,預設刪光下標開始所有元素
//15.sort((a, b) => a - b)--從小到大
//15.sort((a, b) => b - a)--從大到小
const arr = [1, 4, 3]
arr.sort((a, b) => b - a)
console.log(arr) // [4, 3, 1]
const arrplus = [1, 4, 3]
arrplus.sort((a, b) => a - b)
console.log(arrplus) // [1, 3, 4]
//16.tostring()
const arr = [1, 2, 3, 4, 5]
console.log(arr.toString()) // ‘1, 2, 3, 4, 5’
console.log(arr) // [1, 2, 3, 4, 5]
將陣列變成字串 將陣列轉化成字串,並返回該字串,**逗號**隔開,原陣列不變。
String
//1.charAt
var father = 'abcdefg'
let son = father.charAt(2)
console.log(son) // 輸出 'c'
console.log(father[3]) // 輸出 'd'
// 返回指定索引位置處的字元。類似於陣列用中括號獲取相應下標位置的資料。
//2.concat()
const str1 = 'abcdefg'
const str2 = '1234567'
const str3 = str1.concat(str2)
console.log(str3) // 輸出 'abcdefg1234567'
// 類似陣列的concat(),用來返回一個合併拼接兩個或兩個以上字串。原字串不變。
//3.indexOf() lastIndexOf()
const str = 'abcdcefcg'
console.log(str.indexOf('c')) // '2'
console.log(str.lastIndexOf('c')) // '7'
// indexOf,返回一個字元在字串中首次出現的位置,
// lastIndexOf返回一個字元在字串中最後一次出現的位置。
//4.slice(index,endIndex) --->endl:截至位置下標
const str = 'abcdefg'
console.log(str.slice()) // 'abcdefg'
console.log(str.slice(1)) // 'bcdefg'
console.log(str.slice(2, str.length-1)) // 'cdef'
//5.split()
const str = 'A*B*C*D*E*F*G'
console.log(str.split('*')) // ["A", "B", "C", "D", "E", "F", "G"]
const str1 = 'ABC*DEF*G'
console.log(str1.split('*')) // ['ABC', 'DEF', 'G']
// 使用指定的分隔符將一個字串拆分為多個子字串陣列並返回,原字串不變。
//6.substr(index)-->從index開始,後面都砍掉
//6.substr(index, length)-->從index開始,長度為length刪掉
const str = 'ABCDEFGHIJKLMN'
console.log(str.substr(2)) // 'CDEFGHIJKLMN'
console.log(str.substr(2, 9)) //'CDEFGHIJK'
// substr的引數二如果為0或者負數,則返回一個空字串,如果未填入,則會擷取到字串的結尾去。substring的引數一和引數二為NAN或者負數,那麼它將被替換為0。
//7.substring(index,newIndex)-->從index開始,newIndex截至【不包括newIndex】
//7.substring(index)-->從index開始,後面都砍掉
const str = 'ABCDEFGHIJKLMN'
console.log(str.substring(2)) //'CDEFGHIJKLMN'
console.log(str.substring(2, 9)) //'CDEFGHI'
//8.match()
const str = '2018年結束了,2019年開始了'
const reg = /\d+/g // 這裡是定義匹配規則,匹配字串裡的1到多個數字
// /\d+/g 是一個全域性正規表示式,\d 匹配任何數字(等價於 [0-9]),+ 表示匹配一次或多次。g 標誌代表全域性匹配
console.log(str.match(reg)) // 輸出符合匹配規則的內容,以陣列形式返回 ['2018', '2019']
console.log(str.match('年')) // 不使用正則 ["20", index: 4, input: "2018年結束了,2019年開始了"]
console.log(str.match('20')) // 不使用正則 ["20", index: 0, input: "2018年結束了,2019年開始了"]
// 當你傳遞一個字串(而不是正規表示式)給 match() 方法時,它會返回第一個與該字串匹配的子串的資訊。返回值是一個陣列,其中第一個元素是匹配的子串,index 屬性是匹配子串在原字串中的位置,input 屬性是原字串本身。
//9.search(number)
const str = '2018年結束了,2019年開始了,2020年就也不遠了'
const reg = /\d+/i // 這裡是定義匹配規則,匹配字串裡的1到多個數字
console.log(str.search(reg)) // 輸出 0 這裡搜尋到的第一項是從位置0開始的
//10.toLowerCase(變數名) -->全轉小寫
//10.toUpperCase(變數名) -->全轉大寫
const str1 = 'A!cd1fg'
const str2 = 'aBCDEFG'
console.log(str2.toLowerCase()) // 'abcdefg'
console.log(str1.toUpperCase()) // 'A!CD1FG'
// 數字,特殊符號不變
// 11.includes('X')
// 11.startsWith('X')
// 11.endsWith('X')
const str = 'Excuse me, how do I get to park road?'
console.log(str.includes('how')) // true
console.log(str.startsWith('Excuse')) // true
console.log(str.endsWith('?')) // true
//包含X? 以X為開頭? 以X為結尾?
//12.repear(times)
const str = 'http'
const str2 = str.repeat(3)
console.log(str) // 輸出:'http'
console.log(str2) // 輸出:'httphttphttp'
//重複次數
//13.replace()
const str = '2018年結束了,2019年開始了,2020年就也不遠了'
const rex = /\d+/g
const str1 = str.replace(rex, '****')
console.log(str1) // "****年結束了,****年開始了,****年也不遠了"
const str2 = str.replace(rex, function(item){
console.log(arguments)
const arr = ['零', '壹', '貳', '叄', '肆', '伍', '陸', '柒', '捌', '玖']
let newStr = ''
item.split('').map(function(i){
newStr += arr[i]
})
return newStr
})
console.log(str2) //貳零壹捌年結束了,貳零壹玖年開始了,貳零貳零年也不遠了