(創(chuàng)作不易，感謝有你，你的支持，就是我前行的最大動(dòng)力，如果看完對(duì)你有幫助，請(qǐng)留下您的足跡）
目錄
1、循環(huán)-for
1.?for 循環(huán)-基本使用
1. for循環(huán)語法
2. 退出循環(huán)?
2. for 循環(huán)嵌套?
2、數(shù)組?
1 數(shù)組是什么
2 數(shù)組的基本使用?
1. 聲明語法
2. 取值語法?
3. 一些術(shù)語：?
4. 遍歷數(shù)組(重點(diǎn))：?
3 操作數(shù)組
操作數(shù)組-新增?
arr.push()
arr.unshift
操作數(shù)組-刪除
arr. pop()
數(shù)組. shift()
數(shù)組. splice()
1、循環(huán)-for
1.?for 循環(huán)-基本使用
1. for循環(huán)語法
作用：重復(fù)執(zhí)行代碼
好處：把聲明起始值、循環(huán)條件、變化值寫到一起，讓人一目了然 ， 它是最常使用的循環(huán)形式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
for(let i = 1;i<=3;i++)
{
document.write('加油<br>')
}
</script>
</body>
</html>網(wǎng)頁顯示為：? ? ? ? ? ? ? ? ? ? ??
2. 退出循環(huán)?
continue 退出本次循環(huán)，一般用于排除或者跳過某一個(gè)選項(xiàng)的時(shí)候, 可以使用continue
break 退出整個(gè)for循環(huán)，一般用于結(jié)果已經(jīng)得到, 后續(xù)的循環(huán)不需要的時(shí)候可以使用了解：
1. while(true) 來構(gòu)造“無限”循環(huán)，需要使用break退出循環(huán)。
2. for(;;) 也可以來構(gòu)造“無限”循環(huán)，同樣需要使用break退出循環(huán)。
2. for 循環(huán)嵌套?
?一個(gè)循環(huán)里再套一個(gè)循環(huán)，一般用在for循環(huán)里
<!-- 九九乘法表 -->
<!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>
span
{
display: inline-block;
width: 100px;
padding: 5px 10px;
border: 1px solid pink;
margin: 2px;
/* 圓角 */
border-radius: 5px;
/* 陰影 */
box-shadow: 2px 2px 2px rgba(255, 192, 203, .4);
background-color: rgba(255, 192, 203, .1);
text-align: center;
}
</style>
</head>
<body>
<script>
for(let i=1;i<=9;i++)
{
for(let j =1;j<=i;j++)
{
document.write(`<span>${j}X${i}=${i*j}</span>`)
}
document.write('<br>')
}
</script>
</body>
</html>網(wǎng)頁顯示為：
2、數(shù)組?
1 數(shù)組是什么
數(shù)組：(Array)是一種可以按順序保存數(shù)據(jù)的數(shù)據(jù)類型
2 數(shù)組的基本使用?
1. 聲明語法
數(shù)組是按順序保存，所以每個(gè)數(shù)據(jù)都有自己的編號(hào)
計(jì)算機(jī)中的編號(hào)從0開始，所以小明的編號(hào)為0，小剛編號(hào)為1，以此類推
在數(shù)組中，數(shù)據(jù)的編號(hào)也叫索引或下標(biāo)
數(shù)組可以存儲(chǔ)任意類型的數(shù)據(jù)?
2. 取值語法?
通過下標(biāo)取數(shù)據(jù)
取出來是什么類型的，就根據(jù)這種類型特點(diǎn)來訪問?
3. 一些術(shù)語：?
元素：數(shù)組中保存的每個(gè)數(shù)據(jù)都叫數(shù)組元素
下標(biāo)：數(shù)組中數(shù)據(jù)的編號(hào)
長度：數(shù)組中數(shù)據(jù)的個(gè)數(shù)，通過數(shù)組的length屬性獲得
4. 遍歷數(shù)組(重點(diǎn))：?
用循環(huán)把數(shù)組中每個(gè)元素都訪問到,一般會(huì)用for循環(huán)遍歷
<!-- 需求：求數(shù)組 [2,6,1,7, 4] 里面所有元素的和以及平均值
分析：
①：聲明一個(gè)求和變量 sum。
②：遍歷這個(gè)數(shù)組，把里面每個(gè)數(shù)組元素加到 sum 里面。
③：用求和變量 sum 除以數(shù)組的長度就可以得到數(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>
</head>
<body>
<script>
let arr=[2,6,1,7,4]
let sum = 0
for(let i = 0;i<arr.length;i++)
{
sum += arr[i]
}
document.write(`數(shù)組的和為${sum}<br>`)
document.write(`數(shù)組的平均值為${sum/arr.length}`)
</script>
</body>
</html>網(wǎng)頁顯示為：? ? ? ? ? ? ? ? ? ? ? ??
3 操作數(shù)組
數(shù)組本質(zhì)是數(shù)據(jù)集合, 操作數(shù)據(jù)無非就是 增 刪 改 查 語法：
操作數(shù)組-新增?
arr.push()
將一個(gè)或多個(gè)元素添加到數(shù)組的末尾，并返回該數(shù)組的新長度 (重點(diǎn))
arr.unshift
將一個(gè)或多個(gè)元素添加到數(shù)組的 開頭，并返回該數(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>
</head>
<body>
<script>
let arr=['123','456']
//新增
document.write(arr.push('789'))
document.write('<br>')
document.write(arr)
</script>
</body>
</html>網(wǎng)頁顯示為：??? ? ? ? ? ? ? ? ??
?
操作數(shù)組-刪除
arr. pop()
從數(shù)組中刪除最后一個(gè)元素，并返回該元素的值
語法：
例如：
數(shù)組. shift()
從數(shù)組中刪除第一個(gè)元素，并返回該元素的值?
語法：
例如：?
數(shù)組. splice()
刪除指定元素
語法：
文章來源：http://www.zghlxwxcb.cn/news/detail-511062.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
let arr=[1,2,3,4,5,6,7]
//刪除2
arr.splice(1,1)
document.write(arr)
</script>
</body>
</html>網(wǎng)頁顯示為：? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?
文章來源地址http://www.zghlxwxcb.cn/news/detail-511062.html
到了這里，關(guān)于前端JavaScript入門-day03的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
