12-2 js基础
Posted 滴水可以穿石
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了12-2 js基础相关的知识，希望对你有一定的参考价值。
一 数据类型
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 //string 13 var b=\'123\'; 14 console.log(typeof b); 15 //boolean 16 var c=false; 17 console.log(typeof c); 18 //null 19 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>
二 数据类型转换
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);//number 34 console.log(typeof b5);//mumber 35 console.log(typeof b7);//object 36 console.log(Boolean(b7));//false 37 38 console.log(Boolean(b4));//true 39 //下面三个都是为false 40 var b5 = NaN; 41 42 var b6; //undefined 43 var b7 = null; 44 45 46 </script> 47 48 </body> 49 </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 //---------- 数组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/10 109 console.log(mydate.getFullYear());//只获取年份 110 console.log(mydate.getMonth()+1);//获取当前月份，必须加1 111 112 // ################math内置对象############## 113 // Math.ceil() 向上取整，\'天花板函数\' 114 var x = 1.234; 115 //天花板函数 表示大于等于 x，并且与它最接近的整数是2 116 var a = Math.ceil(x); 117 console.log(a);//2 118 // Math.floor 向下取整，\'地板函数\' 119 var y = 1.234; 120 // 小于等于 x，并且与它最接近的整数 1 121 var b = Math.floor(y); 122 console.log(b);//1 123 // 求两个数的最大值和最小值 124 console.log(Math.max(2,5));//5 125 console.log(Math.min(2,5));//2 126 // 随机数 Math.random() 127 var ran = Math.random(); 128 console.log(ran);//0.3176434165181341 129 // 求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>
四运算符
赋值运算符
算数运算符
比较运算符
实例：
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);//5 22 // console.log(a);//6 23 // var d=a--; 24 // console.log(d);//5 25 // console.log(a);//4 26 // 比较运算符 27 // var x=5; 28 // console.log(x===\'5\');//false 29 // var a1=\'1\'; 30 // var a2=\'2\'; 31 // console.log(a1+a2);//12 32 // 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);//NaN 38 console.log(parseInt(stringNum));//1233 39 console.log(parseFloat(stringNum));//1233.33 40 41 42 43 44 45 46 </script> 47 48 </body> 49 </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 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>
六 函数和伪数组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,以上是关于12-2 js基础的主要内容，如果未能解决你的问题，请参考以下文章