12-2 js基礎

時間 2021-04-13

標籤 html 數組 dom ide 函數 htm 對象 blog 排序索引欄目 JavaScript 简体版

原文原文鏈接

一數據類型html

 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4     <meta charset="UTF-8"> 5     <title>數據類型</title> 6 </head> 7 <body> 8 <script> 9 10     var a=123;11     console.log(typeof a);12     //string13     var b='123';14     console.log(typeof b);15     //boolean16     var c=false;17     console.log(typeof c);18     //null19     var d=null;20     console.log(d);21     //undefined未定義22      var d1;23      console.log(typeof d1)24 25 </script>26 27 </body>28 </html>

View Code數組

二數據類型轉換dom

 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4     <meta charset="UTF-8"> 5     <title>數據類型轉換</title> 6 </head> 7 <body> 8 <script> 9     //隱式轉換10     // var n1=123;11     // var n2='123';12     // var n3=n1+n2;13     // console.log(typeof n3);//字符串類型14     //強制類型轉換15     // var str1=String(n1);16     // console.log(str1,typeof str1);//強制轉換成字符串17     // var num=234;18     // console.log(num.toString());//轉成字符串19     //將字符串類型轉換成數值類型20     // var stringNum='789.12113kjk';21     // var num2=Number(stringNum);22     // console.log(num2,typeof num2);//NaN "number"23     // console.log(parseInt(stringNum));//789 只保留整數部分24     // console.log(parseFloat(stringNum));//789.123 保留數字部分25     //轉換成boolean類型26     var b1='123';27     var b2=0;28     var b3=-123;29     var b4=Infinity;30     console.log(typeof b1);31     console.log(typeof b2);32     console.log(typeof b3);33     console.log(typeof b4);//number34     console.log(typeof b5);//mumber35     console.log(typeof b7);//object36     console.log(Boolean(b7));//false37 38     console.log(Boolean(b4));//true39     //下面三個都是爲false40     var b5 = NaN;41 42     var b6; //undefined43     var b7 = null;44 45 46 </script>47 48 </body>49 </html>

View Codeide

