当前位置 : 主页 > 编程语言 > 其它开发 >

JavaScript字符串和数组基础api

来源:互联网 收集:自由互联 发布时间:2022-07-12
字符串 String 字符串是基本数组类型的 对象包装类型 对象才有属性 String.length 可以通过length 属性获得字符串长度 字符串是一种有序结构 可以通过索引 来访问 字符数据 字符串的索引和
字符串

String 字符串是基本数组类型的 对象包装类型 对象才有属性

String.length 可以通过length 属性获得字符串长度

字符串是一种有序结构

可以通过索引 来访问 字符数据

字符串的索引和数组一样从0开始 最大索引是长度-1

var str = '123456789';
 console.log(str.l ength); //9
 console.log(str[2]); //3

字符串是可以被遍历的

for (var i = 0; i < str.length; i++) {
console.log(str[i]);
}

字符串是ECMAScript中 使用频率最高的数据类型之一

ECMAScript为字符串提供了很多函数 方便开发者 修改和控制字符串

这些方法 都被保存在String.prototype中的属性

字符串API
String.prototype.chanAt()

语法:str.charAt(index);

参数:index(number)索引

返回值:string索引对象的字符串

描述:charAt在字符串中通过索引获得字符 效果和str[index]相同

var str = '123456789';
console.log(str.charAt(2));//3
String.prototype.charCodeAt()

语法:str.charCodeAt(index);

参数:index(number)索引

返回值:Unicode(number)索引对应的Unicode编码

描述:在字符串中通过索引 获得指定字符的Unicode编码 0-65535

数字 48-57

大写字母A-Z 65-90

小写字母a-z 97-122

String.fromCharCode();

语法:String.fromCharCode(Unicode);

参数:Unicode(nume)编码

返回值:string Unicode对应的数字

var str = '林深时见鹿';
var arr = [];
for (var i = 0; i < str.length; i++) {//遍历字符串
 console.log(str.charCodeAt(i));//把字符串转换成Unicode编码格式
 arr.push(str.charCodeAt(i));//把转换的Unicode编码 放到创建的数组当中
}
console.log(arr);
//for循环遍历数组
for (var j = 0; j < arr.length; j++) {
 console.log(String.fromCharCode(arr[j]));//把对应的Unicode编码转换成文字
}
//利用数组arr.map 方法遍历数组
var result = arr.map(function(elm) {//遍历数组
 return String.fromCharCode(elm);//把数组元素转换成字符串 文字
}).join('');
console.log(str);
console.log(result);
// console.log(arr);
String.prototype.concat()

语法:str.concat(value[,...value]);

参数:value(string)需要合并的字符串

返回值:合并后的新字符串

var str1 = 'aaa';
var str2 = 'bbb';
var str3 = 'ccc';
var result = str1.concat(str2, str3);
console.log(result); //aaabbbccc
String.prototype.indexOf()

语法:str.indexOf(searchString[,fromIndex=0]);

参数:searchString(string)需要查找的字符串片段

​ fromIndex(number)开始查找的索引 默认值0

返回值:index(number)或-1

描述:indexOf在字符串中查找一个字符片段 返回找到的第一个匹配片段的第一个字符串的索引 没有找到则返回-1

var str = 'JavaScript';
var result = str.indexOf('S');
console.log(result); //4 区分大小写
String.prototype.lastIndexOf()

语法:str.lastIndexOf(searchString[,fromIndex=0]);

参数:searchString(string)需要查找的字符串片段

​ fromIndex(number) 开始查找的索引 默认值为0

返回值:index(number)或-1

描述:在字符串中从后向前查找一个字符串片段 返回找到的第一个匹配片段的第一个字符的索引 没有找到则返回-1

var str = 'JavaScript';
console.log(str.lastIndexOf('a')); //3
String.prototype.slice()

语法:str.slice(start[,end]);

参数:start(number)开始索引

​ end(number)结束索引

返回值:string 字符串片段

