關於JavaScript 迴圈語句，函式，陣列排序等的
阿新 • • 發佈：2018-11-26
for迴圈
實現十行十列的表格,奇數行奇數列、偶數行偶數列不同的背景顏色。
let tab = "<table border='1' cellspacing='0'>"; for(let i=1;i<=10;i++){ //迴圈行 tab += "<tr align='center'>"; for(let j=1;j<=10;j++){ //迴圈列 if(i%2==0 && j%2==0){ tab += `<td bgcolor='red'>${i}行${j}列</td>`; }else if(i%2!=0 && j%2!=0){ tab += `<td bgcolor='blue'>${i}行${j}列</td>`; }else{ tab += `<td>${i}行${j}列</td>`; } } tab += "</tr>"; } tab += "</table>"; document.write(tab);
背景色為紅色的九九乘法表
let cfb ="<table width='600' height='400'>"; for(let i=1;i<10;i++){ cfb +="<tr align='center'>"; for(let j=1;j<=i;j++){ cfb +=`<td bgcolor='red'>${j}*${i}=${i*j}</td>`; } cfb +="</tr>"; } cfb +="</table>"; document.write(cfb);
直角三角形
正三角，直角邊在左邊
let sanjiao1 ="<table>";
for(let i=1;i<=10;i++){ //迴圈行
sanjiao1 +="<tr>";
for(let j=1;j<=i;j++){ //迴圈列
sanjiao1 +="<td>*</td>";
}
sanjiao1 +="</tr>"
}
sanjiao1 +="</table>";
document.write(sanjiao1);
正三角，直角邊在右邊
let sanjiao2 ="<table>"; for(let i=1;i<=10;i++){ sanjiao2 +="<tr>"; for(let j=1;j<=10-i;j++){ //迴圈空格 sanjiao2 +="<td> </td>"; } for(let j=1;j<=i;j++){ sanjiao2 +="<td>*</td>"; } sanjiao2 +="</tr>" } sanjiao2 +="</table>"; document.write(sanjiao2);
十行十列，要實現題目要求，前面需要空格填充，先迴圈每一行的空格，第一行9、之後遞減，每一行空格為（10-i）;每一行的*為 i 。
倒三角，直角邊在左邊
let sanjiao3 ="<table>";
for(let i=1;i<=10;i++){
sanjiao3 +="<tr>";
for(let j=1;j<=11-i;j++){
sanjiao3 +="<td>*</td>";
}
sanjiao3 +="</tr>"
}
sanjiao3 +="</table>";
document.write(sanjiao3);
十行十列，要實現題目要求，第一行10個*，之後依次遞減，每一行的*為（10-i+1） 。
倒三角，直角邊在右邊
let sanjiao4 ="<table>";
for(let i=1;i<=10;i++){
sanjiao4 +="<tr>";
for(let j=1;j<=i-1;j++){
sanjiao4 +="<td> </td>"; //迴圈空格
}
for(let j=1;j<=11-i;j++){
sanjiao4 +="<td>*</td>";
}
sanjiao4 +="</tr>"
}
sanjiao4 +="</table>";
document.write(sanjiao4);
十行十列，實現題目要求，先迴圈空格，第一行0個空格，之後每行遞增，每行空格為（i-1）；第一行*為10個，之後每行遞減，每行*為（10-i+1）。
基礎練習題
一個四位數，恰好等於去掉它的首位數字之後所剩的三位數的3倍，這個四位數是多少?
for(let i=1000;i<10000;i++){
let num = i%1000;
if(i/num==3){
console.log("這個四位數是："+i);
}
}
有一個兩位數，如果在它的前面添一個3，可得到一個三位數；把3添在它的後面，也可以得到一個三位數。這兩個三位數相差468，求原來的兩位數。
for(let i=10;i<100;i++){
let num1 = i+300;
let num2 = i*10+3;
if(num1-num2==468 ||num1-num2==-468){
console.log(i);
}
}
一個六位自然數，將其末位上數字7移至首位，其餘數字依次向右移動一位，得到一個新的六位數，新的六位數是原六位數的4倍，求原數。
for(let i=100000;i<1000000;i++){
let num = (i-7)/10+700000;
if(num/i==4){
console.log(i);
}
}
籠子裡有雞兔共34只，共有96只腳，雞兔各有幾隻？
for(let a=0;a<=34;a++){
for(let b=0;b<=24;b++){
if(a+b==34 && a*2+b*4==96){
document.write("有"+a+"只雞，"+"有"+b+"只兔子");
}
}
}
a為雞，b為兔子，共有34只，限制雞、兔子的個數都<=34;共有96只腳，限制兔子的個數<=24。兩個條件與的關係，if判斷，符合條件的輸出。
參考書單價10元，筆記本單價5元，練習本單價0.5元，一共花了100元買了100本，參考書、筆記本、練習本各買了幾本？
for(let a=0;a<=10;a++){
for(let b=0;b<=20;b++){
for(let c=0;c<=100;c++){
if(a*10+b*5+c*0.5==100&&a+b+c==100){
document.write("參考書"+a+"本，"+"筆記本"+b+"本，"+"練習本"+c+"本");
}
}
}
}
通過價格和一共的本數限制參考書<=10、筆記本<=20、練習本<=100;兩個條件與的關係，if判斷，符合條件的輸出。
操場上100多人排隊，三人一組多1人，四人一組多2人，五人一組多3人，共多少人?
for(let a=100;a<200;a++){
if(a%3==1 && a%4==2 && a%5==3){
document.write("操場上共有"+a+"個人");
}
}
一共一百多人，人數應該>=100 且 <200;由三個條件人數取餘，三條件與的關係，if判斷，符合條件的輸出。
函式
閉包
一個函式fn巢狀一個函式fn1，當巢狀的函式fn1被外部的一個變數引用時，就形成了閉包。
作用：可以在外部訪問變數 將區域性變數儲存在作用域鏈上
function fn(){
let aa = 123;
return function fn1(){
console.log(aa);
}
}
let fn1 = fn();
fn1();//123
function aa(){
let i=10;
function bb(){
return ++i;
}
return bb;
}
let c = aa();
alert(c());//11
遞迴（求階乘）
一個函式再次呼叫這個函式
function jc(num){
if(num==1){
return 1;
}
return num * jc(num-1);
}
console.log(jc(10));//10的階乘
例如10的階乘，10！= 10 * (10-1)!;
9！= 9 * (9 -1)!;
......
2! = 2 * (2 -1)!;
1! = 1;
對一個函式的迴圈呼叫
回撥（四則運算）
通過函式的指標來呼叫函式。
– 把一個函式的指標做為另一個函式的引數，當呼叫這個引數的時候，這個函式就叫做回撥函式
function demo(a,b,c){
return c(a,b);
}
function jia(a,b){ //加
return a+b;
}
function jian(a,b){ //減
return a-b;
}
function sheng(a,b){ //乘
return a*b;
}
function chu(a,b){ //除
return a/b;
}
alert(demo(4,5,sheng));
陣列
陣列的遍歷
二維陣列的遍歷
let arrAr = [1,1,2,3,[4,5]];
for(i in arrAr){
if(typeof arrAr[i]=="object"){
for(j in arrAr[i]){
console.log(arrAr[i][j]);
}
}else{
console.log(arrAr[i]);
}
}
多維陣列的遍歷（遞迴）
let arrDuo = [1,1,[8,6],3,[54,[12,3],66],5];
function bl(arr){
for(i in arr){
if(typeof arr[i]=="object"){
bl(arr[i]);
}else{
console.log(arr[i]);
}
}
}
bl(arrDuo);
陣列的拷貝
陣列的淺拷貝
let arrA=[1,2,3,45];
let arrB=arrA;
arrB[0]=0;
console.log(arrB);//[0,2,3,45]
console.log(arrA);//[0,2,3,45]
淺拷貝
let arrC=[1,2,3,45];
let arrD=[];
for(i in arrC){
arrD[i] = arrC[i];
}
arrD[0]=0;
console.log(arrD);//[0,2,3,45]
console.log(arrC);//[1,2,3,45]
陣列的深拷貝
let arrShen = [1,1,[8,6],3,[54,[12,3],66],5];
let arrNew = [];
function skb(arrShen,arrNew){
for(i in arrShen){
if(typeof arrShen[i]=="object"){
arrNew[i]= [];
skb(arrShen[i],arrNew[i]);
}else{
arrNew[i]=arrShen[i];
}
}
}
skb(arrShen,arrNew);
console.log(arrShen);
console.log(arrNew);
獲取數組裡面的最大值
let arr = [2,33,4,5,1,55,1];
function arrMax(arr){
let max = arr[0];
for(i in arr){
if(arr[i]>max){
max = arr[i];
}
}
console.log(max);
}
arrMax(arr);
刪除數組裡面的空值
let arr = [2,3,,4,,"a",,6];
let newArr = [];
function qukong(arr){
let j =0;
for(i in arr){
if(arr[i]!=undefined){
newArr[j] = arr[i];
j++;
}
}
console.log(newArr);
}
qukong(arr);
宣告一個新陣列，遍歷舊陣列，根據如果為空返回的是undefined，把判斷不為undefined的元素拷貝給新的陣列。
連線兩個陣列
let arr1 = [1,2,3];
let arr2 = [4,5,6];
let newArr = [];
function concat(arr1,arr2){
let index = 0;
for(i in arr1){
newArr[index]=arr1[i];
index++;
}
for(i in arr2){
newArr[index]=arr2[i];
index++;
}
console.log(newArr); //[1,2,3,4,5,6]
}
concat(arr1,arr2);
刪除陣列的首位元素
let arr = [1,2,3];
let newArr = [];
function shift(arr){
let index =0;
for(let i=1;i<arr.length;i++){
newArr[index]=arr[i];
index++;
}
console.log(newArr); //[2,3]
}
shift(arr);
在陣列的首位新增一個元素
let arr = [1,2,3];
let newArr = [];
function unshift(arr,item){
newArr[0]=item;
let index = 1;
for(i in arr){
newArr[index]=arr[i];
index++;
}
console.log(newArr);
}
unshift(arr,0);
在陣列的首位新增多個元素
let arr = [1,2,3];
function unshift(arr,...item){
let newArr = item;
let index = item.length;
for(i in arr){
newArr[index]=arr[i];
index++;
}
console.log(newArr);
}
unshift(arr,0,0,0,0);
向陣列的末位新增一個元素
let arr = [1,2,3];
function push(arr,item){
let newArr = [];
for(i in arr){
newArr[i]=arr[i];
}
newArr[arr.length]=item;
console.log(newArr);
}
push(arr,4);
刪除陣列的末位元素
let arr = [1,2,3];
function pop(arr){
let newArr = [];
for(let i=0;i<(arr.length-1);i++){
newArr[i]=arr[i];
}
console.log(newArr);
}
pop(arr);
陣列倒序排列
let arr = [1,2,3,4];
function reverse(arr){
let newArr = [];
let index = arr.length-1 ;
for(i in arr){
newArr[index]=arr[i];
index--;
}
console.log(newArr);
}
reverse(arr);
陣列的排序
氣泡排序
let arr=[3,2,6,1,7,9];
function paixu(arr){
for(var i=0;i<arr.length-1;i++){
for(var j=0;j<arr.length-1-i;j++){
if(arr[j]>arr[j+1]){
var paixu;
paixu=arr[j];
arr[j]=arr[j+1];
arr[j+1]=paixu;
}
}
}
console.log(arr);
}
paixu(arr);
順序排序
let arr=[3,2,6,1,7,9];
function paixu(arr,b){
for(var i=0;i<arr.length-1;i++){ //遍歷陣列以後，拿陣列的每一個元素參與比較
for(var j=i+1;j<arr.length;j++){ //從i的下一個元素開始遍歷，拿出一個元素參與比較；裡層的for迴圈迴圈完一次，就找出一個最大值。
if(b==">"){
if(arr[i]<arr[j]){ //當i的當前元素比j的當前元素小，就讓他兩交換位置
var paixu;
paixu=arr[i];
arr[i]=arr[j];
arr[j]=paixu;
}
}else if(b=="<"){
if(arr[i]>arr[j]){
var paixu;
paixu=arr[i];
arr[i]=arr[j];
arr[j]=paixu;
}
}
}
}
console.log(arr);
}
paixu(arr,">");