三經常使用內置對象函數

  1 <!DOCTYPE html>  2 <html lang="en">  3 <head>  4     <meta charset="UTF-8">  5     <title>經常使用內置對象</title>  6 </head>  7 <body>  8 <script>  9     //---------- 數組array建立--------------------------------- 10     // var arr=[1,2,3]; 11     // console.log(arr); 12     // 數組賦值 13     // arr[0]=1234; 14     // arr[1]='呵呵'; 15     // arr[2]='嘿嘿'; 16     // -----數組的經常使用方法------ 17     // concat合併數組 18     //         var north = ['北京','山東','天津']; 19     //         var south = ['東莞','深圳','上海']; 20     //         var newCity = north.concat(south); 21     //         console.log(newCity); // ["北京", "山東", "天津", "東莞", "深圳", "上海"] 22     // join() 將數組中的元素使用指定的字符串鏈接起來，它會造成一個新的字符串 23             // var score = [98,78,76,100,0]; 24             // var str = score.join('|'); 25             // console.log(str);//98|78|76|100|0 26     // 將數組轉換成字符串 toString() 27     //         var score = [98,78,76,100,0]; 28             //toString() 直接轉換爲字符串  每一個元素之間使用逗號隔開 29             // var str = score.toString(); 30             // console.log(str);//98,78,76,100,0 31      // slice(start,end); 返回數組的一段，顧頭不顧尾 32             // var list= ['1','2','3','4'];  //list不能寫成name,不知道是什麼緣由 33             // var newArr  = list.slice(1,3); 34             // console.log(newArr); 35  36  37     // pop 移除數組的最後一個元素 38             // var arr = ['張三','李四','王文','趙六']; 39             // var newArr  = arr.pop(); 40             // console.log(arr);//["張三", "李四"，"王文"] 41  42     // push() 向數組最後添加一個元素 43             // var arr = ['張三','李四','王文','趙六']; 44             // var newArr  = arr.push('張三丰'); 45             // console.log(arr);//["張三", "李四", "王文", "趙六", "張三丰"] 46  47     // ---reverse()翻轉數組------ 48             // var arr1 = ['張三','李四','王文','趙六']; 49             // arr1.reverse(); 50             // console.log(arr1);//["趙六", "王文", "李四", "張三"] 51  52     // sort對數組排序 53             // var names = ['alex','xiaoma','tanhuang','abngel']; 54             // names.sort(); 55             // console.log(names);// ["abngel", "alex", "tanhuang", "xiaoma"] 56  57     //isarray()判斷是不是數組 58             // var arr1 = ['張三','李四','王文','趙六']; 59             // console.log(Array.isArray(arr1)); //true 60             // 61             // var a=3; 62             // console.log(Array.isArray(a)); //false 63     // --------------字符串---------------------- 64     // chartAt() 返回指定索引的位置的字符 65             // var str='alex'; 66             // var charset=str.charAt(3); 67             // console.log(charset); 68     // concat 返回字符串值，表示兩個或多個字符串的拼接 69             var str1 = 'al'; 70             var str2  = 'ex'; 71             console.log(str1.concat(str2,str2));//alexex 72      // replace(a,b) 將字符串a替換成字符串b 73             //  var a = '1234567755'; 74             // var newStr = a.replace("4567","****");//把4567替換成**** 75             // console.log(newStr);//123****755 76     // indexof() 查找字符的下標，若是找到返回字符串的下標，找不到則返回-1 。跟seach()方法用法同樣 77             // var str = 'alex'; 78             // console.log(str.indexOf('e'));//2 79             // console.log(str.indexOf('p'));//-1 80     // slice(start，end) 左閉右開 分割字符串 81             var aa='你是誰'; 82             console.log(aa.slice(1,2));//是 83     // split('a',1) 以字符串a分割字符串，並返回新的數組。若是第二個參數沒寫，表示返回整個數組，若是定義了個數，則返回數組的最大長度 84     //         var  str =  '個人天呢,a是嘛,你在說什麼呢?a哈哈哈'; 85     //         console.log(str.split('a',2)); 86     // substr(statr,end) 左閉右開，能夠顯示從那到哪，顧頭不顧尾 87     //         var  str =  '個人天呢,a是嘛,你在說什麼呢?a哈哈哈'; 88     //         console.log(str.substr(0,6));//個人天呢 89     //  toLowerCase()轉小寫 90     //             var str = 'XIAOMAGE'; 91     //             console.log(str.toLowerCase());//xiaomage 92     // toUpperCase()轉大寫 93     //             var str4 = 'xiaomage'; 94     //             console.log(str4.toUpperCase()); 95     // 數字轉換字符串 96     //     var num = 132.32522; 97     //     var numStr = num.toString(); 98     //     console.log(typeof numStr);//string 99     // 四捨五入100     //     var newNum = num.toFixed(2);101     //     console.log(newNum);102 103     // #####################data日期對象##############################104     var mydate=new Date();105     console.log(mydate); //Tue Jul 10 2018 15:58:05 GMT+0800 (中國標準時間)106     console.log(mydate.getDate());//獲取當前日期具體是哪天107     //返回本地時間108             console.log(mydate.toLocaleDateString());//2018/7/10109     console.log(mydate.getFullYear());//只獲取年份110     console.log(mydate.getMonth()+1);//獲取當前月份，必須加1111 112     // ################math內置對象##############113     //  Math.ceil() 向上取整，'天花板函數'114             var x = 1.234;115             //天花板函數  表示大於等於 x，而且與它最接近的整數是2116             var a = Math.ceil(x);117             console.log(a);//2118     // Math.floor 向下取整，'地板函數'119             var y = 1.234;120             // 小於等於 x，而且與它最接近的整數 1121             var b = Math.floor(y);122             console.log(b);//1123     // 求兩個數的最大值和最小值124             console.log(Math.max(2,5));//5125             console.log(Math.min(2,5));//2126     // 隨機數 Math.random()127             var ran = Math.random();128             console.log(ran);//0.3176434165181341129     // 求100-200之間的隨機數130              //min+Math.random()*(max-min)公式背過131             console.log(Math.floor(100+Math.random()*(100)));132 133 134 </script>135 136 137 </body>138 </html>

View Codehtm

四運算符對象

賦值運算符blog

算數運算符排序

比較運算符索引

實例：

 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4     <meta charset="UTF-8"> 5     <title>運算符</title> 6 </head> 7 <body> 8 <script> 9     // 賦值運算符10     // var x=12;11     // var y=5;12     // // x+=y;13     // // x=x+y;14     // x=x*y;15     // console.log(x)16     // 算數運算符17     // var a=5,b=2;18     // var c =a+b;19     // console.log(c)20     // var x=a++;21     // console.log(x);//522     // console.log(a);//623     // var d=a--;24     // console.log(d);//525     // console.log(a);//426     // 比較運算符27     // var x=5;28     // console.log(x==='5');//false29     // var a1='1';30     // var a2='2';31     // console.log(a1+a2);//1232     // var n1=133;33     // var str1=String(n1);34     // console.log(typeof str1);//字符串35     var  stringNum = '1233.33yudasdiusaudsaugd';36     var num2=Number(stringNum);37     console.log(num2);//NaN38     console.log(parseInt(stringNum));//123339     console.log(parseFloat(stringNum));//1233.3340 41 42 43 44 45 46 </script>47 48 </body>49 </html>

View Code

五流程控制