描述:slice 在字符串中截取片段

​ 结果内容从start开始到end结束 结果不包含end索引对应字符

​ 如果没有结束索引 则截取到字符串的结尾

​ 如果没有开始索引则为复制一个字符串

注意:参数如果是负数 表示从后向前计算 -1表示最后一个 -1表示倒数第二个 以此类推

var str = '123456789';
var result = str.slice(1, -1);
console.log(result); //2-8
console.log(str.slice(12)); //''没有截取到返回空字符串
String.prototype.split()

语法:string.split(delimiter[,limit])

参数:delimiter(string)分离器 用来切割字符串

​ limit(number)保留长度

返回值:array(新数组)

描述:spilt在字符串中通过分离器对字符串 进行切割 将字符串切割成若干份 每一段内容都会被存进新数组

var str = '1,2,3,4,5,6,7,8,9';
var str1 = '123456789'
var arr = str.split(',');
var arr1 = str1.split('', 5);
console.log(arr); //['1', '2', '3', '4', '5', '6', '7', '8', '9']
console.log(arr1); //['1', '2', '3', '4', '5']
//split 是 join 的逆向操作
String.prototype.substr()

语法:str.substr(start,length);

参数:start(number)开始索引

​ length(number)长度

返回值:string

描述:substr 从字符串中截取片段 从start开始 指定长度

var str = '123456789';
var result = str.substr(1, 4);
console.log(result); //2-5
String.prototype.substring()

语法:str.substring(start,end);

参数:start(number)开始索引

​ end(number)结束索引

返回值:string

描述:substring 从字符串中截取片段 从start开始到end结束

​ 截取结果 不包含end索引所指字符

注意:当substring参数小于0时或为NaN则默认为0

​ 当substring的参数start大于end时会交换参数位置

String.prototype.toLowerCase(); 转小写字母
var str = 'aaaBBBccc';
console.log(str[4].toLocaleLowerCase());
String.prototype.toUpperCase();转大写字母
var str1 = 'AAAbbbCCC';
console.log(str1[4].toLocaleUpperCase());
String.prototype.tirm();

描述:去除字符串前后空格

语法:str.trim();

返回值:新字符串

String.prototype.repeat()

语法:str.repeat(count);

参数:count(number)重复次数

返回值:新字符串

var str = 'a';
console.log(str.repeat(5));
数组 数组API
//Array.prototype 数组原型对象 
var arr = new Array(); //arr 是 Array 的实例成员
var obj = new Object(); //o 是 Object 的实例成员> 
Array.prototype.push()

描述:在方法push蒋在数组的结尾添加 一个或多个元素

语法: arr.push(elm[,...elm]);

参数:elm(any)指的是需要添加到数组结尾的元素

返回值:length(number)添加元素后数组的新长度

var arr = [1, 4, 7];
console.log(arr);
var lem = arr.push(2, 5, 8);
console.log(lem, arr);//[1,4,7,2,5,8]
Array.prototype.pop()

描述:方法pop 将删除并返回数组中最后一个元素

语法:arr.pop();

返回值: lastElement(被删除的最后的元素) 或 undefined;

var arr = [1, 4, 7];
console.log(arr);
var result = arr.pop();
console.log(result, arr);// 7 [1,4]

如果对一个数组只使用push 和 pop 可以将改数组看作是 栈 后进先出

Array.prototype.concat()

描述:concat 方法将合并两个或多个数组

语法:arr.concat(value[,....value]);

参数:value(any)数组和值 所有的value会依次被添加到新数组中

返回值:新数组

注意点:这个方法不修改原有数组

var arr1 = [1, 4, 7];
var arr2 = [2, 5, 8];
var arr3 = [[3, 6, 9]];
var result=arr4.concat(arr1,arr2,arr3);

使用 concat 函数合并数组时 会自动展开外层数组 内层数组将不会展开

concat在合并数组时 获得 数组的浅拷贝(数组如果有引用数据 则获得引用地址)

