05 数组&字符串
数组&字符串
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta http-equiv="X-U-Compatible" content="IE-edge"> 6 <meta name="viewport" content="width=device-width,initial-scale=1"> 7 <title>数组&字符串</title> 8 </head> 9 <body> 10 <h1>数组</h1> 11 <script type="text/javascript"> 12 // 字面量方式创建(推荐大家使用这种方式,简单粗暴) 13 var colors = ['red','green','yellow']; 14 15 // 使用new关键词对构造函数进行创建对象,构造函数与后面的面向对象有关系 16 var colors2 = new Array(); 17 console.log(typeof colors2); 18 19 // 数组赋值 20 colors2[0] = 'red'; 21 colors2[1] = 'green'; 22 colors2[2] = 'yellow'; 23 for(var i = 0;i < colors2.length;i ++){ 24 console.log(colors2[i]); // 通过索引取值 25 } 26 27 // 数组方法 28 // 数组合并 concat() 29 var ali = ['clothes','packets','shooes']; 30 var jd = ['camera','watches','computer']; 31 var all = ali.concat(jd); 32 console.log(all); 33 34 // join() 将数组中元素使用指定的字符串连接起来,它会形成一个新的字符串 35 console.log(ali.join('&')); 36 37 // slice(start,end); 返回数组的一段记录,顾头不顾尾 38 console.log(all.slice(1,2)); 39 40 // 将数组转换成字符串 toString() 41 console.log(all.toString()); // 等同于 console.log(ali.join(',')); 42 43 // pop 删除数组的最后一个元素并返回删除的元素 44 var tmp = ali.pop(); // pop 是有返回值的,等于把最后一个元素取出来。 45 console.log(tmp,' | ',ali); 46 47 // push() 向数组末尾添加一个元素或多个元素,并返回新的长度 48 console.log(ali.length); // 2 49 var newArrayLength = ali.push('hats'); 50 console.log(newArrayLength); // 3 51 console.log(ali[ali.length - 1]); // hats 52 53 // reverse() 翻转数组 54 console.log(ali.join('->')); 55 ali.reverse(); 56 console.log(ali.join('->')); 57 58 // sort对数组排序 59 var tmpArray = [8,9,5,'b','g']; 60 var newArray = ali.concat(tmpArray); 61 console.log('排序前 ',newArray.join('->')); 62 newArray.sort(); 63 console.log('排序后 ',newArray.join('->')); 64 65 // shift() 删除并返回数组的第一个元素 66 console.log('原数组 ',jd.join('|')); 67 var firstElement = jd.shift(); 68 console.log('第一个元素 ',firstElement); 69 console.log('shift后 ',jd.join('|')); 70 71 // unshift() 向数组的开头添加一个或更多元素,并返回新的长度 72 console.log('unshift之前的数组长度 ',jd.length); 73 var afterArrayLength = jd.unshift('newElement'); 74 console.log('unshift之后的数组长度 ',afterArrayLength); 75 console.log('unshift之后的数组 ',jd.join('|')); 76 77 // 判断是否为数组:isArray() 78 console.log(Array.isArray(ali)); // rtue 79 var str = 'abcd'; 80 console.log(Array.isArray(str)); // false 81 82 // 清空数组的几个方式 83 ali.length = 0; // 其他语言里只读 js里可以修改、指定 84 ali = []; 85 </script> 86 87 <h1>字符串</h1> 88 <script type="text/javascript"> 89 var str = 'Hello World!'; 90 var strTmp = 'How do you do ?'; 91 // charAt() 返回指定索引的位置的字符 92 console.log(str.charAt(1)); 93 console.log(str.charAt(str.length-1)); 94 95 // concat 返回字符串值,表示两个或多个字符串的拼接 96 var newStr = str.concat(strTmp); 97 console.log(str); // 原字符串不会改变 98 console.log(newStr); 99 100 // replace(a,b) 将字符串a替换成字符串b 注意a是一个正则表达式,如果a没有指定全局替换,只会替换第一个匹配到的字符串 101 var NewReplacePart = str.replace(/o/,'*'); 102 console.log(str); // 原字符串不会改变 103 console.log(NewReplacePart); // Hell* World! 注意 这里只有第一个字符串被替换 104 var NewReplaceAll = str.replace(/l/g,'*'); 105 console.log(NewReplaceAll); // He**o Wor*d! 因为指定了全局是,所以全部替换了 106 107 // indexOf() 查找字符的下标,如果找到返回字符串的下标,找不到则返回-1 。跟seach()方法用法一样 108 console.log(str.indexOf('H')); // 0 109 console.log(str.indexOf('World')); // 6 返回匹配到的第一个字符的位置 110 console.log(str.indexOf('X')); // 当找不到的时候返回 -1 111 112 // slice(start,end) 提取一个字符串的一部分,并返回一新的字符串。左闭右开 分割字符串 113 console.log(str.slice(0,2)); // He 这里得到的是一个新的字符串 原str不会变化 114 console.log(str); // 不变, 115 116 // split('a',1) 以字符串a分割字符串,并返回新的数组。如果第二个参数没写,表示返回整个数组,如果定义了个数,则返回数组的最大长度 117 var arr = strTmp.split(' '); // 空格分割字符串 返回整个数组 118 console.log(arr); // ["How", "do", "you", "do", "?"] 119 var arr2 = strTmp.split(' ',2); // 空格分割字符串 只取分割到的前两个元素 120 console.log(arr2); // ["How", "do"] 121 122 // substr(start,length) 返回一个字符串中从指定位置开始到指定字符数的字符。 123 console.log(str.substr(6,1)); // W 124 125 // toLowerCase()转小写 126 console.log(str.toLowerCase()); // hello world! 127 128 // toUpperCase()转大写 129 console.log(str.toUpperCase()); 130 131 // substring(indexStart,indexEnd) 提取字符串中介于两个指定下标之间的字符。返回的子串包括 开始 处的字符,但不包括 结束 处的字符 132 //如果 indexStart 等于 indexEnd,substring 返回一个空字符串。 133 //如果省略 indexEnd,substring 提取字符一直到字符串末尾。 134 //如果任一参数小于 0 或为 NaN,则被当作 0。 135 //如果任一参数大于 stringName.length,则被当作 stringName.length。 136 //如果 indexStart 大于 indexEnd,则 substring 的执行效果就像两个参数调换了一样 137 console.log(str.substring(0,2)); // He 138 139 // trim() 去除字符串两边的空白 140 var str3 = ' I love you!!! '; 141 console.log(str3); 142 console.log(str3.trim()); 143 144 // 将number类型转换成字符串类型 145 var num = 132.32522; 146 var numStr = num.toString(); 147 console.log(typeof numStr); 148 149 // 四舍五入 150 var newNum = num.toFixed(2); 151 console.log(newNum); 152 </script> 153 </body> 154 </html>
夕闻道不如朝闻道