javascript
JavaScript基础07-day09【嵌套for循环、break和continue、对象、数据类型、对象字面量、函数】
學習地址：
JavaScript基礎、高級學習筆記匯總表【尚硅谷最新版JavaScript基礎全套教程完整版(140集實戰教學,JS從入門到精通)】
目? ?錄
P41?41.尚硅谷_JS基礎_嵌套的for循環?18:50
P42?42.尚硅谷_JS基礎_練習?05:47
P43?43.尚硅谷_JS基礎_for循環練習?18:37
嵌套循環練習1：打印九九乘法表
嵌套循環練習2：打印出1-100之間所有的質數
P44?44.尚硅谷_JS基礎_break和continue?28:00
break關鍵字
label: 循環語句
continue關鍵字
計時器：console.time()、console.timeEnd()
P45?45.尚硅谷_JS基礎_質數練習的改進?08:38
P46?46.尚硅谷_JS基礎_對象的簡介?11:51
P47?47.尚硅谷_JS基礎_對象的基本操作?13:10
1、創建空對象【var obj = new Object(); // 構造方法】
2、向對象添加屬性【語法：對象.屬性名 = 屬性值;】
3、讀取對象中的屬性【語法：對象.屬性名】
4、修改對象的屬性值【語法：對象.屬性名 = 新值;】
5、刪除對象的屬性【語法：delete 對象.屬性名;】
P48?48.尚硅谷_JS基礎_屬性名和屬性值?16:34
屬性名
向對象中添加屬性
特殊的屬性名【語法：對象["屬性名"] = 屬性值】
屬性值
in 運算符：檢查一個對象中是否含有指定的屬性。
P49?49.尚硅谷_JS基礎_基本數據類型和引用數據類型?26:38
P50?50.尚硅谷_JS基礎_對象字面量?08:20
P51?51.尚硅谷_JS基礎_函數的簡介?23:02
函數簡介
給函數添加屬性
函數創建方式1：字符串封裝代碼創建函數
函數創建方式2：函數聲明
函數創建方式3：函數表達式
P52?52.尚硅谷_JS基礎_函數的參數?11:35
P41?41.尚硅谷_JS基礎_嵌套的for循環?18:50
/*
?? ?通過程序，在頁面中輸出如下的圖形：
?? ?* ? ? ?1 ? <1 ? i=0
?? ?** ? ? 2 ? <2 ? i=1
?? ?*** ? ?3 ? <3 ? i=2
?? ?**** ? 4 ? <4 ? i=3
?? ?***** ?5 ? <5 ? i=4
?? ?
?? ?*****
?? ?*****
?? ?*****
?? ?*****
?? ?*****
?? ?
?? ?***** 1 ? j<5(5-0) ?i=0
?? ?**** ?2?? ? ?j<4(5-1) ?i=1
?? ?*** ? 3 ? j<3(5-2) ?i=2
?? ?** ? ?4 ? j<2(5-3) ?i=3
?? ?* ? ? 5 ? j<1(5-4) ?i=4
?*/
P42?42.尚硅谷_JS基礎_練習?05:47
P43?43.尚硅谷_JS基礎_for循環練習?18:37
嵌套循環練習1：打印九九乘法表
?* 1.打印99乘法表
?* ?? ? 1*1=1
?* ?? ? 1*2=2 2*2=4
?* ?? ? 1*3=3 2*3=6 3*3=9
?* ?? ? 1*4=4 2*4=8 3*4=12 4*4=16?? ?
?* ?? ??? ??? ??? ??? ??? ?....9*9=81
<span></span>用來對齊元素。
<!DOCTYPE html> <html><head><meta charset="UTF-8"><title></title><script type="text/javascript">for (var i = 1; i <= 9; i++) { //創建外層循環，用來控制乘法表的高度for (var j = 1; j <= i; j++) { //創建一個內層循環來控制圖形的寬度document.write("<span>" + j + "*" + i + "=" + i * j + "</span>");}document.write("<br />"); //輸出一個換行}</script><style type="text/css">body {width: 2000px;background-color: #87CEEB;}span {display: inline-block; /*轉為行內元素*/width: 80px; /*span是塊元素*/background-color: #FCD410;}</style></head><body></body> </html>嵌套循環練習2：打印出1-100之間所有的質數
<!DOCTYPE html> <html><head><meta charset="UTF-8"><title></title><script type="text/javascript">//打印2-100之間所有的數for (var i = 2; i <= 100; i++) {//創建一個布爾值，用來保存結果，默認i是質數var flag = true;//判斷i是否是質數//獲取到2-i之間的所有的數for (var j = 2; j < i; j++) {//判斷i是否能被j整除if (i % j == 0) {//如果進入判斷則證明i不是質數,修改flag值為falseflag = false;}}//如果是質數，則打印i的值if (flag) {console.log(i);}}</script></head><body></body> </html>P44?44.尚硅谷_JS基礎_break和continue?28:00
break關鍵字
break關鍵字，可以用來退出switch或循環語句，不能在if語句中使用break和continue。
break關鍵字，會立即終止離它最近的那個循環語句。
label: 循環語句
可以為循環語句創建一個label，來標識當前的循環。
label: 循環語句
使用break語句時，可以在break后跟著一個label，這樣break將會結束指定的循環，而不是最近的。
??
continue關鍵字
continue關鍵字可以用來跳過當次循環，同樣continue也是默認只會對離它最近的循環循環起作用。
?
計時器：console.time()、console.timeEnd()
P45?45.尚硅谷_JS基礎_質數練習的改進?08:38
19 / 2 = 9.5，10之后的數字與誰乘都不可能得19了，9.5之后的值沒必要再去檢查。
除了2，所有的質數都是奇數。質數：prime number。
<!DOCTYPE html> <html><head><meta charset="UTF-8"><title></title><script type="text/javascript">//測試如下的程序的性能//在程序執行前，開啟計時器//console.time("計時器的名字") // 可以用來開啟一個計時器//它需要一個字符串作為參數，這個字符串將會作為計時器的標識console.time("test");//打印2-100之間所有的數for (var i = 2; i <= 100000; i++) {var flag = true;for (var j = 2; j <= Math.sqrt(i); j++) {if (i % j == 0) {//如果進入判斷則證明i不是質數,修改flag值為falseflag = false;//一旦進入判斷，則證明i不可能是質數了，此時循環再執行已經沒有任何意義了//使用break來結束循環break;//不加break 215ms//加break 25ms//修改j<=后 2.6}}//如果是質數，則打印i的值if (flag) {//console.log(i);}}//終止計時器//console.timeEnd()用來停止一個計時器，需要一個計時器的名字作為參數console.timeEnd("test");/** 36* 1 36* 2 18* 3 12* 4 9* 6 6*///可以通過Math.sqrt()對一個數進行開方var result = Math.sqrt(97);console.log("result = " + result)</script></head><body></body> </html>P46?46.尚硅谷_JS基礎_對象的簡介?11:51
JavaScript中的數據類型（6種）：
1、String 字符串
2、Number 數值
3、Boolean 布爾值
4、Null 空值
5、Undefined 未定義
? ?- 以上這五種類型屬于基本數據類型，以后我們看到的值，只要不是上邊的5種，全都是對象。
6、Object 對象（引用數據類型）
基本數據類型都是單一的值"hello"、123、true，值和值之間沒有任何的聯系。
在JS中來表示一個人的信息（name gender age）：
?* ?? ?var name = "孫悟空";
?* ?? ?var gender = "男";
?* ?? ?var age = 18;
如果使用基本數據類型的數據，我們所創建的變量都是獨立，不能成為一個整體。
對象屬于一種復合的數據類型，在對象中可以保存多個不同數據類型的屬性。
對象的分類：
P47?47.尚硅谷_JS基礎_對象的基本操作?13:10
1、創建空對象【var obj = new Object(); // 構造方法】
??
2、向對象添加屬性【語法：對象.屬性名 = 屬性值;】
?
3、讀取對象中的屬性【語法：對象.屬性名】
4、修改對象的屬性值【語法：對象.屬性名 = 新值;】
5、刪除對象的屬性【語法：delete 對象.屬性名;】
P48?48.尚硅谷_JS基礎_屬性名和屬性值?16:34
屬性名
向對象中添加屬性
屬性名：對象的屬性名不強制要求遵守標識符的規范，什么亂七八糟的名字都可以使用，但是我們使用是還是盡量按照標識符的規范去做。
特殊的屬性名【語法：對象["屬性名"] = 屬性值】
如果要使用特殊的屬性名，不能采用.的方式來操作，需要使用另一種方式：語法：對象["屬性名"] = 屬性值。
讀取時也需要采用這種方式，使用[]這種形式去操作屬性，更加的靈活，在[]中可以直接傳遞一個變量，這樣變量值是多少就會讀取那個屬性。
??
屬性值
屬性值：JS對象的屬性值，可以是任意的數據類型，甚至也可以是一個對象。
in 運算符：檢查一個對象中是否含有指定的屬性。
in運算符：通過該運算符可以檢查一個對象中是否含有指定的屬性，如果有則返回true，沒有則返回false。
語法："屬性名" in 對象
P49?49.尚硅谷_JS基礎_基本數據類型和引用數據類型?26:38
- 基本數據類型：String Number Boolean Null Undefined
- 引用數據類型：Object
- JS中的變量都是保存到棧內存中的，基本數據類型的值直接在棧內存中存儲，值與值之間是獨立存在，修改一個變量不會影響其他的變量。
- 對象是保存到堆內存中的，每創建一個新的對象，就會在堆內存中開辟出一個新的空間，而變量保存的是對象的內存地址（對象的引用），如果兩個變量保存的是同一個對象引用，當一個通過一個變量修改屬性時，另一個也會受到影響。
?值與值獨立！
??
- 當比較兩個基本數據類型的值時，就是比較值。
- 而比較兩個引用數據類型時，它是比較的對象的內存地址，如果兩個對象是一摸一樣的，但是地址不同，它也會返回false。
??
P50?50.尚硅谷_JS基礎_對象字面量?08:20
使用對象字面量，可以在創建對象時，直接指定對象中的屬性，語法：{屬性名:屬性值,屬性名:屬性值....}。
對象字面量的屬性名可以加引號也可以不加，建議不加，如果要使用一些特殊的名字，則必須加引號。
屬性名和屬性值是一組一組的名值對結構，名和值之間使用“:”連接，多個名值對之間使用“,”隔開，如果一個屬性之后沒有其他的屬性了，就不要寫“,”。
??
P51?51.尚硅谷_JS基礎_函數的簡介?23:02
函數簡介
函數 function：
??
給函數添加屬性
函數創建方式1：字符串封裝代碼創建函數
函數創建方式2：函數聲明
使用 函數聲明 來創建一個函數：
語法：
function 函數名([形參1, 形參2...形參N]) { // []表示“可選”
? ?語句...
}
與構造函數方式一樣，函數聲明的方式更清楚。聲明函數，末尾不用寫“;”。
函數創建方式3：函數表達式
使用 函數表達式 來創建一個函數：創建一個匿名函數，將此匿名函數賦值給一個變量（賦值語句，最好在末尾寫“;”）。
var 函數名 ?= function([形參1,形參2...形參N]) {
? ?語句....
}
P52?52.尚硅谷_JS基礎_函數的參數?11:35
定義一個用來求兩個數和的函數。
可以在函數的()中來指定一個或多個形參（形式參數），多個形參之間使用,隔開，聲明形參就相當于在函數內部聲明了對應的變量，但是并不賦值。
總結
以上是生活随笔為你收集整理的JavaScript基础07-day09【嵌套for循环、break和continue、对象、数据类型、对象字面量、函数】的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： JavaScript基础06-day08
- 下一篇： JavaScript基础08-day10