Array.prototype.join()

描述:join方法用于将数组所有的元素转换成字符串类型 将转换后结果用指定字符进行连接

语法:arr.join([separator])

参与:separator(string) 分隔符 默认值为','

返回值:string 一个新的字符串 使用分割符连接后的结果

注意点:join 转换字符串的方式 是将数组中所有的元素进行 toString 操作

​ 所有的数据类型都可以转换成字符串 但是不是所有数据都能toString()

​ null 和 undefined就没有toString

​ JS引擎为了保证代码安全运行 不出现错误 会忽略 null 和 undefined

var arr = [1, 2, 3, true, undefined, '坤坤', NaN, null, {
 age: 14
}];
var Arrjoin = arr.join();
console.log(arr); //原数组不会改变
console.log(Arrjoin);
Array.prototype.reverse()

描述:reverse用于颠倒数组中的元素

语法:arr.reverse();

返回值:原数组

注意点:直接修改原数组

var arr = [1, 4, 7];
console.log(arr);//[1,4,7]
arr.reverse();
console.log(arr);//[7,4,1]
Array.prototype.shift()

描述:shift 将数组中的第一个元素删除 并返回第一个元素 将数组中原有的元素向前移动一位 将数组的长度-1

语法:arr.shift();

返回值: firstElenment 被删除的第一个元素

注意点:直接修改原数组 不推荐使用 性能不好(时间复杂度O(n)) 假设数组中有1万个元素,删除第一个 操作了9999个元素

var arr = [1, 2, 3, 4];
console.log(arr);
var result = arr.shift();
console.log(arr);
console.log(result);
//修改方法 时间复杂度O(1)
arr[0] = arr[arr.length - 1];
arr.length = arr.length - 1;
console.log(arr);
Array.prototype.slice();

语法:arr.slice([start,end]);

参数:start(number) 开始索引

​ end(number) 结束索引

描述:slice用于在数组中获得数组的一个子片段

​ 返回一个新数组 新数组中的内容包含了 从start开始到end结束的元素

​ 最终结果 包含start所指索引 不包含end所指索引

​ 如果没有提供结束索引 则默认截取到数组的末尾

​ 如果没有参数则是获得原数组的一个浅拷贝

​ 浅拷贝的意思是内部如果有引用类型的数据 则获得引用地址

​ 当参数是负数时 -1表示最后一个元素 -1表示倒数第二个元素 依次类推

返回值:新数组(原数组的浅拷贝)

var arr = [1, 2, 3, 4];
var result = arr.slice(-1);
console.log(arr);
console.log(result)
//使用JSON方法实现深拷贝数组
var res = JSON.stringify(arr); //把数组转换成字符串
console.log(res);
var r = JSON.parse(res); //把字符串转换成数组
console.log(r);
Array.prototype.sort()

描述:通过特定的算法 对数组的元素进行排序 默认情况时将数组的元素转换成字符串 然后按照Unicode编码进行排序 数字0-9 48-57 大写字母A-Z 65-90 小写字母a-z 97-112

语法:arr.sort([compareFunction]);

参数:compareFunction(function)比较函数

compareFunction用于指定数组使用何种规则进行排序 没有改函数 默认按照Unicode编码进行排序

回调参数:firstElement 用于比较的第一个元素

​ secondElement 用于比价的第二个元素

返回值:原数组

注意点:直接修改原数组

