数组对象
数组类型检测
代码示例:
// 数组类型检测
var arr = ['red'] // 创建数组
var obj = { '颜色': 'red' } // 创建对象
console.log(arr instanceof Array); // 判断 arr 是否是 Array 数组
console.log(obj instanceof Object); // 判断 obj 是否是 Object 对象
运行结果:
数组对象常用方法:
数组的添加、删除
代码示例:
/*
push() 方法
在数组末尾添加一个或多个元素
返回值:添加元素后的数组长度
*/
var arrlen = arr.push('yellow');
console.log(arrlen);
/*
unshift() 方法
在数组开头添加一个或多个元素
返回值:添加元素后的数组长度
*/
var arrlen = arr.unshift('颜色:');
console.log(arrlen);
/*
pop() 方法
删除数组的最后一个元素
返回值:被删除的元素
注意:若数组为空,则返回undefined
*/
var arrpop = arr.pop();
console.log(arrpop);
/*
shift() 方法
删除数组的第一个元素
返回值:被删除的元素
注意:若数组为空,则返回undefined
*/
var arrpop = arr.shift();
console.log(arrpop);
/*
案例:筛选数组
要求在包含工资的数组中,剔除工资达到2000或以上的数据,
把小于2000的数放到新的数组,数组:[1500,1200,2000,2100,1800]
*/
var arr = [1500, 1200, 2000, 2100, 1800];
var newArr = []
for (var i = 0; i < arr.length; i++) {
if (arr[i] < 2000) {
newArr.push(arr[i]); // 相当于:newArr[newArr.length] = arr[i];
}
} console.log(newArr);
运行结果:
数组排序
代码示例:
// 数组排序
/*
reverse() 方法
颠倒数组中元素的位置
返回值:颠倒位置后的数组
*/
var arr = [1, 56, 99, 5, 45, 63, 27];
console.log("原数组:" + arr);
arr.reverse(); // 反转数组
console.log("反转后的数组:" + arr);
/*
sort() 方法
对数组的元素进行排序
返回值:颠倒位置后的数组
*/
arr.sort();
console.log("arr.sort()默认排序后:" + arr);
// a-b 升序
arr.sort(function (a, b) {
return a - b;
});
console.log("arr.sort(function(a,b){return a-b;}) 升序排序后:" + arr);
// b-a 降序
arr.sort(function (a, b) {
return b - a;
});
console.log("arr.sort(function(a,b){return a-b;}) 降序排序后:" + arr);
运行结果:
数组索引
代码示例:
// 数组索引
/*
indexOf() 方法
参数1:要查找的元素
参数2:开始查找的下标位置
*注意*:如果是负值,则从索引-1开始查找到参数2指定的负值位置
找到指定的元素
返回值:找到的第一个元素的下标
*/
var arr = [1, 2, 3, 4, 5];
console.log(arr.indexOf(2));
console.log(arr.indexOf(2, -5));
/*
lastIndexOf() 方法
参数1:要查找的元素
参数2:开始查找的下标位置
找到指定的元素最后一个的下标
返回值:找到的第一个元素的下标
*/
var arr = [1, 2, 3, 4, 5];
console.log(arr.lastIndexOf(2));
console.log(arr.lastIndexOf(2, -1));
/*
案例:数组去除重复元素
*/
function unique(arr) {
var newArr = [];
for (var i = 0; i < arr.length; i++) {
if (newArr.indexOf(arr[i]) === -1) {
newArr.push(arr[i]);
}
}
return newArr;
}
var demo = unique([1, 2, 1]);
console.log(demo);
运行结果:
数组转换为字符串
代码示例:
// 数组转换为字符串
/*
toString() 方法
把数组转换为字符串,逗号分隔每一项
返回值:生成后的字符串
*/
var arr = [1, 2, 3];
console.log(arr.toString());
/*
join('分隔符') 方法
把数组转换为字符串,逗号分隔每一项
返回值:生成后的字符串
*/
var arr = [1, 2, 3];
console.log("默认逗号分隔arr.join():" + arr.join());
console.log("不用分隔符arr.join(''):" + arr.join(''));
console.log("用-分隔arr.join('-'):" + arr.join('-'));
运行结果:
其他方法
代码示例:
/*
fill(value,start,end) 方法
用一个固定值填充数组中指定下表范围内的全部元素,返回修改后的数组
参数:
value 用于填充的字符
start 开始填充的索引
end 结束填充的索引 (替换范围不包含end)
*/
// 定义数组
var arr = [1, 2, 3, 4, 5]
// fill(value)
console.log("fill(value)填充前:" + arr);
arr.fill('*')
console.log("fill('*')填充后:" + arr);
// fill(value,start)
console.log("fill(value,start)填充前:" + arr);
arr.fill('*', 2)
console.log("fill('*', 2)填充后:" + arr);
// fill(value,start,end)
console.log("fill(value,start,end)填充前:" + arr);
arr.fill('*', 2, 4)
console.log("fill('*', 2, 4)填充后:" + arr);
/*
splice(start,deleteCount,item1,...,itemN) 方法
数组删除元素,返回修改后的新数组
参数:
start:第几个开始
deleteCount:要删除的个数
item1,...,itemN:要添加进数组的元素
*/
// 定义数组
var arr = [1, 2, 3, 4, 5]
// splice(start)
console.log("splice(start)删除前:"+arr);
arr.splice(2);
console.log("splice(2)删除后:"+arr);
// splice(start, deleteCount)
console.log("splice(start, deleteCount)删除前:"+arr);
arr.splice(2,1);
console.log("splice(2, 1)删除后:"+arr);
// splice(start, deleteCount, item1)
console.log("splice(start, deleteCount, item1)删除前:"+arr);
arr.splice(2,1,6);
console.log("splice(2, 1, 6)删除后:"+arr);
// splice(start, deleteCount, item1, item2, itemN)
console.log("splice(start, deleteCount, item1, item2, itemN)删除前:"+arr);
arr.splice(2,1,6,7);
console.log("splice(2, 1, 6, 7)删除后:"+arr);
/*
slice(start, end) 方法
数组截取,返回被截取项目的新数组
参数:
start:开始截取处的索引
end:提取终止处的索引
注意:截取元素不包括end
*/
// 定义数组
var arr = [1, 2, 3, 4, 5]
// slice()
console.log("slice()截取全部元素:"+arr.slice());
// slice(start)
console.log("slice(start)截取前:"+arr);
console.log("slice(2)截取后:"+arr.slice(2));
// slice(start, end) 不包括end
console.log("slice(start)截取前:"+arr);
console.log("slice(2,4)截取后:"+arr.slice(2,4));
/*
concat(valueN) 方法
连接两个或多个数组,不影响原数组,返回一个新数组
参数:
valueN:数组
*/
// 定义数组
var arr1= ['a', 'b', 'c'];
var arr2 = ['d', 'e', 'f'];
// concat()
console.log("arr1.concat()后的新数组:"+arr1.concat());
// concat(value0)
console.log("arr1.concat(arr2)后的新数组:"+arr1.concat(arr2));
运行结果:
字符串对象
创建字符串对象
代码示例:
/*
创建字符串对象
*/
var objStr = new String('apple');
console.log(typeof objStr); // object
console.log(objStr.length); // 5
console.log(objStr instanceof String); // true
/*
注意:var str = 'apple';
此时str是字符串类型的数据,而不是字符串对象
*/
var str = 'apple';
console.log(typeof str); // string
console.log(str.length); // 5
console.log(str instanceof String); // false
运行结果:
根据字符返回位置
代码示例:
/*
indexOf(searchString) 方法
获取searchString在字符串中首次出现的位置
参数:
searchString:要查找的字符
*/
var str = 'Hello World';
console.log("str:" + str);
console.log("str.indexOf('W'):" + str.indexOf('W')); // 6
/*
lastIndexOf(searchString) 方法
获取searchString在字符串中最后出现的位置
参数:
searchString:要查找的字符
*/
var str = 'Hello World W';
console.log("str:" + str);
console.log("str.lastIndexOf('W'):" + str.lastIndexOf('W')); // 12
运行结果:
根据位置返回字符
代码示例:
/*
charAt(index) 方法
获取index位置的字符,位置从0开始计算
参数:
index:要查找的索引位置
*/
var str = 'Hello World';
console.log("str:" + str);
console.log("str.charAt(5):" + str.charAt(4)); // O
/*
charCodeAt(index) 方法
获取index位置的字符的ASCII码
参数:
index:要查找的索引位置
*/
var str = 'Hello World';
console.log("str:" + str);
console.log("str.charCodeAt(4):" + str.charCodeAt(4)); // 111
/*
str[index] 方法
获取指定位置的字符
参数:
index:要查找的索引位置
*/
var str = 'Hello World';
console.log("str:" + str);
console.log("str[0]:" + str[0]); // H
/*
案例:统计出现最多的字符和次数
*/
var strNum = 'Apple';
// 创建一个空对象,统计每个字符出现的次数
var obj = {};
for (var i = 0; i < strNum.length; i++) {
var chars = strNum.charAt(i); // 利用chars保存字符串中的每一个字符
// 判断属性有无值
if (obj[chars]) {
obj[chars]++; // 有则自增
} else {
obj[chars] = 1; // 没有赋值为1
}
}
console.log(obj);
var max = 0; // 出现最多的次数
var ch = ''; // 出现最多的字符
for (var k in obj) {
if (obj[k] > max) {
max = obj[k];
ch = k;
}
}
console.log('出现最多的字符是:' + ch + ',共出现了' + max + '次');
运行结果:
字符串操作方法
代码示例:
/*
str.concat(str2, [, ...strN]) 方法
将一个或多个字符串与原字符串连接合并,形成一个新的字符串并返回。
参数:需要连接到 str 的字符串
*/
var str = '123';
var str2 = '456';
console.log("str:" + str + ",str2:" + str2);
console.log("str.concat(str2):" + str.concat(str2));
/*
slice(beginIndex[, endIndex]) 方法
提取某个字符串的一部分,并返回一个新的字符串,且不会改动原字符串。
参数:
beginIndex:开始索引
endIndex:结束索引
*/
var str = '123456789';
// slice(beginIndex)
console.log("str:" + str);
console.log("str.slice(2):" + str.slice(2));
// slice(beginIndex, endIndex) 不包括endIndex
console.log("str:" + str);
console.log("str.slice(2,5):" + str.slice(2, 5));
/*
substring(indexStart[, indexEnd]) 方法
返回一个字符串在开始索引到结束索引之间的一个子集,
或从开始索引直到字符串的末尾的一个子集。
参数:
indexStart:开始索引
indexEnd:结束索引
注意:substring方法参数不接收负值
*/
var str = '123456789';
// substring(indexStart)
console.log("str:" + str);
console.log("str.substring(2):" + str.substring(2));
// substring(indexStart, indexEnd) 不包括indexEnd
console.log("str:" + str);
console.log("str.substring(5,8):" + str.substring(5, 8));
/*
substr(start[, length]) 方法
返回一个字符串中从指定位置开始到指定字符数的字符
参数:
start:开始索引
length:截取长度
mdn警告:尽管 String.prototype.substr(…) 没有严格被废弃 (as in "removed from the Web standards"),
但它被认作是遗留的函数并且可以的话应该避免使用。
它并非 JavaScript 核心语言的一部分,未来将可能会被移除掉。
如果可以的话,使用 substring() 替代它。
*/
var str = '123456789';
// substr(start)
console.log("str:" + str);
console.log("str.substr(2):" + str.substr(2));
// substr(start, length)
console.log("str:" + str);
console.log("str.substr(5,8):" + str.substr(5, 8));
/*
toLowerCase() 方法
会将调用该方法的字符串值转为小写形式,并返回。
*/
var str = 'ABCDEFG';
console.log("str:" + str);
console.log("str.toLowerCase():" + str.toLowerCase());
/*
toUpperCase() 方法
会将调用该方法的字符串值转为小写形式,并返回。
*/
var str = 'abcdefg';
console.log("str:" + str);
console.log("str.toUpperCase():" + str.toUpperCase());
/*
split([separator[, limit]]) 方法
使用指定的分隔符字符串将一个String对象分割成子字符串数组,
以一个指定的分割字串来决定每个拆分的位置。
参数:
separator:分隔符
limit:分割片段数量
mdn警告: 如果使用空字符串 (“) 作为分隔符,则字符串不是在每个用户感知的字符 (图形素集群) 之间,
也不是在每个 Unicode 字符 (代码点) 之间,而是在每个 UTF-16 代码单元之间。这会摧毁代理对。
还请参见how do you get a string to a character array in javascript
*/
var str = "1-2-3-4-5-6";
// split()
console.log("str:" + str);
console.log("str.split()不指定分隔符:" + str.split());
// split(separator)
console.log("str:" + str);
console.log("str.split('-'):" + str.split('-'));
// split(separator, limit)
console.log("str:" + str);
console.log("str.split('-',3):" + str.split('-', 3));
/*
replace(regexp|substr, newSubStr|function) 方法
返回一个由替换值(replacement)替换部分
或所有的模式(pattern)匹配项后的新字符串。
模式可以是一个字符串或者一个正则表达式,
替换值可以是一个字符串或者一个每次匹配都要调用的回调函数。
如果pattern是字符串,则仅替换第一个匹配项。
*/
var str = '123456';
// replace(regexp|substr, newSubStr|function)
console.log("str:" + str);
console.log("str.replace('456','***'):" + str.replace('456', '***'));
/*
案例:判断用户名是否合法
要求:用户名长度在3~10范围内,不允许敏感词admin的任何大小写形式
*/
var name = prompt('请输入用户名:');
if (name.length < 3 || name.length > 10) {
alert('用户名长度必须在3~10范围内。');
} else if (name.toLowerCase().indexOf('admin') != -1) {
alert('用户名中不能包含敏感词:admin');
} else {
alert('恭喜您,用户名可以使用!');
}
运行结果:
字符串处理小练习
代码示例:
/*
小练习:处理url
url = 'https://www.baidu.com/login?name=yezhen&age=20';
输出:{name:zs;age:20}
*/
var url = 'https://www.baidu.com/login?name=yezhen&age=20';
var index = url.indexOf('?');
url = url.substring(index+1);
url = url.replace('=',':');
url = url.replace('&',';');
console.log('{' + url + '}')
运行结果: