js基礎案例
阿新 • • 發佈：2022-04-10
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<script>
//簡易atm機
/* var sum = 100;
do {
var text = parseFloat(prompt("1.存錢\n2.取錢\n3.顯示餘額\n4.退出"));
switch (text) {
case 1:
var cq = parseFloat(prompt("存錢金額"));
sum += cq;
alert("金額為" + sum);
break;
case 2:
qq = parseFloat(prompt("取錢金額"));
if (qq > sum) {
alert("金額不足");
} else {
sum -= qq;
alert("金額為" + sum);
break;
}
case 3:
alert("餘額" + sum);
break;
case 4:
alert("你已經退出");
break
default:
alert("沒有這個功能");
break;
}
} while (text !== 4); */
//求最大值 /* var arr = [2, 6, 1, 77, 52, 25, 7, 99]; max = arr[0]; for (var i = 1; i < arr.length; i++) { if (arr[i] > max) { max = arr[i]; } // max=arr[i]>max?arr[i]:max; } console.log(max); */
//求最小值 /* var arr1 = [2, 6, 1, 77, 52, 25, 7, 99]; min = arr[0]; for (var i = 1; i < arr1.length; i++) { if (arr1[i] < min) { min = arr1[i]; } // max=arr[i]>max?arr[i]:max; } console.log(min); */
//輸出1-10的整數在arr2裡面 /* var arr2 = []; for (var i = 0; i < 10; i++) { arr2[i] = i + 1; } console.log(arr2); */
//求陣列大於10的存在arr4數組裡面 /* var arr3 = [2, 0, 6, 1, 77, 0, 52, 0, 25, 7]; var arr4 = []; for (var i = 0; i < arr3.length; i++) { if (arr3[i] >= 10) { arr4[arr4.length] = arr3[i]; } } console.log(arr4); */
//求陣列小於10的存在arr4數組裡面 /* var arr3 = [2, 0, 6, 1, 77, 0, 52, 0, 25, 7]; var arr4 = []; for (var i = 0; i < arr3.length; i++) { if (arr3[i] <= 10) { arr4[arr4.length] = arr3[i]; } } console.log(arr4); */
//反轉陣列 /* var arr = ["red", "green", "blue", "pink", "purple", "hotpink"]; arr1 = []; for (var i = arr.length - 1; i >= 0; i--) { arr1[arr1.length] = arr[i]; } console.log(arr1); */
//氣泡排序 /* var arr = [5, 3, 1, 4, 2]; for (var i = 0; i <= arr.length - 1; i++) { //i只是判斷要迴圈的趟數 for (var j = 0; j < arr.length - i - 1; j++) { //j是判斷迴圈的次數 if (arr[j] > arr[j + 1]) { var temp = arr[j]; arr[j] = arr[j + 1]; arr[j + 1] = temp; } } } console.log(arr); */
// 簡易計算器 /* num1 = prompt("請輸入第一個數字"); ysf = prompt("請輸入運算子"); num2 = prompt("請輸入第個二數字"); function getJs() { switch (ysf) { case "+": return parseFloat(num1) + parseFloat(num2); break; case "-": return parseFloat(num1) - parseFloat(num2); break; case "*": return parseFloat(num1) * parseFloat(num2); break; case "/": return parseFloat(num1) / parseFloat(num2); break; default: alert("沒有這個運算"); break; } } alert("運算結果為" + getJs(num1, ysf, num2)); */
//輸入任意兩個數求最大值 /* var num1=prompt('請輸入第一個值'); var num2=prompt('請輸入第二個值'); function getMax(num1, num2) { return num1 > num2 ? num1 : num2; } alert(getMax(num1,num2)); */
//輸入任意三個數求最大值 /* var num1 = prompt("請輸入第一個值"); var num2 = prompt("請輸入第二個值"); var num3 = prompt("請輸入第二個值"); function getMax(num1, num2, num3) { arr = [num1, num2, num3]; max = arr[0]; for (var i = 1; i <= arr.length; i++) { if (arr[i] > max) { max = arr[i]; } } return max; } alert(getMax(num1, num2,num3)); */
//判斷是否為質素 /* var num = prompt("請輸入一個數"); function getZs(num) { if (num <= 2) { return false; }
for (var i = 2; i < num; i++) { if (num % i == 0) { return false; } } return true; } alert(getZs(num)); */
//arguments求最大值 /* function getMax() { var max = arguments[0]; for (var i = 1; i < arguments.length; i++) { if (arguments[i] > max) { max = arguments[i]; } } return max; } console.log(getMax(56, 89, 33, 4)); console.log(getMax(56, 5, 89, 353, 4)); console.log(getMax(56, 89, 33, 994)); */
//利用函式翻轉任意陣列 reverse翻轉的意思 /* function reverse(arr) { var newArr = []; for (var i = arr.length - 1; i >= 0; i--) { newArr[newArr.length] = arr[i]; } return newArr; } var arr1 = reverse([1, 2, 3, 4, 5]); console.log(arr1); var arr2 = reverse([2, 6, 8, 10, 12]); console.log(arr2); */
//函式氣泡排序 sort排序的意思 /* function sort(arr) { for (var i = 0; i < arr.length - 1; i++) { for (var j = 0; j < arr.length - i - 1; j++) { if (arr[j] > arr[j + 1]) { var temp = arr[j]; arr[j] = arr[j + 1]; arr[j + 1] = temp; } } } return arr; } var arr1 = sort([9, 62, 8, 2, 3, 66, 89, 10]); console.log(arr1); */
//函式判斷閏年 是返回true 否則false /* function isRunnian(year) { var flag = false; if ((year % 4 == 0 && year % 100 != 0) || year % 400 == 0) { flag = true; } return flag; } console.log(isRunnian(2000)); console.log(isRunnian(1999));
//利用呼叫函式判斷閏年天數 if 裡面預設為是true else 則是false function getDate() { var year1 = prompt("請輸入年份"); if (isRunnian(year1)) { alert("第二月有29天"); } else { alert("第二月有28天"); } } getDate(); */
//利用{}按照要求建立物件 /* var obj = { name: "可可", type: "阿拉斯加犬", age: 18, color: "pink", say: function () { console.log("汪汪汪"); console.log("演電影"); } }; console.log(obj.name); console.log(obj.age); obj.say(); */
//利用new Object根據要求建立物件 /* var obj1=new Object(); obj1.name='鳴人'; obj1.sex='男'; obj1.age=19; obj1.skill=function(){ console.log('影分身術'); } console.log(obj1.name); console.log(obj1['age']); obj1.skill(); */
//利用建構函式建立物件 /* function King(name,type,blood){ this.name=name; this.type=type; this.blood=blood; this.attack=function(attack){ console.log(attack); } } var lp=new King('廉頗','力量型','500血量') console.log(lp.name); console.log(lp['type']); lp.attack('近戰')
var hy=new King('後裔','射手型','100血量') console.log(hy.name); console.log(hy['type']); lp.attack('遠端'); */
//利用函式反轉陣列 /* function getFz(arr) { newArr = []; for (var i = arr.length - 1; i >= 0; i--) { newArr[newArr.length] = arr[i]; } return newArr; } var arr1 = getFz([1, 2, 3, 4, 5]); console.log(arr1); */
//利用函式實現對數字陣列的排序 /* function paiXu(arr) { for (var i = 0; i < arr.length - 1; i++) { for (var j = 0; j < arr.length - i - 1; j++) { if (arr[j] > arr[j + 1]) { var temp = arr[j]; arr[j] = arr[j + 1]; arr[j + 1] = temp; } } } return arr; } var arr1 = paiXu([5, 4, 3, 2, 1]); console.log(arr1); */
//建議計算器2 /* while (true) { var num = parseInt( prompt("1.加法運算\n2.減法運算\n3.乘法運算\n4.除法運算\n5.退出") ); if (num == 5) { alert("正在退出"); break; } switch (num) { case 1: var num1 = parseFloat(prompt("請輸入第一個數")); var num2 = parseFloat(prompt("請輸入第二個數")); alert(num1 + num2); break; case 2: var num1 = parseFloat(prompt("請輸入第一個數")); var num2 = parseFloat(prompt("請輸入第二個數")); alert(num1 - num2); break; case 3: var num1 = parseFloat(prompt("請輸入第一個數")); var num2 = parseFloat(prompt("請輸入第二個數")); alert(num1 * num2); break; case 4: var num1 = parseFloat(prompt("請輸入第一個數")); var num2 = parseFloat(prompt("請輸入第二個數")); alert(num1 / num2); break;
default: alert("沒有這個運算"); break; } } */
//['red', 'blue', 'red', 'green', 'pink','red'], 求 red 出現的位置和次數 /* var arr1 = ["red", "blue", "red", "green", "pink", "red"]; var index = arr1.indexOf("red"); var num = 0; while (index !== -1) { console.log(index); num++; index = arr1.indexOf("red", index + 1); }
console.log(num); */ //判斷字串中出現最多的值,輸出值和幾次 /* var str = "abcoefoxyozzopp"; var o = {}; for (var i = 0; i < str.length; i++) { var chars = str.charAt(i); if (o[chars]) { //o[chars]是屬性值，應為chars是字串型所以不能直接o.chars o[chars]++; } else { o[chars] = 1; //可以理解為在o物件裡建立了chars屬性並賦值為1; } } console.log(o); var max = 0; var ch = ""; for (k in o) { //遍歷物件k是屬性，o[k]是屬性值 if (o[k] > max) { max = o[k]; ch = k; } } console.log("出現最多的屬性是" + ch); console.log("出現的次數是" + max); */
//給定一個字串，如:'abaasdffggghhjjkkgfddsssss3444343' /* 1.求出字串的長度, 2.取出指定位置的字元,如0,3,5,9等 3.查詢指定字串是否有以上字元存在，如:i,c,b等 4.替換指定字元，如:g替換成22，ss替換成b等操作方法 5.擷取指定開始位置到結束位置的字串，如:取得1-5的字串 6.找出以上字串中出現最多的字元和出現次數 */ /* var str = "abaasdffggghhjjkkgfddsssss3444343"; console.log(str.length);
console.log(str.charAt(0)); console.log(str.charAt(3)); console.log(str.charAt(5)); console.log(str.charAt(9));
function panDuan(num) { if (num !== -1) { return "有該字串"; } else { return "沒有該字串"; } } console.log(panDuan(str.indexOf("i"))); console.log(panDuan(str.indexOf("c"))); console.log(panDuan(str.indexOf("b")));
function tiHuan(string) { while (str.indexOf(string) !== -1) { str = str.replace(string, 22); } return str; } console.log(tiHuan("g"));
var str = "abaasdffggghhjjkkgfddsssss3444343"; //上面tiHuan函式把str替換，重新宣告字串 console.log(str.substr(1, 5));
var n = {}; for (var i = 0; i < str.length; i++) { var chars = str.charAt(i); if (n[chars]) { n[chars]++; } else { n[chars] = 1; } } console.log(n); //先轉換成物件，在遍歷物件求出現最多的字元和次數 var max = 0; var ch = ""; for (b in n) { if (n[b] > max) { max = n[b]; ch = b; } } console.log("出現最多的字元是" + ch + "出現了" + max); */ </script> </body> </html>
//求最大值 /* var arr = [2, 6, 1, 77, 52, 25, 7, 99]; max = arr[0]; for (var i = 1; i < arr.length; i++) { if (arr[i] > max) { max = arr[i]; } // max=arr[i]>max?arr[i]:max; } console.log(max); */
//求最小值 /* var arr1 = [2, 6, 1, 77, 52, 25, 7, 99]; min = arr[0]; for (var i = 1; i < arr1.length; i++) { if (arr1[i] < min) { min = arr1[i]; } // max=arr[i]>max?arr[i]:max; } console.log(min); */
//輸出1-10的整數在arr2裡面 /* var arr2 = []; for (var i = 0; i < 10; i++) { arr2[i] = i + 1; } console.log(arr2); */
//求陣列大於10的存在arr4數組裡面 /* var arr3 = [2, 0, 6, 1, 77, 0, 52, 0, 25, 7]; var arr4 = []; for (var i = 0; i < arr3.length; i++) { if (arr3[i] >= 10) { arr4[arr4.length] = arr3[i]; } } console.log(arr4); */
//求陣列小於10的存在arr4數組裡面 /* var arr3 = [2, 0, 6, 1, 77, 0, 52, 0, 25, 7]; var arr4 = []; for (var i = 0; i < arr3.length; i++) { if (arr3[i] <= 10) { arr4[arr4.length] = arr3[i]; } } console.log(arr4); */
//反轉陣列 /* var arr = ["red", "green", "blue", "pink", "purple", "hotpink"]; arr1 = []; for (var i = arr.length - 1; i >= 0; i--) { arr1[arr1.length] = arr[i]; } console.log(arr1); */
//氣泡排序 /* var arr = [5, 3, 1, 4, 2]; for (var i = 0; i <= arr.length - 1; i++) { //i只是判斷要迴圈的趟數 for (var j = 0; j < arr.length - i - 1; j++) { //j是判斷迴圈的次數 if (arr[j] > arr[j + 1]) { var temp = arr[j]; arr[j] = arr[j + 1]; arr[j + 1] = temp; } } } console.log(arr); */
// 簡易計算器 /* num1 = prompt("請輸入第一個數字"); ysf = prompt("請輸入運算子"); num2 = prompt("請輸入第個二數字"); function getJs() { switch (ysf) { case "+": return parseFloat(num1) + parseFloat(num2); break; case "-": return parseFloat(num1) - parseFloat(num2); break; case "*": return parseFloat(num1) * parseFloat(num2); break; case "/": return parseFloat(num1) / parseFloat(num2); break; default: alert("沒有這個運算"); break; } } alert("運算結果為" + getJs(num1, ysf, num2)); */
//輸入任意兩個數求最大值 /* var num1=prompt('請輸入第一個值'); var num2=prompt('請輸入第二個值'); function getMax(num1, num2) { return num1 > num2 ? num1 : num2; } alert(getMax(num1,num2)); */
//輸入任意三個數求最大值 /* var num1 = prompt("請輸入第一個值"); var num2 = prompt("請輸入第二個值"); var num3 = prompt("請輸入第二個值"); function getMax(num1, num2, num3) { arr = [num1, num2, num3]; max = arr[0]; for (var i = 1; i <= arr.length; i++) { if (arr[i] > max) { max = arr[i]; } } return max; } alert(getMax(num1, num2,num3)); */
//判斷是否為質素 /* var num = prompt("請輸入一個數"); function getZs(num) { if (num <= 2) { return false; }
for (var i = 2; i < num; i++) { if (num % i == 0) { return false; } } return true; } alert(getZs(num)); */
//arguments求最大值 /* function getMax() { var max = arguments[0]; for (var i = 1; i < arguments.length; i++) { if (arguments[i] > max) { max = arguments[i]; } } return max; } console.log(getMax(56, 89, 33, 4)); console.log(getMax(56, 5, 89, 353, 4)); console.log(getMax(56, 89, 33, 994)); */
//利用函式翻轉任意陣列 reverse翻轉的意思 /* function reverse(arr) { var newArr = []; for (var i = arr.length - 1; i >= 0; i--) { newArr[newArr.length] = arr[i]; } return newArr; } var arr1 = reverse([1, 2, 3, 4, 5]); console.log(arr1); var arr2 = reverse([2, 6, 8, 10, 12]); console.log(arr2); */
//函式氣泡排序 sort排序的意思 /* function sort(arr) { for (var i = 0; i < arr.length - 1; i++) { for (var j = 0; j < arr.length - i - 1; j++) { if (arr[j] > arr[j + 1]) { var temp = arr[j]; arr[j] = arr[j + 1]; arr[j + 1] = temp; } } } return arr; } var arr1 = sort([9, 62, 8, 2, 3, 66, 89, 10]); console.log(arr1); */
//函式判斷閏年 是返回true 否則false /* function isRunnian(year) { var flag = false; if ((year % 4 == 0 && year % 100 != 0) || year % 400 == 0) { flag = true; } return flag; } console.log(isRunnian(2000)); console.log(isRunnian(1999));
//利用呼叫函式判斷閏年天數 if 裡面預設為是true else 則是false function getDate() { var year1 = prompt("請輸入年份"); if (isRunnian(year1)) { alert("第二月有29天"); } else { alert("第二月有28天"); } } getDate(); */
//利用{}按照要求建立物件 /* var obj = { name: "可可", type: "阿拉斯加犬", age: 18, color: "pink", say: function () { console.log("汪汪汪"); console.log("演電影"); } }; console.log(obj.name); console.log(obj.age); obj.say(); */
//利用new Object根據要求建立物件 /* var obj1=new Object(); obj1.name='鳴人'; obj1.sex='男'; obj1.age=19; obj1.skill=function(){ console.log('影分身術'); } console.log(obj1.name); console.log(obj1['age']); obj1.skill(); */
//利用建構函式建立物件 /* function King(name,type,blood){ this.name=name; this.type=type; this.blood=blood; this.attack=function(attack){ console.log(attack); } } var lp=new King('廉頗','力量型','500血量') console.log(lp.name); console.log(lp['type']); lp.attack('近戰')
var hy=new King('後裔','射手型','100血量') console.log(hy.name); console.log(hy['type']); lp.attack('遠端'); */
//利用函式反轉陣列 /* function getFz(arr) { newArr = []; for (var i = arr.length - 1; i >= 0; i--) { newArr[newArr.length] = arr[i]; } return newArr; } var arr1 = getFz([1, 2, 3, 4, 5]); console.log(arr1); */
//利用函式實現對數字陣列的排序 /* function paiXu(arr) { for (var i = 0; i < arr.length - 1; i++) { for (var j = 0; j < arr.length - i - 1; j++) { if (arr[j] > arr[j + 1]) { var temp = arr[j]; arr[j] = arr[j + 1]; arr[j + 1] = temp; } } } return arr; } var arr1 = paiXu([5, 4, 3, 2, 1]); console.log(arr1); */
//建議計算器2 /* while (true) { var num = parseInt( prompt("1.加法運算\n2.減法運算\n3.乘法運算\n4.除法運算\n5.退出") ); if (num == 5) { alert("正在退出"); break; } switch (num) { case 1: var num1 = parseFloat(prompt("請輸入第一個數")); var num2 = parseFloat(prompt("請輸入第二個數")); alert(num1 + num2); break; case 2: var num1 = parseFloat(prompt("請輸入第一個數")); var num2 = parseFloat(prompt("請輸入第二個數")); alert(num1 - num2); break; case 3: var num1 = parseFloat(prompt("請輸入第一個數")); var num2 = parseFloat(prompt("請輸入第二個數")); alert(num1 * num2); break; case 4: var num1 = parseFloat(prompt("請輸入第一個數")); var num2 = parseFloat(prompt("請輸入第二個數")); alert(num1 / num2); break;
default: alert("沒有這個運算"); break; } } */
//['red', 'blue', 'red', 'green', 'pink','red'], 求 red 出現的位置和次數 /* var arr1 = ["red", "blue", "red", "green", "pink", "red"]; var index = arr1.indexOf("red"); var num = 0; while (index !== -1) { console.log(index); num++; index = arr1.indexOf("red", index + 1); }
console.log(num); */ //判斷字串中出現最多的值,輸出值和幾次 /* var str = "abcoefoxyozzopp"; var o = {}; for (var i = 0; i < str.length; i++) { var chars = str.charAt(i); if (o[chars]) { //o[chars]是屬性值，應為chars是字串型所以不能直接o.chars o[chars]++; } else { o[chars] = 1; //可以理解為在o物件裡建立了chars屬性並賦值為1; } } console.log(o); var max = 0; var ch = ""; for (k in o) { //遍歷物件k是屬性，o[k]是屬性值 if (o[k] > max) { max = o[k]; ch = k; } } console.log("出現最多的屬性是" + ch); console.log("出現的次數是" + max); */
//給定一個字串，如:'abaasdffggghhjjkkgfddsssss3444343' /* 1.求出字串的長度, 2.取出指定位置的字元,如0,3,5,9等 3.查詢指定字串是否有以上字元存在，如:i,c,b等 4.替換指定字元，如:g替換成22，ss替換成b等操作方法 5.擷取指定開始位置到結束位置的字串，如:取得1-5的字串 6.找出以上字串中出現最多的字元和出現次數 */ /* var str = "abaasdffggghhjjkkgfddsssss3444343"; console.log(str.length);
console.log(str.charAt(0)); console.log(str.charAt(3)); console.log(str.charAt(5)); console.log(str.charAt(9));
function panDuan(num) { if (num !== -1) { return "有該字串"; } else { return "沒有該字串"; } } console.log(panDuan(str.indexOf("i"))); console.log(panDuan(str.indexOf("c"))); console.log(panDuan(str.indexOf("b")));
function tiHuan(string) { while (str.indexOf(string) !== -1) { str = str.replace(string, 22); } return str; } console.log(tiHuan("g"));
var str = "abaasdffggghhjjkkgfddsssss3444343"; //上面tiHuan函式把str替換，重新宣告字串 console.log(str.substr(1, 5));
var n = {}; for (var i = 0; i < str.length; i++) { var chars = str.charAt(i); if (n[chars]) { n[chars]++; } else { n[chars] = 1; } } console.log(n); //先轉換成物件，在遍歷物件求出現最多的字元和次數 var max = 0; var ch = ""; for (b in n) { if (n[b] > max) { max = n[b]; ch = b; } } console.log("出現最多的字元是" + ch + "出現了" + max); */ </script> </body> </html>