NCC-JavaScript-Week#3

+BWB4DSJQU 8FFL !〵猰㣐玑䒭鏤鎙灇瑖爢 #Z*SFOF$IBOH 㛇燊铃岁✳

‣ 醳绢㛇燊铃岁✳։♲ ‣ 箻绢♲GPS JGFMTF ˋ ‣ 㛇燊铃岁♲ Ը 崩玑䱾ⵖ鶬㕖XIJMF
‣ 箻绢㔋XIJMF GPS ‣ 䮋䨞겗 ˋ ‣ 㛇燊铃岁㔋 Ը ⴅ䒭GVODUJPO ˋ ‣ 㛇燊铃岁❀ Ը 须俲㘗ⴽ暟⟝ "HFOEB

醳绢㛇燊铃岁✳։♲ 须俲㘗䢀ꤏ⴪ 崩玑䱾ⵖ哭⟝䒭JGFMTF FMTFJG 崩玑䱾ⵖ鶬㕖GPS

ꤏ⴪ "SSBZ

‣ 䖎㢵匌銯佞㖈♧饱꧌⚥盘椚 ꤏ⴪"SSBZ 1 var names = ["JS","Python","Scratch"]; 2 var
number = [1, 3.14, 7749, 0.001]; 3 var mixed = [1, "Irene", 2015, "Hi"]; 4 var empty = [];

1 var mixed = ["JS",123,"Scratch"]; 2 console.log(mixed[0] == "JS"); //
true 3 console.log(mixed[1]); // 123 ꤏ⴪"SSBZ ‣ 嫦♧갪鿪剤♧⦐管贫*OEFY ‣ 管贫䖰Ꟛ㨥CBTFEJOEFYJOH ‣ 㶶⚮⛳剤JOEFY涸嚌䙂

1 var doubleArray =[[1,2],["a","b"]]; 2 console.log(doubleArray[0]);// [1,2] 3 console.log(doubleArray[1][1]); //
"b" ꧱㾵ꤏ⴪UXPEJNFOTJPOBMBSSBZ ꤏ⴪"SSBZ 4 console.log(doubleArray[1][2]); // undefined

1 var fruits =[1, 3, 2, "Orange", "Apple"]; 2 fruits.sort();
//按照數字⼤大⼩小、字⺟母順序排列 3 fruits.reverse(); //按照數字⼤大⼩小、字⺟母倒序排列 4PSUJOH3FWFSTJOH ꤏ⴪"SSBZ

1 var fruits =["Mango", "Orange", "Apple"]; 2 fruits.shift(); //刪除第⼀一項 "Mango"
3 fruits.pop(); //刪除最後⼀一項 “Apple" 4 console.log(fruits); // ["Orange"] 4IJGUJOH1PQQJOH ꤏ⴪"SSBZ

1 var fruits =["Orange", "Apple"]; 2 fruits.unshift("Kiwi"); //在第⼀一項加⼊入"Kiwi" 3 fruits.push("Lemon");
//在最後⼀一項加⼊入”Lemon" 4 console.log(fruits); 5 // ["Kiwi","Orange","Apple","Lemon"] 6OTIJGUJOH1VTIJOH ꤏ⴪"SSBZ

崩玑䱾ⵖ哭⟝䒭 JGFMTF FMTFJG

