数组对象与字符串对象

faker155

已于 2023-04-25 11:33:30 修改

阅读量47

点赞数

文章标签：前端 javascript

于 2023-04-24 12:35:54 首次发布

本文链接：https://blog.csdn.net/2301_76335904/article/details/130331936

版权

数组对象：

数组类型检测

数组类型检测有两种常用的方式，分别是使用
instanceof运算符和使用Array.isArray()方法。
**示例代码：**

var arr = [];
var obj = {};
// 第一种方式
console.log(arr instanceof Array);//输出结果：true
console.log(arr instanceof Array);//输出结果：false
// 第二种方式
console.log(Array.isArray(arr));//输出结果：true
console.log(Array.isArray(obj));//输出结果：false

在上述代码中，如果检测结果为true，表示给定的变量是一个数组，
反之则表示给定的变量不是一个数组。

添加或删除数组元素

JavaScript数组对象提供了添加或删除元素的方法，
可以实现在数组的末尾或开头添加新的数组元素，
或在数组的末尾或开头移出数组元素。
方法如下表：

方法名	功能描述	返回值
push(参数1…)	数组末尾添加一个或多个元素，会修改原数组	返回数组的新长度
unshift(参数1…)	数组开头添加一个或多个元素(把数组长度-1，无参数)，会修改原	返回数组的新长度
pop()	删除数组的最后一个元素，若是空数组则返回undefined，会修改原数组	返回删除的元素的值
shift()	删除数组的第一个元素，若是空数组则返回undefined，会修改原数组	返回第一个元素的值

注意：

push()和unshift()方法的返回值是新数组的长度，
而pop()和shift()方法返回的是移出的数组元素。

示例代码：

// push
var arr = ['pink', 'black', 'white', 'yellow']
console.log(arr.push('red'));// 返回的是数组长度 输出结果为：5
console.log(arr);// 修改了原来的数组 输出结果为['pink', 'black', 'white', 'yellow',
'red']
// unshift
var arr = ['pink', 'black', 'white', 'yellow']
console.log(arr.unshift('red', 'blue'));// 返回的是数组长度 输出结果为：6
console.log(arr);// 修改了原来的数组 输出结果为['red', 'blue', 'pink', 'black',
'white', 'yellow']
// pop
var arr = ['pink', 'black', 'white', 'yellow']
console.log(arr.pop());// 返回的是删除的元素 输出结果为：yellow
console.log(arr);// 修改了原来的数组 输出结果为['pink', 'black', 'white']
// shift
var arr = ['pink', 'black', 'white', 'yellow']
console.log(arr.shift());// 返回的是删除的元素(第一个) 输出结果为：pink
console.log(arr);// 修改了原来的数组 输出结果为['pink', 'black', 'white']

注意：

indexOf和lastIndexOf都区分大小写

根据位置返回字符根据位置返回字符

 字符串对象提供了用于获取字符串中的某一个字符
 的方法。方法如下：

成员	作用
charAt(index)	获取index位置的字符，位置从0开始计算
charCodeAt(index)charCodeAt(index)	获取index位置的字符的ASCII码
str[index]	获取指定位置处的字符（HTML5新增）和charAt等效

示例代码：

var str = 'andy';
// 获取index位置的字符
console.log(str.charAt(0));//输出的结果为；a
// 获取index位置的字符的ASCII码
console.log(str.charCodeAt(0));//输出结果为：97（a的ASCII码是97）
for (var i = 0; i < str.length; i++) {
// 获取指定位置处的字符
console.log(str[i]);
}

案例：统计出现最多的字符和次数

 案例需求：使用charAt()方法通过程序来统计字符串中出多的字符和次数。

for (var i = 0; i < str.length; i++) {
// 3. 利用chars保存字符串中的每一个字符
var chars = str.charAt(i);
console.log(chars);
// 4. 利用对象的属性来方便查找元素
// obj[chars]获取对象的属性的属性值
if (obj[chars] != true) {//如果没有获取到当前字符串，值为undefined（转为布尔值为
false）
obj[chars] = 1;//给当前对象的属性对应的属性值赋值为1
} else {
obj[chars]++; //如果获取到了当前字符串，即对应的属性值+1
}
}
console.log(obj);
// 2. 统计出现最多的字母
var max = 0; // 保存出现次数最大值
var maxStr = ''; // 保存出现次数最多的字符
// 2.1 遍历对象的属性和方法
for (var key in obj) {
// 2.2 将对象中属性的值和max进行比较
if (obj[key] > max) {
max = obj[key];
maxStr = key
}
}
console.log('出现最多的字符是：' + maxStr + ' ，共出现了' + max + '次')

