📚
2024 Training JS 系列 /w Codewars
はじめに
這是 codewars 上的 Code Katas 學習 JavaScript 系列，總共有 42 題。
可以藉由這些 kata 學習基礎的 JS 語法。
Training JS #1: create your first JS function and print "Hello World!"
Training JS #1 | #8kyu
Training JS #1 - function 練習
Description：
創造你的第一個 JS 函數，並且印出 'Hello World!'
我的解法
function helloWorld(){
let str = 'Hello World!';
console.log (str);
}
反饋與思考
最優解
同上
Training JS #2: Basic data types--Number
Training JS #2 | #8kyu
Training JS #2 - 數字型別
Description：
這裡宣告了一些數值，請將數值代入函式使運算式取得 100
我的解法
var v1=50;v2=100,v3=150,v4=200,v5=2,v6=250
function equal1(){
var a=v1;
var b=v1;
return a+b;
}
//Please refer to the example above to complete the following functions
function equal2(){
var a=v3;
var b=v1;
return a-b;
}
function equal3(){
var a=v1;
var b=v5;
return a*b;
}
function equal4(){
var a=v4;
var b=v5;
return a/b;
}
function equal5(){
var a=v6;
var b=v3;
return a%b;
}
反饋與思考
- 取餘數好難……
最優解
同上
Training JS #3: Basic data types--String
Training JS #3 | #8kyu
Training JS #3 - 字串型別
Description：
請練習組成題目要的字串，注意有大小寫
我的解法
var a1="A",a2="a",b1="B",b2="b",c1="C",c2="c",d1="D",d2="d",e1="E",e2="e",n1="N",n2="n"
function Dad(){
//select some variable to combine "Dad"
return d1+a2+d2;
}
function Bee(){
//select some variable to combine "Bee"
return b1+e2+e2;
}
function banana(){
//select some variable to combine "banana"
return b2+a2+n2+a2+n2+a2;
}
反饋與思考
- 送出之後還有金斧頭銀斧頭的故事，好有趣
最優解
同上
Training JS #4: Basic data types--Array
Training JS #4 | #8kyu
Training JS #4 - 陣列
Description：
學習使用陣列 method
我的解法
function getLength(arr){
//return length of arr
return arr.length;
}
function getFirst(arr){
//return the first element of arr
return arr[0];
}
function getLast(arr){
//return the last element of arr
return arr[arr.length -1];
}
function pushElement(arr){
let el=4;
arr.push('el');
return arr;
}
function popElement(arr){
//pop an element from arr
arr.pop()
return arr;
}
反饋與思考
- 這麼快就開始陣列了嗎w
- 觀念不好… 寫成了
return arr.push('el')
最優解
同上
Training JS #5: Basic data types--Object
Training JS #5 | #8kyu
Training JS #5 - 物件
Description：
學習物件的取值與結構
我的解法
function animal(obj){
return `This ${obj.color} ${obj.name} has ${obj.legs} legs.`;
}
反饋與思考
- 有點看不懂題目在寫啥ww
最優解
同上
Training JS #6: Basic data types--Boolean and conditional statements
Training JS #6 | #8kyu
Training JS #6 - if else 條件式
Description：
學習 if、else if ...等條件式
我的解法
function trueOrFalse(val){
return val ? true : false;
}
反饋與思考
- 有點看不懂題目在寫啥ww <= 這不是重覆，是真的很難懂qq
最優解
同上
Training JS #7: if..else and ternary operator
Training JS #7 | #8kyu
Training JS #7 - if else 與三元運算
Description：
學習三元運算
我的解法
function saleHotdogs(n){
return n < 5 ? n * 100 : n >= 10 ? n * 90 : n * 95 ;
}
反饋與思考
- 通常三元都寫 a or b ，很少寫到三個條件的，練習了一下。
最優解
同上
Training JS #8: Conditional statement--switch
Training JS #8: Conditional statement--switch | #8kyu
Training JS #8: Conditional statement--switch - Switch 語法練習
Description：
在 JavaScript 中，可以使用switch取代多個if
我的解法
Tip: 可以使用 default 減少工作量
function howManydays(month){
let days;
switch (month){
case 2:
days = 28;
break;
case 4:
case 6:
case 9:
case 11:
days = 30;
break;
default:
days = 31;
}
return days;
}
反饋與思考
- 一開始寫成了下面的方式，宣告了
days應該要在完成判斷後(case)賦予days值。所以原本寫的方式會造成undefined
case 2:
console.log(28);
break;
- 以為
case只能一次用一個，後來才發現原來可以一次好幾個case
like:
case 4:
case 6:
case 9:
case 11:
days = 30;
break;
最優解
同上
Training JS #9: loop statement --while and do..while
Training JS #9 | #8kyu
Training JS #9 - while 迴圈練習
Description：
學習while和do..while
我的解法
function padIt(str,n){
while (n > 0){
if (n % 2 === 1){
str = '*' + str;
}else{
str = str + '*';
}
n--;
}
return str;
}
反饋與思考
- 沒學過
while感覺跟for有點像，查詢了一下是說while適合用在不知道確切的循環次數的情境。
最優解
同上
Training JS #10: loop statement --for
Training JS #10 | #8kyu
Training JS #10 - for 迴圈練習
Description：
學習for
我的解法
function pickIt(arr){
var odd=[],even=[];
for(let i = 0; i < arr.length ; i++ ){
if (arr[i] % 2 === 0){
even.push(arr[i]);
}else{
odd.push(arr[i]);
}
}
return [odd,even];
}
反饋與思考
-
for來了~ 這個比較熟啦w
最優解
同上
Training JS #11: loop statement --break,continue
Training JS #11 | #8kyu
Training JS #11 - break, continue 迴圈練習
Description：
迭代dolls陣列來抓取 'Hello Kitty' 和 'Barbie doll'添加到bag陣列中，並且最多只能抓取 3 個。
我的解法
function grabDoll(dolls){
var bag=[];
for (let i = 0 ; i < dolls.length ;i++){
if(dolls[i] === 'Hello Kitty' || dolls[i] === 'Barbie doll'){
bag.push(dolls[i]);
if(bag.length === 3){
break;
}
}
}
return bag;
}
反饋與思考
- 先試著自己寫一次，然後交由
GPT來檢查。 - for 迴圈中
i >= 3正確應該是i < dolls.length，因為偷看到測試，所以先入為主的設了 3 ，並且應該是要小於才會跑迴圈。 -
dolls === 'Hello Kitty'應該是dolls[i] === 'Hello Kitty'，因為需要的是陣列裡面的元素。而不是 dolls 本身 - 錯誤的賦值：
if(bag.length = 3)，這是是想要檢查bag陣列的長度而不是賦值。可惡，這個每次都會忘記。
最優解
同上
Discussion