JavaScript 对象：String & Array 及其常见应用
String对象
split
功能：把字符串分割为字符串数组。官方文档已经描述的够清楚，不多赘述。主要说一下需要注意的情况以及应用
1、省略分割参数
var str="How are you doing today?";
var n=str.split();
//n 输出数组值得结果:
["How are you doing today?"]
2、分割字符为空字符""`
//分割每个字符，包括空格:
var str="How are you doing today?";
var n=str.split("");
//n 输出数组值得结果:
H,o,w, ,a,r,e, ,y,o,u, ,d,o,i,n,g, ,t,o,d,a,y,?
3、使用 limit 参数
var str="How are you doing today?";
var n=str.split(" ",3); //此分隔符为空格
//n 将输出3个数组的值:
How,are,you
4、使用某个字符做分隔符(重点)
var tktNo: '781-1157594322/781-1157594323/781-1157594324'
console.log(tktNo.split('/'))
//结果为：
["781-1157594322", "781-1157594323", "781-1157594324"]
Array对象
filter
用法： 用于过滤，就是把数组中的每个元素，使用回调函数func进行校验，回调函数func返回一个布尔值，将返回值为 true 的元素放入新数组
参数：函数
返回值： Boolean
写法一：
//箭头函数 参数n为数组元素
const nums = [20,30,110,60,190,50]
let newNums =nums.filter(n =>{
return n < 100
})
写法二：
//普通函数
let newNums = nums.filter(function(n) {
return n < 100;
})
map
用法： 遍历原数组，将元素处理然后放入到新数组中
参数： 函数
返回值： 新数组元素
写法一：
//箭头函数
let newNums2 =newNums.map(n =>{
return n*2
})
写法二：
let newNums2 =newNums.map(function(n){
return n*2
})
reduce
reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。
array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
| 参数 | 描述 |
|---|---|
| total | 必需。初始值, 或者计算结束后的返回值。初始值 = initialValue |
| currentValue | 必需。当前元素 |
| currentIndex | 可选。当前元素的索引 |
| arr | 可选。当前元素所属的数组对象。 |
返回值： 新数组元素
示例：
//将数组中所有元素加上n
let arr = [20,40,80,100]
let sum = arr.reduce( (preValue, n) => {
return preValue + n
},0)
/*
第一次：preValue -> 0 ; n-> 20
第二次：preValue -> 20 ; n-> 40
第一次：preValue -> 60 ; n-> 80
第一次：preValue -> 140; n-> 100
*/
preValue：上一次汇总的值，即return的值，初始值设置为0
n: 是指遍历数组中的元素
链式调用
将数组arr中小于10的元素*2然后再相加
var arr = [2,6,8,11,20,32];
let total = arr.filter(n => n < 10).map(n => n*2).reduce((pre,n) => pre + n)
console.log(total); // 32
sort排序
sort() 方法用于对数组的元素进行排序。排序顺序可以是字母或数字，并按升序或降序。默认排序顺序为按字母升序。
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();
//输出结果 Apple,Banana,Mango,Orange
默认升序，若想实现降序
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();
fruits.reverse()
注意：当数字是按字母顺序排列时"40"将排在"5"前面。要使用数字排序，必须通过一个函数作为参数来调用，即
Array.sort(callback)，函数指定数字是按照升序还是降序排列。
//数字排序（数字和升序）：
var points = [40,100,1,5,25,10];
points.sort(function(a,b){return a-b});
//输出结果 1,5,10,25,40,100
//降序
points.sort(function(a,b){return b-a});
排序方法callback
如果返回值小于0表示两个元素不需要交换位置，大于0表示要用交互位置，0表示相等，实际上<=0等效。
键值对{}
Object.assign()
用于对象的合并，将源对象（source）的所有可枚举属性，复制到目标对象（target）。
const target = { a: 1 };
const source1 = { b: 2 };
const source2 = { c: 3 };
Object.assign(target, source1, source2);
target // {a:1, b:2, c:3}
应用
统计一个字符在字符串中出现的次数
方式一
var arr = 'abcdaabc';
var newArr1=arr.split('a') //["", "bcd", "", "bc"]
var newArr2=arr.split('b') //["a", "cdaa", "c"]
var newArr3=arr.split('c') //["ab", "daab", ""]
var num = newArr.length-1 //num即为出现次数
之所以出现空字符串：
- 该字符出现在首尾处
- 相同字符相邻时中间会出现空字符
方式二
var strs = "hello everyone"
var num = strs.split('').filter(i => i == 'e').length
统计所有出现过的字符在字符串中出现的次数
/*
res: 单次返回结果
cur: 当前数组元素
{}: 返回结果初始值
*/
var arrString = 'abcdaabc';
var tt = arrString.split('').reduce((res, cur) => {
console.log("cur",cur); //'a','b','c','d','a'.......
console.log("res[cur]",res[cur]); // undefine
res[cur] ? res[cur] ++ : res[cur] = 1 //三目运算符，res[cur]为undefine时，给key为cur的value赋值为1，之后叠加次数
console.log("res",res);
return res;
}, {})
//res 结果为
{a: 3, b: 2, c: 2, d: 1}
数组元素累加
arr.reduce( (a,b) => a+b)
对象数组按某个属性排序
实际上在于数组对象的sort方法 : Array.sort(callback)
let cities = [
{name:'西安市',value:100},
{name:'威阳市',value:120},
{name:'延安市',value:80},
{name:'南洛市',value:90},
{name:'榆林市',value:130}
]
function sortRule(a,b) {
return a.value - b.value
}
cities.sort(sortRule)
console.log(cities);
打印结果如下
[
{name: "延安市", value: 80},
{name: "南洛市", value: 90},
{name: "西安市", value: 100},
{name: "威阳市", value: 120},
{name: "榆林市", value: 130}
]
若想不规定某个属性，而是指定任意属性
let cities = [
{name:'西安市',value:100},
{name:'威阳市',value:120},
{name:'延安市',value:80},
{name:'南洛市',value:90},
{name:'榆林市',value:130}
]
function sortRule(prop) {
return function (a,b) {
return a[prop] - b[prop]
}
}
cities.sort(sortRule('value'))
console.log(cities);