字符串操作方法

字符串对象提供了一些用于截取字符串、连接字符串、替换字符串的
属性和方法。字符串对象的常用属性和方法如下：

方法	作用
concat(str1,str2, str3…)	concat() 方法用于连接两个或多个字符串。拼接字符串，等效于+，+更常用该方法没有改变原有字符串，会返回连接两个或多个字符串新字符串。concat() 方法用于连接两个或多个字符串。拼接字符串，等效于+，+更常用该方法没有改变原有字符串，会返回连接两个或多个字符串新字符串。
slice(start,[end])	截取从start位置到end（不包含end）位置之间的一个子字符串可提取字符串的某个部分，并以新的字符串返回被提取的部分
substring(start[,end])	截取从start位置到end位置之间的一个子字符串，基本和slice相同，但是不接收负值
substr(start[,length])	截取从start位置开始到length长度的子字符串从起始索引号提取字符串中指定数目的字符
toLowerCase()	获取字符串的小写形式
toUpperCase()	获取字符串的大写形式
split([separator[,limit])	使用separator分隔符将字符串分隔成数组，limit用于限制数量separator可选。limit可选。该参数可指定返回的数组的最大长度。如果设置了该参数，返回的子串不会多于这个参数指定的数组。如果没有设置该参数，整个字符串都会被分割，不考虑它的长度。
replace(str1,str2)	使用str2替换字符串中的str1，返回替换结果，只会替换第一个字符

示例代码：

var str = 'HelloWord';
// concat
var res = str.concat('!!');
console.log(res);//HelloWord!!
// slice
var res1 = str.slice(1, 5);
console.log(res1); //ello
// substring
var res2 = str.substring(3);//截取从下标为3开始，之后的内容
console.log(res2);//loWord
var res3 = str.substring(3, 7);//截取从下标为3开始，到7结束的内容（不包含7）
console.log(res3);//loWo
// substr
var res4 = str.substr(2, 5);
console.log(res4);//lloWo
// toLowerCase
var res5 = str.toLocaleLowerCase();
console.log(res5);//helloword
// toUpperCase
var res6 = str.toLocaleUpperCase();
console.log(res6);//HELLOWORD
// split
var str1 = 'How are you doing today?'
var res7 = str1.split(' ');
console.log(res7);// ['How', 'are', 'you', 'doing', 'today?']
var res8 = str1.split();
console.log(res8);//['How are you doing today?']
var res9 = str1.split(' ', 3);
console.log(res9);// ['How', 'are', 'you']
// replace
var res10 = str1.replace(' ', ',');
console.log(res10);//How,are you doing today?

值类型与引用类型

 在JavaScript中，简单数据类型（如字符串型、数字型、布尔型、undefined、null）又称为值类型，
 在存储时，变量中存储的是值本身，因此叫做值类型。复杂数据类型（对象）又称为引用类型。
 引用类型的特点是，变量中保存的仅仅是一个引用的地址，当对变量进行赋值时，
 并不是将对象复制了一份，而是将两个变量指向了同一个对象的引用。

示例代码：

字符串的不可变指的是里面的值不可变，看上去可以改变内容，其实是地址变了，新开辟了一个
内存空间

var str = 'abc';
str = 'hello';
// 当重新给str赋值的时候，常量'abc'不会被修改，依然在内存中
// 重新给字符串赋值，会重新在内存中开辟空间，这个特点就是字符串的不可变
// 由于字符串的不可变，在大量拼接字符串的时候会有效率问题
var str = '';
for (var i = 0; i < 100000; i++) {
str += i;
}
console.log(str); // 这个结果需要花费大量时间 来 显示 因为需要不断的开辟新的空间

练习：

var url = 'http://www.martinhan.com/login?name=zs&age=18';最后的输出结果为{name:zs;age:18}

var url = 'http://www.martinhan.com/login?name=zs&age=18';
        var u = url.substr(31);
        console.log(u);
        var q = u.replace('=',':');
        var w = q.replace('&',';');
        var e = w.replace('=',':');
        console.log(e);//name:zs;age:18