JG FMTF 1 if(condition) 2 { 3 //若符合條件，就執⾏行這段{}裡⾯面的程式碼 4 }
5 else{ 6 //不符合條件，就執⾏行這段{}裡⾯面的程式碼 7 }

JG FMTFJG FMTF 1 if(condition) 2 { 3 //若符合條件，就執⾏行這段{}裡⾯面的程式碼 4
} 5 else if(condition) 6 { 7 /*不符合上⼀一個條件但符合這⼀一個條件， 8 就執⾏行這段{}裡⾯面的程式碼*/ 9 } 10 else{ 11 //其他條件都不符合，就執⾏行這段{}裡⾯面的程式碼 12 }

崩玑䱾ⵖ鶬㕖 -PPQ

갸⯓鏤㹁䱾ⵖ隶侸剤佪哭⟝ 锅侮䱾ⵖ隶侸⧩ 鶬㕖-PPQ 鶬㕖♲㣐哭⟝

GPS 鏤㹁♧⟝✲䞕銴ꅾ醳⨞䎙妄 1 for(var i = start; i < end;
i++){ 2 // 做條件成⽴立的事 3 }

箻绢♲GPS JGFMTF " 宠㔔侸 # 宠Ⰽ侸剓㣐Ⱇ㔔侸 $ 'J[[#V[[

" 宠㔔侸 1. 請使⽤用者輸⼊入任意數字 2. 使⽤用 for 和 if 判斷該數字的因數 
hint: % 取餘數＝0 3. 輸出該數字之因數（包含1與本⾝身） IUUQTKTCJODPNYJEPIJFEJU KT DPOTPMF

# 宠Ⰽ侸剓㣐Ⱇ㔔侸 1. 請使⽤用者輸⼊入兩個數字，以空⽩白隔開 2. 轉換型態、建⽴立空 array 3. 使⽤用 for
和 if 判斷兩數最⼤大公因數  hint: Math.max(), .push() IUUQTKTCJODPN[FCJWJFEJU KT DPOTPMF

$ 'J[[#V[[ 1. 輸出 1 到 100 2. 如果是 3
的倍數就輸出 Fizz 3. 如果是 5 的倍數就輸出 Buzz 4. 如果同時是 3 和 5 的倍數就輸出 FizzBuzz  hint:雙層迴圈 IUUQTKTCJODPNXPLVTJFEJU KT DPOTPMF

䮋䨞겗 " 鱒ⴀ_涸颶侸 # _涸颶侸鱒ⴀ痧_갪

1 for (var ; ; ) { 2 var isPrime
= true; 3 for(var ; ; ) { 4 if ( === ) { 5 isPrime = ; 6 break; 7 } 8 } 9 if ( ) { 10 console.log( ); 11 } 12 } 鱒ⴀ_涸颶侸

䒊用♧⦐ꤏ⴪ 佞Ⰵ_涸颶侸鱒ⴀ痧_갪 1 var prime =[]; 2 for( ;
; ){ 3 for( ; ; ){ 4 if( ){ 5 break; 6 } 7 else{ 8 prime. ( ); 9 break; 10 } 11 } 12 } 13 14 for( ; ; ){ 15 console.log( ); 16 }

㛇燊铃岁♲ Ը 崩玑䱾ⵖ鶬㕖XIJMF

XIJMF 殹⡹♶濼麥鑪㛂遤䎙妄

XIJMF ♶倬ꅾ醳㛂遤♧⟝✲ 湬ⵌ痘ざ厥⦐哭⟝䩞⨢姺 1 while(condition){ 2 // 做條件成⽴立的事 3 }

锞⢪欽罏鱒Ⰵ♧⦐侸㶶OVN ⢪欽XIJMF鱒ⴀ։OVN 1 var num = prompt("輸⼊入數字"); 2 var i
= 0; 3 while(i < num){ 4 i++; 5 console.log(i); 6 } XIJMF

㼭鑑魨䩛雊䧮⦛⢵梖枤侸㶶涸麉䨡 锞⢪欽罏鱒Ⰵ♧⦐➝倴_涸侸㶶デ鏰⢪欽罏枤㼩✫㣖㣐䧴㣖㼭 ⿾銼鑉㉏湬ⵌ⢪欽罏枤㼩瘸呪

• 如果迴圈處理的條件從來都沒有符合過，就永遠不會執⾏行迴圈。 • 如果⼀一直符合測試條件，便會造成無限迴圈。鶬㕖-PPQ 岤䠑

箻绢♲XIJMF GPS " 宠ꥣ⛨籏ㄤ

" 宠ꥣ⛨籏ㄤ 1. 請使⽤用者輸⼊入任意數字 2. 使⽤用 while 計算階乘 3. 使⽤用
for 計算總和 IUUQTKTCJODPNNBRBKJFEJU KT DPOTPMF

㛇燊铃岁㔋 ⴅ䒭GVODUJPO

ⴅ䒭 'VODUJPO ➊랃〳⟃く㌨

㽠⫹掑跗票♧垺矦㋲

‣ ♶ず涸굺勞JOQVUT ‣ 湱ず涸捸掑倰䒭ㄤ麕玑GVODUJPO ‣ ♶ず涸跗票PVUQVUT ⡹♶剚䟝嫦妄掑跗票鿪銴䪾麕玑ⱄ㻨♧麒

1 function fnName(x, y) { 2 // Do something 3
}; Ⱘそⴅ侸 1 var fnName = function(x, y) { 2 // Do something 3 }; ⼣そⴅ侸 ⴅ䒭GVODUJPO

1 function add(x, y) { 2 var total = x
+ y; 3 console.log(total); 4 }; 5 6 add(3,4); // 輸出7 ㄎ〭 ⴅ䒭GVODUJPO

1 function add(x, y) { 2 var total = x
+ y; 3 return total ; // 回傳運算後的值 4 }; 5 add(3,4); // 直接呼叫沒有意義 6 var result = add(3,4); // 把值存起來 7 console.log(result * 10); // 輸出70 鸒䌢䧮⦛꨾銴GVODUJPO㔐⫄㛂遤䖕涸穡卓⢵⨞Ⱖ➮✲ ⴅ䒭GVODUJPO

岤䠑 ⴅ䒭麂ⵌSFUVSO湱殹倴用⽰⨢姺䖕꬗涸玑䒭  䨾⟃䧮⦛鸒䌢䪾SFUVSO佞㖈剓䖕罜⚂〫剤♧⦐ 䵩ꂂ崩玑䱾ⵖJGFMTF㽠〳⟃剤㥪䎙⦐SFUVSO 㥶卓ⴅ䒭尝剤鏤㹁SFUVSO㸐剚㔐⫄VOEFOFE

1 function square(num) { 2 var result = num *
num; 3 return result ; // 回傳運算後的值 4 }; 5 console.log(square(10)); // 輸出100 ⿮侸〳⟃⟤䠑ㄐそ⡎僽ⴽ䒚ⵌ鸮荈䊹鿪溏♶䥢 ⴅ䒭GVODUJPO

1 function countNumber() { 2 for(var i = 0; i
<= 100; i++){ 3 console.log(i); 4 }; 5 }; 6 countNumber(); GVODUJPO♶♧㹁銴剤⿮侸《对⡹䟝銴麨䧭涸湡涸 ⴅ䒭GVODUJPO 參數的數量沒有實際上的限制，但還是盡量控制在 2～3 個左右

1 function areaBox(width, length) { 2 var result = width*length;
3 return result; 4 // 在 {} 裡的每⼀一⾏行⼀一定要⽤用 ; 結尾 5 }; 6 console.log(areaBox(12,24)); //288 ⴕ贫䖎ꅾ銴 ⴅ䒭GVODUJPO

D.R.Y %PO’U3FQFBU:PVSTFMG ,FFQZPVSTFMG 殹⡹涮植⡹♧湬ꅾ醳䩧ず垺涸玑䒭焺 ㈔♧⥜佖涸鿈ⴕ〫剤⿮侸罜䊺齡⡹ 㽠䥰鑪⢪欽GVODUJPO

㛇燊铃岁❀ 须俲㘗ⴽ暟⟝

⡹䟝銴䒊用♧⦐匌銯 鸏⦐匌銯剤䖎㢵㿂䚍

%BUBUZQFそ㶶䎃룲欰傈䩛堥⥌盳耷噠鼩剤 .FUIPE鸏⦐➃〳⟃⨞➊랃

暟⟝ 0CKFDU

暟⟝0CKFDU ♧⦐暟⟝僽♧❉㿂䚍涸꧌ざ罜㿂䚍僽꒳莅⧩⛓꟦涸ꡠ耢 LFZWBMVFQBJST

1 var objName = { 2 key: value, 3 key:
value, 4 key: function(){ 5 //Do Something 6 }; 7 }; " 暟⟝0CKFDU

value, 4 key: function(){ 5 //Do Something 6 }; 7 }; 〳⟃䪾㿂䚍QSPQFSUZ 䟝䧭僽꣡㿂倴鑪暟⟝涸隶侸欽⢵䲾鶤鑪暟⟝ 涸暶颶 " 暟⟝0CKFDU

value, 4 key: function(){ 5 //Do Something 6 }; 7 }; 㿂䚍QSPQFSUZ 㶶⚮♶欽䒸贫 侸㶶倰岁.FUIPE 岤䠑ㄐそ鿪剤ⴕ㣐㼭㻨㿂䚍莅㿂䚍⛓꟦欽鸊럊ⴕꟚ " 暟⟝0CKFDU

1 var myself = { 2 name: "Irene", 3 age:
19, 4 calling: function(){ 5 console.log('Calling to' + this.name + 'at' + this.phone); 6 }, 7 }; " 暟⟝0CKFDU

1 objectName.propertyName 《ⴀ㿂䚍涸倰岁 1 objectName["propertyName"] " # 暟⟝0CKFDU

1 objectName.propertyName 《ⴀ㿂䚍涸倰岁 1 objectName["propertyName"] " # LFZ⺫わ瑠涯꒳鸮㶶贫䧴僽⟃侸㶶Ꟛ걧瘞〫腋欽鸏珏《岁 ⹛䢀㹒デ㥶瘞䖊⢪欽罏鱒Ⰵ欽鸏珏《岁湱㼩鯱㸞 暟⟝0CKFDU

ⴅ䒭'VODUJPOWT倰岁.FUIPE ⴅ䒭〳⟃㖈暟⟝⟃㢫涸⟤ざ㖒倰鄄㹒デ䧮⦛〳⟃湬䱺ㄎ〭㸐蕰ⴅ䒭㖈暟⟝酭꬗鄄㹒デ㸐㽠隶䧭倰岁倰岁䗳갭鷴麕㸐䨾㿂倴涸暟⟝⢵ㄎ〭

1 function test(){ 2 console.log("JavaScript"); 3 } 4 test(); //
呼叫函式 5 var objTest = { 6 test: function(){ 7 console.log("JavaScript"); 8 } 9 }; 10 objTest.test(); //呼叫⽅方法 ⴅ䒭'VODUJPOWT倰岁.FUIPE

⡹涮植✫㌨ arrayName.sort(), Math.random() 鿪僽㖈ㄎ〭倰岁罜"SSBZ .BUI劥魨㽠僽䊺竤鄄㹁纏㥪剤䖎㢵㿂䚍莅倰岁涸暟⟝ ⴅ䒭'VODUJPOWT倰岁.FUIPE

㣐鿈⟨涸玑䒭铃鎊鿪갸⯓㹁纏✫♧❉ 呍䗱暟⟝4UBOEBSECVJMUJOPCKFDUT ⢿㥶.BUI 0CKFDU "SSBZ⟃⿻4USJOH 㸐⦛剤ぐ荈涸㿂䚍莅倰岁雊⢪欽罏〳⟃䘰鸠《欽鸏⛳僽捀➊랃䧮⦛銴鼚⯝⢪欽⥃殆㶶涸⾲㔔 ⴅ䒭'VODUJPOWT倰岁.FUIPE

㼭鑑魨䩛䒊用♧⦐暟⟝荛㼱銴剤♲⦐㿂䚍ㄤ♧⦐倰岁 ⢪欽GPS鶬㕖鱒ⴀ鿈须俲ㄎ〭⡹㹁纏涸倰岁

&/% !〵猰㣐玑䒭鏤鎙灇瑖爢 #Z*SFOF$IBOH

NCC-JavaScript-Week#3

NCC-JavaScript-Week#3

More Decks by Irene Chang

Other Decks in Education

Featured

Transcript