實例：

  1 <!DOCTYPE html>  2 <html lang="en">  3 <head>  4     <meta charset="UTF-8">  5     <title>流程控制</title>  6 </head>  7 <body>  8 <script>  9 //     判斷語句 10 //     var ji=20; 11 //     if(ji>20){ 12 //         console.log('吃雞成功') 13 //     } 14 //     else if(ji=20){ 15 //         console.log('差一點吃到') 16 //     } 17 //     else{ 18 //         console.log('吃雞失敗') 19 //     } 20 //     邏輯與和邏輯或 21 //     sum=300; 22 //     math=99; 23 //     // &&兩個條件都要知足 24 //     if(sum>400 && math>90){ 25 //         console.log('錄取成功') 26 //     } 27 //     else{ 28 //         console.log('高考失利') 29 //     } 30 //     // ||或只知足一個條件便可 31 // 32 //     if(sum>400 ||math>90){ 33 //         console.log('錄取成功') 34 //     } 35 //     else{ 36 //         console.log('高考失利') 37 //     } 38 //     switch語法 39 //     var gameScore = 'good'; 40 // 41 //     switch(gameScore){ 42 // 43 //     //case表示一個條件 知足這個條件就會走進來 遇到break跳出。break終止循環。若是某個條件中不寫 break， 44 //     // 那麼直到該程序遇到下一個break中止 45 //         case 'good': 46 //         console.log('玩的很好'); 47 //         //break表示退出 48 //         break; 49 //         case  'better': 50 //         console.log('玩的老牛逼了'); 51 //         break; 52 //         case 'best': 53 //         console.log('恭喜你 吃雞成功'); 54 //         break; 55 // 56 //         default: 57 //         console.log('很遺憾'); 58 // 59 // } 60 //     while循環 61 //     var i =1; 62 //     while(i<=9){ 63 //         console.log(i); 64 //         i=i+1; 65 //     } 66 //     打印出1-100內的偶數 67 //     var a=0; 68 //     while (a<100){ 69 //         a=a+1; 70 //         if (a%2==0){ 71 //             console.log(a); 72 //         } 73 //     } 74 //     do while語法 無論有沒有知足while中的條件do裏面的代碼都會走一次 75 //     var i=13; 76 //     do{ 77 //         console.log(i); 78 //         i++ 79 //     }while (i<10) 80 // 81 //     for 循環 82 //     for (var i=1;i<10;i++){ 83 //         console.log(i) 84 //     } 85 //     for (var i=1;i<100;i++){ 86 //         if (i%2==0){ 87 //             console.log(i) 88 //             document.write(i) 89 //         } 90 //         document.write('<br>') 91 //     } 92 //     #求1-100直接的之和 93 //     var sum=0; 94 //     for (var j=1;j<=100;j++){ 95 //         sum=sum+j; 96 //     } 97 //     console.log(sum) 98 // 99 //     雙重for循環100 //     for(var i=1;i<=3;i++){101 //         for (var j=0;j<6;j++){102 //             document.write('*')103 //         }104 //         document.write('<br>')105 //     }106 </script>107 108 109 </body>110 </html>

View Code

六函數和僞數組arguments

 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4     <meta charset="UTF-8"> 5     <title>函數</title> 6 </head> 7 <body> 8 <script> 9     sayHello();     //調用函數 .js調用的時候順序能夠隨便寫10     //定義函數：11     function sayHello(){12         console.log("hello world");13     }14 15     // 函數的形參和實參16     //         sum(3,4);//717     //         sum("3",4);//3418     //         sum("Hello","World");//helloworld19     //20     //         //函數：求和21     //         function sum(a, b) {22     //             console.log(a + b);23     //         }24     // 函數的返回值25     //         function sum(a,b) {26     //             return a+b;27     //         }28     //         console.log(sum(3,0));29     //#########僞數組arguments############30         //     arguments表明的是實參。有個講究的地方是：arguments只在函數中使用。31         // （1）返回函數實參的個數：arguments.length32         //     fn(2,4);33         //     fn(2,4,6);34         //     fn(2,4,6,8);35         //36         //     function fn(a,b,c) {37         //         // console.log(arguments);38         //         console.log(fn.length);         //獲取形參的個數39         //         console.log(arguments.length);  //獲取實參的個數40         //41         //         console.log("----------------");42         //     }43 44     // arguments能夠修改元素，但不能改變數組的長短45     //             fn(2,4);46     //             fn(2,4,6);47     //             fn(2,4,6,8);48     //49     //             function fn(a,b) {50     //                 console.log(arguments)51     //                 arguments[0] = 99;  //將實參的第一個數改成9952     //                 // arguments.push(8);  //此方法不經過，由於沒法增長元素53     //             }54 55     // 清空數組的幾種方式56     //         var array = [1,2,3,4,5,6];57     //         console.log(array);58     //59     //         // array.splice(0);      //方式1：刪除數組中全部項目60     //         // array.length = 0;     //方式1：length屬性能夠賦值，在其它語言中length是隻讀61     //          array = [];           //方式3：推薦62 63     // function add() {64     //     console.log(arguments);65     //     for(var i=0; i<arguments.length;i++){66     //         console.log(arguments[i]);67     //     }68     // }69     // add('1',2,3);70     console.log(window);71         console.log(document);72         console.log(document.documentElement);73         console.log(document.body);74 75 </script>76 77 </body>78 </html>

View Code

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。