首页 / JAVASCRIPT / 12-2 js基础
12-2 js基础
内容导读
互联网集市收集整理的这篇技术教程文章主要介绍了12-2 js基础，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含13739字，纯文字阅读大概需要20分钟。
内容图文
一 数据类型
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
二 数据类型转换
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 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 //---------- 数组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 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 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
内容总结
以上是互联网集市为您收集整理的12-2 js基础全部内容，希望文章能够帮你解决12-2 js基础所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。
内容备注
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。
内容手机端
扫描二维码推送至手机访问。
来源：【匿名】