2018-01-26 15:18:56 +08:00
|
|
|
|
|
|
|
|
|
|
2018-02-02 16:02:40 +08:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
## 内置对象String
|
|
|
|
|
|
|
|
|
|
### 简单数据类型、复杂数据类型
|
|
|
|
|
|
|
|
|
|
**1、简单数据类型:**
|
|
|
|
|
|
|
|
|
|
注意,之前学习的简单数据类型`string`是**无法绑定属性和方法**的。比如说:
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
var str = "smyhvae";
|
|
|
|
|
|
|
|
|
|
str.aaa = 12;
|
|
|
|
|
console.log(typeof str); //打印结果为:string
|
|
|
|
|
console.log(str.aaa); //打印结果为:undefined
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
上方代码中,当我们尝试打印`str.aaa`的时候,会发现打印结果为:undefined。
|
|
|
|
|
|
|
|
|
|
当然,我们可以打印str.length、srt.indexOf("m")等等。因为这两个方法的底层做了数据类型转换。
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
**2、复杂数据类型:**
|
|
|
|
|
|
|
|
|
|
复杂数据类型`String`是可以绑定属性和方法的。如下:
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
var strObj = new String("smyhvae");
|
|
|
|
|
strObj.aaa = 123;
|
|
|
|
|
console.log(strObj);
|
|
|
|
|
console.log(typeof strObj); //打印结果:Object
|
|
|
|
|
console.log(strObj.aaa);
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
打印结果:
|
|
|
|
|
|
2018-04-26 22:36:33 +08:00
|
|
|
|
![](http://img.smyhvae.com/20180202_1351.png)
|
2018-02-02 16:02:40 +08:00
|
|
|
|
|
|
|
|
|
```
|
2018-01-26 15:18:56 +08:00
|
|
|
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
2018-02-02 16:02:40 +08:00
|
|
|
|
同理,内置对象Number也有一些自带的方法,比如:
|
2018-01-26 15:18:56 +08:00
|
|
|
|
|
2018-02-02 16:02:40 +08:00
|
|
|
|
- Number.MAX_VALUE;
|
2018-01-26 15:18:56 +08:00
|
|
|
|
|
2018-02-02 16:02:40 +08:00
|
|
|
|
- Number.MIN_VALUE;
|
|
|
|
|
|
|
|
|
|
内置对象Boolean也有一些自带的方法,但是用的不多。
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
下面讲一下内置对象String的常见方法。
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
### charAt/charCodeAt:1.2.1 给索引查字符
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
字符 = Str.charAt(索引值);
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
解释:获取相应位置的字符。
|
|
|
|
|
|
|
|
|
|
字符串中第一个字符的下标是 0。如果参数 index 不在 0 与 string.length 之间,该方法将返回一个空字符串。
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
字符编码 = Str.charCodeAt(索引值);
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
解释: 获取相应位置的Unicode字符编码。
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
举例1:
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
var str = new String("smyhvae");
|
|
|
|
|
|
|
|
|
|
for (var i = 0; i < str.length; i++) {
|
|
|
|
|
console.log(str.charAt(i));
|
|
|
|
|
}
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
打印结果:
|
|
|
|
|
|
2018-04-26 22:36:33 +08:00
|
|
|
|
![](http://img.smyhvae.com/20180202_1401.png)
|
2018-02-02 16:02:40 +08:00
|
|
|
|
|
|
|
|
|
上面这个例子一般不用。一般打印数组和json的时候用索引,打印String不建议用索引。
|
|
|
|
|
|
|
|
|
|
举例2:打印字符串的占位长度
|
|
|
|
|
|
|
|
|
|
提示:一个英文占一个位置,一个中文占两个位置。
|
|
|
|
|
|
|
|
|
|
思路:判断该字符是否在0-127之间(在的话是英文,不在是非英文)。
|
|
|
|
|
|
|
|
|
|
代码实现:
|
|
|
|
|
|
|
|
|
|
```html
|
|
|
|
|
<script>
|
|
|
|
|
// sort(); 底层用到了charCodeAt();
|
|
|
|
|
|
|
|
|
|
var str = "I love my country!我你爱中国!";
|
|
|
|
|
|
|
|
|
|
//需求:求一个字符串占有几个字符位。
|
|
|
|
|
//思路;如果是英文,站一个字符位,如果不是英文占两个字符位。
|
|
|
|
|
//技术点:判断该字符是否在0-127之间。(在的话是英文,不在是非英文)
|
|
|
|
|
alert(getZFWlength(str));
|
|
|
|
|
alert(str.length);
|
|
|
|
|
|
|
|
|
|
//定义方法:字符位
|
|
|
|
|
function getZFWlength(string) {
|
|
|
|
|
//定义一个计数器
|
|
|
|
|
var count = 0;
|
|
|
|
|
for (var i = 0; i < string.length; i++) {
|
|
|
|
|
//对每一位字符串进行判断,如果Unicode编码在0-127,计数器+1;否则+2
|
|
|
|
|
if (string.charCodeAt(i) < 128 && string.charCodeAt(i) >= 0) {
|
|
|
|
|
count++;
|
|
|
|
|
} else {
|
|
|
|
|
count += 2;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
return count;
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
打印结果:
|
|
|
|
|
|
|
|
|
|
```
|
|
|
|
|
30
|
|
|
|
|
24
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
从打印结果可以看出:字符串的长度是24,但是却占了30个字符位(一个中文占两个字符位)。
|
|
|
|
|
|
|
|
|
|
另外,sort()方法其实底层也是用到了charCodeAt(),因为用到了Unicode编码。
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
### indexOf/lastIndexOf:给字符查索引
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
索引值 = str.indexOf/(想要查询的字符);
|
|
|
|
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
解释:从前向后索引字符串的位置。
|
|
|
|
|
|
|
|
|
|
因此可以得出一个技巧:**如果获取的索引值为0,说明字符串是以查询的参数为开头的**。
|
|
|
|
|
|
|
|
|
|
同理,lastIndexOf()是从后向前寻找。
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
var str = "abcdea";
|
|
|
|
|
|
|
|
|
|
//给字符查索引(索引值为0,说明字符串以查询的参数为开头)
|
|
|
|
|
console.log(str.indexOf("c"));
|
|
|
|
|
console.log(str.lastIndexOf("c"));
|
|
|
|
|
|
|
|
|
|
console.log(str.indexOf("a"));
|
|
|
|
|
console.log(str.lastIndexOf("a"));
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
打印结果:
|
|
|
|
|
|
2018-04-26 22:36:33 +08:00
|
|
|
|
![](http://img.smyhvae.com/20180202_1420.png)
|
2018-02-02 16:02:40 +08:00
|
|
|
|
|
|
|
|
|
### concat:字符串的链接
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
新字符串 = str1.concat(str2); 链接两个字符串
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
这种方法基本不用,直接两个字符串相加就好。
|
|
|
|
|
|
|
|
|
|
### 字符串的截取(重要)
|
|
|
|
|
|
|
|
|
|
字符串的截取有好几个方法,下面分别讲解。
|
|
|
|
|
|
|
|
|
|
1、 slice()方法:
|
|
|
|
|
|
|
|
|
|
格式:
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
字符串 = str.slice(索引1,索引2); //两个参数都是索引值。
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
上面的参数,包左不包右。如下:
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
- (2,5) 表示正常,包左不包右。
|
|
|
|
|
|
|
|
|
|
- (2) 表示**从指定的索引位置开始,剪到最后**。
|
|
|
|
|
|
|
|
|
|
- (-3) 表示从倒数第几个开始,剪到最后.
|
|
|
|
|
|
|
|
|
|
- (5,2) 表示前面的大,后面的小,返回值为空。
|
|
|
|
|
|
|
|
|
|
2、substr()方法:
|
|
|
|
|
|
|
|
|
|
格式:
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
字符串 = srt.substr(索引值, 长度);
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
参数解释:
|
|
|
|
|
|
|
|
|
|
- (2,4):从索引值为2的字符开始,截取4个字符。
|
|
|
|
|
|
|
|
|
|
- (1):从指定位置开始,截取到最后。
|
|
|
|
|
|
|
|
|
|
- (-3):从倒数第几个开始,剪到最后.
|
|
|
|
|
|
|
|
|
|
- 不包括前大后小的情况。
|
|
|
|
|
|
|
|
|
|
### 一些特殊方法
|
|
|
|
|
|
|
|
|
|
**1、trim()**:去除字符串前后的空白。
|
|
|
|
|
|
|
|
|
|
代码举例:
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
//去除前后的空格,trim();
|
|
|
|
|
var str1 = " a b c ";
|
|
|
|
|
console.log(str1);
|
|
|
|
|
console.log(str1.trim());
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
打印结果:
|
|
|
|
|
|
2018-04-26 22:36:33 +08:00
|
|
|
|
![](http://img.smyhvae.com/20180202_1455.png)
|
2018-02-02 16:02:40 +08:00
|
|
|
|
|
|
|
|
|
2、**replace()**:替换。
|
|
|
|
|
|
|
|
|
|
举例:
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
//replace()方法:替换
|
|
|
|
|
var str2 = "Today is fine day,today is fine day !!!"
|
|
|
|
|
console.log(str2);
|
|
|
|
|
console.log(str2.replace("today","tomorrow")); //只能替换第一个today
|
|
|
|
|
console.log(str2.replace(/today/gi,"tomorrow")); //这里用到了正则,才能替换所有的today
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
3、split():字符串变数组。
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
//split()方法:字符串变数组
|
|
|
|
|
var str3 = "生命壹号|许嵩|smyhvae";
|
|
|
|
|
|
|
|
|
|
console.log(str3);
|
|
|
|
|
console.log(str3.split()); // 无参数,表示:把字符串作为一个元素添加到数组中。
|
|
|
|
|
console.log(str3.split("")); //参数为空字符串,则表示:分隔字符串中每一个字符,分别添加到数组中
|
|
|
|
|
console.log(str3.split("|")); //参数为指定字符,表示:此字符将不会出现在数组的任意一个元素中
|
|
|
|
|
console.log(str3.split("许")); //同理
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
打印结果:
|
|
|
|
|
|
2018-04-26 22:36:33 +08:00
|
|
|
|
![](http://img.smyhvae.com/20180202_1503.png)
|
2018-02-02 16:02:40 +08:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
### 大小写转换
|
|
|
|
|
|
|
|
|
|
举例:
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
var str = "abcdEFG";
|
|
|
|
|
|
|
|
|
|
//转换成小写
|
|
|
|
|
console.log(str.toLowerCase());
|
|
|
|
|
//转换成大写
|
|
|
|
|
console.log(str.toUpperCase());
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
## html方法
|
|
|
|
|
|
|
|
|
|
- anchor() 创建a链接
|
|
|
|
|
|
|
|
|
|
- big()
|
|
|
|
|
|
|
|
|
|
- sub()
|
|
|
|
|
|
|
|
|
|
- sup()
|
|
|
|
|
|
|
|
|
|
- link()
|
|
|
|
|
|
|
|
|
|
- bold()
|
|
|
|
|
|
|
|
|
|
注意,str.link() 返回值是字符串。
|
|
|
|
|
|
|
|
|
|
举例:
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
var str = "你好";
|
|
|
|
|
|
|
|
|
|
console.log(str.anchor())
|
|
|
|
|
console.log(str.big())
|
|
|
|
|
console.log(str.sub())
|
|
|
|
|
console.log(str.sup())
|
|
|
|
|
console.log(str.link("http://www.baidu.com"));
|
|
|
|
|
console.log(str.bold())
|
|
|
|
|
```
|
|
|
|
|
|
2018-04-26 22:36:33 +08:00
|
|
|
|
![](http://img.smyhvae.com/20180202_1536.png)
|
2018-02-02 16:02:40 +08:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
## 字符串练习
|
|
|
|
|
|
|
|
|
|
**练习1:**"smyhvaevaesmyh"查找字符串中所有m出现的位置。
|
|
|
|
|
|
|
|
|
|
代码实现:
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
var str2 = "abcoefoxyozzopp";
|
|
|
|
|
for(var i=0;i<str2.length;i++){
|
|
|
|
|
//如果指定位置的符号=== "o"
|
|
|
|
|
//str2[i]
|
|
|
|
|
if( str2.charAt(i)==="o"){
|
|
|
|
|
console.log(i);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
**练习2:**判断一个字符串中出现次数最多的字符,统计这个次数
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
```html
|
|
|
|
|
<script>
|
|
|
|
|
var str2 = "smyhvaevaesmyhvae";
|
|
|
|
|
|
|
|
|
|
//定义一个json,然后判断json中是够有该属性,如果有该属性,那么值+1;否则创建一个该属性,并赋值为1;
|
|
|
|
|
var json = {};
|
|
|
|
|
for (var i = 0; i < str2.length; i++) {
|
|
|
|
|
//判断:如果有该属性,那么值+1;否则创建一个该属性,并赋值为1;
|
|
|
|
|
var key = str2.charAt(i);
|
|
|
|
|
if (json[key] === undefined) {
|
|
|
|
|
json[key] = 1;
|
|
|
|
|
} else {
|
|
|
|
|
json[key] += 1;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
console.log(json);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
console.log("----------------");
|
|
|
|
|
//获取json中属性值最大的选项
|
|
|
|
|
var maxKey = "";
|
|
|
|
|
var maxValue = 0;
|
|
|
|
|
for (var k in json) {
|
|
|
|
|
// if(maxKey == ""){
|
|
|
|
|
// maxKey = k;
|
|
|
|
|
// maxValue = json[k];
|
|
|
|
|
// }else{
|
|
|
|
|
if (json[k] > maxValue) {
|
|
|
|
|
maxKey = k;
|
|
|
|
|
maxValue = json[k];
|
|
|
|
|
}
|
|
|
|
|
// }
|
|
|
|
|
}
|
|
|
|
|
console.log(maxKey);
|
|
|
|
|
console.log(maxValue);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</script>
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
打印结果:
|
|
|
|
|
|
2018-04-26 22:36:33 +08:00
|
|
|
|
![](http://img.smyhvae.com/20180202_1540.png)
|
2018-02-02 16:02:40 +08:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
## 内置对象 Math
|
|
|
|
|
|
|
|
|
|
内置对象 Math的常见方法:
|
|
|
|
|
|
|
|
|
|
- Math.abs(); **取绝对值**
|
|
|
|
|
|
|
|
|
|
- Math.floor(); **向下取整**(向小取)
|
|
|
|
|
|
|
|
|
|
- Math.ceil(); **向上取整**(向大取)
|
|
|
|
|
|
|
|
|
|
- Math.round(); 四舍五入取整(正数四舍五入,负数五舍六入)
|
|
|
|
|
|
|
|
|
|
- Math.random(); 随机数0-1
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
举例:
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
var num = -0.6;
|
|
|
|
|
|
|
|
|
|
console.log(Math.abs(num)); //取绝对值
|
|
|
|
|
console.log(Math.floor(num)); //向下取整,向小取
|
|
|
|
|
console.log(Math.ceil(num)); //向上取整,向大取
|
|
|
|
|
console.log(Math.round(num)); //四舍五入取整(正数四舍五入,负数五舍六入)
|
|
|
|
|
console.log(Math.random()); //随机数 0-1
|
|
|
|
|
```
|
|
|
|
|
|
2018-04-26 22:36:33 +08:00
|
|
|
|
![](http://img.smyhvae.com/20180202_1601.png)
|
2018-02-02 16:02:40 +08:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
## url 编码和解码
|
|
|
|
|
|
|
|
|
|
URI (Uniform ResourceIdentifiers,通用资源标识符)进行编码,以便发送给浏览器。有效的URI中不能包含某些字符,例如空格。而这URI编码方法就可以对URI进行编码,它们用特殊的UTF-8编码替换所有无效的字符,从而让浏览器能够接受和理解。
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
encodeURIComponent(); //把字符串作为 URI 组件进行编码
|
|
|
|
|
decodeURIComponent(); //把字符串作为 URI 组件进行解码
|
|
|
|
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
举例:
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
var url = "http://www.cnblogs.com/smyhvae/";
|
|
|
|
|
|
|
|
|
|
var str = encodeURIComponent(url);
|
|
|
|
|
console.log(str); //打印url的编码
|
|
|
|
|
console.log(decodeURIComponent(str)); //对url进行编码后,再解码,还原为url
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
打印结果:
|
2018-01-26 15:18:56 +08:00
|
|
|
|
|
2018-04-26 22:36:33 +08:00
|
|
|
|
![](http://img.smyhvae.com/20180202_1432.png)
|
2018-01-26 15:18:56 +08:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|