目錄
1.Date對(duì)象
1.1日期對(duì)象的概念
1.2Date()方法的使用
?1.3Date()常用方法匯總
1.4例題：用函數(shù)編寫一個(gè)倒計(jì)時(shí)
2.函數(shù)
2.1函數(shù)的概念
2.2函數(shù)的使用
2.3函數(shù)的參數(shù)
2.4函數(shù)的聲明?
?2.5函數(shù)的返回值
2.6異步函數(shù)
3特殊函數(shù)類型
3.1匿名函數(shù)
3.2箭頭函數(shù)?
3.3?函數(shù)形參和實(shí)參個(gè)數(shù)不匹配問題
3.4break ,continue ,return 的區(qū)別
1.Date對(duì)象
1.1日期對(duì)象的概念
- Date對(duì)象和Math對(duì)象不一樣，他是一個(gè)構(gòu)造函數(shù)，所以我們需要實(shí)例化后才能使用
- Date實(shí)例用來(lái)處理日期和時(shí)間。
1.2Date()方法的使用
? ? ? ?格式：let now = new Date();
? ? ? ? ? ? ? ? ? console.log(now);
- 當(dāng)Date()沒有參數(shù)時(shí)，默認(rèn)返回當(dāng)前的時(shí)間。
- 當(dāng)Date()里面寫參數(shù)時(shí)，就返回括號(hào)內(nèi)輸入的時(shí)間，此處的參數(shù)可以有多種格式，? eg:'2024-1-11 12:00:00'???'2024 1 11 12:00:00'? ? '2024/1/11 12:00:00'
?1.3Date()常用方法匯總
1.4例題：用函數(shù)編寫一個(gè)倒計(jì)時(shí)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
#div {
width: 800px;
height: 100px;
margin: 200px auto;
background-color: black;
color: #fff;
font-size: 30px;
text-align: center;
line-height: 100px;
border-radius: 20px;
}
</style>
</head>
<body>
<div id="div"> </div>
<script>
function countdown() {
var targetDate = new Date("2024-01-15 12:00:00");
var currentDate = new Date();
var timeDiff = targetDate.getTime() - currentDate.getTime();
var days = Math.floor(timeDiff / (1000 * 60 * 60 * 24));
var hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((timeDiff % (1000 * 60)) / 1000);
let time = `距離2024-01-15 12:00:00還有：${days}天${ hours}時(shí)${minutes}分${seconds}秒 `;
document.querySelector('#div').innerHTML = time;
}
countdown()
setInterval(function () {
countdown()
}, 1000);
</script>
</body>
</html>效果：
?
2.函數(shù)
2.1函數(shù)的概念
? ? ? ? 函數(shù)就是封裝了一段可被重復(fù)調(diào)用執(zhí)行的代碼塊。通過此代碼塊可以實(shí)現(xiàn)大量代碼的重復(fù)使用。函數(shù)對(duì)任何語(yǔ)言來(lái)說都是一個(gè)核心的概念，通過函數(shù)可以封裝任意多條語(yǔ)句，而且可以在任何地方，任何時(shí)候調(diào)用執(zhí)行。
2.2函數(shù)的使用
（1）聲明函數(shù)：? ??function 函數(shù)名（）{
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?代碼塊
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?}
（2）調(diào)用函數(shù)：??函數(shù)名（）
? 可以多次對(duì)函數(shù)進(jìn)行調(diào)用，調(diào)用位置不限，前調(diào)和后調(diào)都可以。
2.3函數(shù)的參數(shù)
（1）形參：聲明函數(shù)的參數(shù)叫形參，是局部變量，在函數(shù)之外是不起作用的（形參的個(gè)數(shù)和類型沒有限制，多個(gè)參數(shù)之間以逗號(hào)隔開）
（2）實(shí)參： ? 調(diào)用函數(shù)時(shí)傳的參數(shù)叫做實(shí)參
（3）補(bǔ)充：?
- ?在JavaScript中，形參的默認(rèn)值是undefined。
- 函數(shù)分為三種：有參、無(wú)參和帶返回值。
- 函數(shù)可以帶參數(shù)，也可以不帶參數(shù)，不帶參數(shù)的函數(shù)叫做無(wú)參函數(shù)。
2.4函數(shù)的聲明?
- ?可以包含數(shù)字 字母 ?_ ? $
- ?不能以數(shù)字開頭
- ? 區(qū)分大小寫
- ? 推薦用駝峰命名法，或者下劃線命名法 eg:stuName ?StuName
- ? 見名知意，實(shí)在不知道怎么表達(dá)時(shí)可以用demo
- ? 不能使用關(guān)鍵字和保留字
- ? ?盡量使用動(dòng)詞
?2.5函數(shù)的返回值
函數(shù)都是有返回值的，如果有return 則返回 return 后面的值，如果沒有return 則返回 undefined。
return有兩個(gè)作用：文章來(lái)源：http://www.zghlxwxcb.cn/news/detail-786182.html
- ? 返回表達(dá)式的結(jié)果。
- ? 結(jié)束函數(shù)（如果函數(shù)里面嵌套了循環(huán)，那循環(huán)也會(huì)跟著一塊結(jié)束）
- ? 函數(shù)中有retrun表達(dá)式，函數(shù)調(diào)用時(shí)才可以用變量接受，或直接輸入函數(shù)調(diào)用。
2.6異步函數(shù)
函數(shù)可以調(diào)用另外一個(gè)函數(shù)，因?yàn)槊總€(gè)函數(shù)都是獨(dú)立的代碼塊，用于完成特殊任務(wù)，因此經(jīng)常會(huì)用到函數(shù)相互調(diào)用的情況。文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-786182.html
function fn1() {
console.log(111);
fn2();
console.log('fn1');
}
function fn2() {
console.log(222);
console.log('fn2');
}
fn1();3特殊函數(shù)類型
3.1匿名函數(shù)
// 這是函數(shù)表達(dá)式寫法，匿名函數(shù)后面跟分號(hào)結(jié)束
var fn = function(){...};
// 調(diào)用的方式，函數(shù)調(diào)用必須寫到函數(shù)體下面
fn();- 因?yàn)楹瘮?shù)沒有名字，所以也被稱為匿名函數(shù)
- 這個(gè)fn 里面存儲(chǔ)的是一個(gè)函數(shù)
- 函數(shù)表達(dá)式方式原理跟聲明變量方式是一致的
- 函數(shù)調(diào)用的代碼必須寫到函數(shù)體后面，必須先聲明，后調(diào)用
- 和普通函數(shù)一樣分為有參、無(wú)參和帶返回值。
3.2箭頭函數(shù)?
let show=()=>{
// 函數(shù)體
console.log('111');
}- ?() 如果括號(hào)里面的參數(shù)只有一個(gè)的話，括號(hào)可以省略。
- ?{} 花括號(hào)中只有一句代碼的時(shí)候，花括號(hào)可以省略
- ? 如果花括號(hào)中是一句返回值，return也必須省略。
3.3?函數(shù)形參和實(shí)參個(gè)數(shù)不匹配問題
| 參數(shù)個(gè)數(shù) | 說明 |
| 實(shí)參個(gè)數(shù)等于形參個(gè)數(shù) | 輸出正確結(jié)果 |
| 實(shí)參個(gè)數(shù)多與形參個(gè)數(shù) | 只取到形參的個(gè)數(shù) |
| 實(shí)參個(gè)數(shù)小于形參個(gè)數(shù) | 多的形參定義為undefined,結(jié)果為NaN |
3.4break ,continue ,return 的區(qū)別
- break ：結(jié)束當(dāng)前的循環(huán)體（如 for、while）
- continue ：跳出本次循環(huán)，繼續(xù)執(zhí)行下次循環(huán)（如 for、while）
- return ：不僅可以退出循環(huán)，還能夠返回 return 語(yǔ)句中的值，同時(shí)還可以結(jié)束當(dāng)前的函數(shù)體內(nèi)的代碼
到了這里，關(guān)于web學(xué)習(xí)筆記（十五）的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
