05 数组&字符串-CSDN博客

数组&字符串

  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>