var arr = [31, 45, 23, 67, 44, 45, 23, 15];
arr.sort();
console.log(arr);//[15, 23, 23, 31, 44, 45, 45, 67] 按照Unicode 编码排序
//如果 compareFunction(a, b) 小于 0 ,那么 a 会被排列到 b 之前;
//如果 compareFunction(a, b) 等于 0 , a 和 b 的相对位置不变。
//如果 compareFunction(a, b) 大于 0 , b 会被排列到 a 之前。
//compareFunction(a, b) 必须总是对相同的输入返回相同的比较结果,否则排序的结果将是不确定的。
//结论: 当返回值小于0时 数组中相邻的元素交换位置
//数组升序排列
arr.sort(function(a, b) {
 return a - b;
});
//数组降序排列
arr.sort(function(a, b) {
 return b - a;
});
//使用sort实现了reverse的功能
arr.sort(function() {
 return -1;
})
//随机打乱数组
arr.sort(function() {
 return Math.random() - 0.5; //利用Math.random()函数生成一个0-1的数
}
Array.prototype.toString()

语法:arr.toString()

描述:toString函数将数组中所有的元素都进行toString操作 然后使用','连接

返回值:字符串

推荐使用join

var arr = [2, 4, , 5, null, undefined, NaN, true];
var result = arr.toString('-');//里面添加连接符无效,只会默认使用','隔开
console.log(result);
Array.prototype.unshift()

语法:arr.unshift(element[,...element]);

参数:在数组头部依次添加元素 将数组中现有元素依次向后移动

返回值:length(number)添加元素后的新长度

这个方法类似于push 这个方法性能不好(不推荐使用)

var arr = [1, 4, 7];
arr.unshift(2, 5, 8);
console.log(arr);
//性能优化方法
arr[arr.length] = arr[0];
arr[0] = 5;
console.log(arr)
Array.prototype.splice()

语法:arr.splice(start[,deleteCount,[value,...value]]);

参数: strat(number) 开始索引

​ deleteCount(number)删除数量

​ value(any)添加到start 的元素

返回值:array 包含了被删除所有元素 如果没有删除元素 则返回一个空数组

描述:1.在指定索引位置删除元素

​ 2.在指定位置替换元素

​ 3.在指定位置插入元素

var arr = [1, 4, 7, 2, 5, 8];
arr.splice(1, 2, 3, 6, 9);
console.log(arr);// [1, 3, 6, 9, 2, 5, 8]
Array.prototype.indexOf()

语法:arr.indexOf(searchElement[,fromIndex=0]);

参数: searchElement(any) 需要在数组中查找的值

​ fromIndex(nimber) 从指定的索引开始查找 默认值0

返回值:index 或 -1

描述:indexOf 在数组中查找指定的元素 如果找到元素 则返回第一个找到的元素索引 没有找到则返回-1

var arr = [1, 4, 7, 2, 5, 8, 3, 6, 9, 1, 2, 3, 4];
var result = arr.indexOf(2, 4);
console.log(result >=0);
if (result) {
 console.log('找到元素了');
} else {
 console.log('没有找到元素');
}
Array.prototype.lastIndexOf()

语法:arr.lastIndexOf(searchElement[,fromIndex])

区别于indexOf 这个函数是从后面向前查找

var result = arr.lastIndexOf(2, -5);
console.log(result); //3
Array.prototype.forEach()

语法:arr.forEach(callback);

参数:callback(function) 回调函数

回调函数参数:[currentElement] 当前元素

​ [index] 当前元素的索引

描述:forEach 函数会遍历数组 每一个数组的元素会被传入回调函数,forEach 为每一元素执行依次回调

arr.forEach(function(elm, i) {
 console.log(elm, i);
});
var arr1 = ['唱', '跳', 'rap'];
arr1.forEach(function(elm, i) {
 var name = '坤坤喜欢';
 console.log(name + elm);
});
Array.prototype.filter()

语法:arr.filter(callback);

参数:callback(function)回调

回调参数:[currentValue] 当前元素

​ [index] 当前元素的索引

返回值:array 一个数组

描述:通过一个条件在数组中筛选符合条件的元素

var result = arr.filter(function(elm) {
 //返回数组中除以2余数为0的元素
 return elm % 2 === 0;
});
console.log(result);
Array.prototype.map()

语法:arr.map(callback);

参数:callback(function)回调

回调参数:[currentValue] 当前元素

​ [index] 当前元素的索引

返回值: array 由回调函数的返回值组成的新数组

var result = arr.map(function(elm) {
 return elm * 2;
});
console.log(arr);
console.log(result);
//链式调用
//当返回值是数组时 是可以继续链式调用数组的任意API
var data = [{
 name: 'xiaoming',
 age: 20
}, {
 name: 'xiaohua',
 age: 17
}, {
 name: 'xiaobei',
 age: 25
}, {
 name: 'xiaoli',
 age: 16
}, {
 name: 'xiaowang',
 age: 38
}];
var result = data.filter(function(elm) {
 return elm.age > +18;
}).map(function(elm) {
 return elm.name
}).join('  ');
console.log(result);
Array.prototype.reduce()

语法:arr.reduce(callback[,obj]);

参数:callback(function)

​ [obj] 传入回调函数中的对象

回调参数:

​ object(any) reduce的第二个参数 如果没有传递该参数 默认为数组中第一个元素

​ current 数组中每一个元素

描述:reduce函数用于数组的数据 归并(归类 合并)操作

返回值:归并结果(最后一次回调函数的返回值)

var arr = [1, 4, 7, 2, 5, 8, 3, 6, 9, 1, 2, 3, 4];
var result = arr.reduce(function(prev, next) {
 //返回两个数的和值,进入下一次回调函数
 // return prev + next;
});
console.log(result);
//判断有几个奇数和偶数
var jishu = 0,
 oushu = 0;
var result1 = arr.reduce(function(prve, next) {
 if (next % 2 === 0) {
     return oushu++;
 } else {
     return jishu++;
 }
}, jishu, oushu);
console.log(jishu, oushu);
console.log(arr.length);
Array.prototype.every()

语法:arr.every(callback);

参数:callback(function)

回调函数:[currentValue]

​ [index]

返回值:Booolean

描述:every 为数组的每一个元素执行判断

如果所有判断结果都为true 则返回true

有判断结果为false时 则返回false

var arr = [1, 2, 13, 4, 5, 6, 7];
var result = arr.every(function(elm) {
 return elm > 10;
});
console.log(result); //false
Array.prototype.some()

语法:arr.some(callback);

参数:callback(function)

回调函数:[currentValue]

​ [index]

返回值:boolean

描述: some 为数组的每一个元素执行一个判断

如果所有判断结果有true 则返回true

有判断结果没有 true 则返回false

var arr = [1, 2, 13, 4, 5, 6, 7];
var result = arr.every(function(elm) {
 return elm > 10;
});
console.log(result); //false
var result1 = arr.some(function(elm) {
 return elm > 10;
});
console.log(result1); //true
Array.prototype.find()

语法:arr.find(callback);

参数:callback(function)

回调参数:[currentValue] 元素

​ [index] 索引

返回值:符合匹配逻辑表达式的第一个元素或undefined

描述:fined在数组中查找能与逻辑表达式匹配的元素

var arr = [1, 2, 3, 4, 5, 6, 7];
var result = arr.find(function(elm) {
 return elm % 2 === 0;
});
console.log(result);//2 元素
Array.prototype.findIndex();

语法:arr.findIndex(callback);

参数:callback(function);

回调参数:[currentValue]

​ [index]

返回值:符合匹配逻辑表达式的第一个元素的索引或-1;

描述:findIndex在数组中查找能与逻辑表达式匹配的元素索引

var result1 = arr.findIndex(function(elm) {
 return elm % 2 === 0;
});
console.log(result1); //1  索引
Array.prototype.includes()

语法:arr,includes(value[,froIndex=0]);

参数:value 需要查找的值

​ fromIndex(number)开始索引

返回值:boolean

描述:通过一个值 在数组中查找 数组中是否包含这个元素

var result2 = arr.includes(3);
console.log(result2); //true

【文章出处:香港cn2服务器 http://www.558idc.com/st.html 复制请保留原URL】
上一篇:爬虫实战(八):爬表情包
下一篇:没有了
网友评论