Javascript数组基本操作
Javascript中的数组是一种特殊的对象，用来表示偏移量的索引是该对象的属性，索引可能是整数，然而这些数字索引在内部被转换为字符串类型，这是因为javascript对象中的属性名必须是字符串。
一：如何创建数组？
创建数组有2中方式，第一种是对象字面量如下：
var arrs = []; // 定义了一个空数组。
还有一种方式是：调用Array的构造函数创建数组
var arrs = new Array();
二：数组的基本操作如下：
1. 把字符串转换为数组 可以使用split方法。如下：
console.log("aabbcc".split(""));
打印：["a", "a", "b", "b", "c", "c"]
2. 把数组转换为字符串，可以使用join方法。如下：
console.log(['aa','bb','vv'].join(""))；
打印如下：aabbvv
3. indexOf查找元素。用来查找元素是否在数组中，如果存在就返回数组的索引，否则就返回-1;
["aa",'bb'].indexOf('bb'); // 1
indexOf()函数总是返回第一个与参数相同的元素的索引，有另一个功能与之类似的函数是 lastIndexOf()方法，该函数返回相同元素中最后一个元素的索引，如果没有找到，则返回-1.
如：["aa",'bb','cc','aa'].lastIndexOf('aa'); // 3
["aa",'bb','cc','aa'].indexOf('aa'); // 0
4. 数组合并使用concat()方法。
如：console.log(["aa",'bb'].concat(['cc']));
返回 [“aa”,”bb”,”cc”];
5. splice()方法从现有数组里截取一个新数组，该方法的第一个参数是截取的起始索引，第二个参数是截取的长度。比如如下代码：
["aa","bbb","vvv","ddd","ee"].splice(2,2)
返回是：["vvv", "ddd"]
6. slice()方法 从已有的数组中返回选定的元素
arrs.slice(start,end);
start 必须，规定从何处开始选取，如果是负数，那么规定从数组尾部开始算起的位置，比如：-1是最后一个元素，-2是倒数第二个元素。
end 可选，规定从何处结束选取，该参数是数组片段结束处的数组下标，如果没有指定该参数，那么切分的数组包含从start到数组结束的所有元素。 比如如下：
['aa','bb','cc','dd'].slice(1,2);
返回[“bb”];
7 . push()方法，从数组最后添加元素；比如如下代码：
var nums = [1,2,3,4,5];
nums.push(6);
console.log(nums); // [1,2,3,4,5,6];
8. unshift()方法 可向数组的开头添加一个或更多元素，并返回新的长度。如下：
var arrs = [1,2,3,4,5];
console.log(arrs.unshift("aa","bb")); 返回7
console.log(arrs); // ["aa", "bb", 1, 2, 3, 4, 5]
9. pop()方法 删除数组末尾的元素。返回被删的元素
var arrs = [1,2,3,4,5,6];arrs.pop();
console.log(arrs.pop()); // 6
console.log(arrs);// 1,2,3,4,5
10. shift()方法 删除数组的第一个元素，如下代码：
var nums = [9,1,2,3,4,5,6];
console.log(nums.shift()); // 9
console.log(nums);// [1,2,3,4,5,6];
从数组中间位置添加和删除元素，可以使用splice()方法，需要提供如下参数：
1. 起始索引。
2. 需要删除元素的个数(添加元素时该参数设置为0)；
3. 想要添加进数组的元素。
比如如下：
在数组中间插入元素。
var nums = [1,2,3,7,8,9];
nums.splice(3,0,4,5,6);
console.log(nums);// [1,2,3,4,5,6,7,8,9]
在数组中删除元素。
var nums = [1,2,3,100,200,300,400,4,5];
nums.splice(3,4);
console.log(nums);// 1,2,3,4,5
11. 数组排序，第一个方法是：reverse(); 该方法将数组中元素的顺序进行翻转。比如如下代码：
var nums = [1,2,3,4,5];
nums.reverse();
console.log(nums);// 5,4,3,2,1
如果是字符串排序，可以使用sort()方法。如下代码：
var arrs = [“Da”,”ade”,”cdf”,’bfg’];
arrs.sort();
console.log(arrs);// ["Da", "ade", "bfg", "cdf"]
但是如果数组元素是数字类型，就有问题了，比如如下代码：
var nums = [3,1,2,100,4,200];
nums.sort();
console.log(nums);// [1, 100, 2, 200, 3, 4]
sort()方法是按照字典顺序对元素进行排序的，因此他假定元素都是字符串类型。但是对于数字型的我们可以简单写一个函数即可。比如如下代码：
function compare(num1,num2) {
return num1 – num2;
}
var nums = [3,1,2,100,4,200];
num.sort(compare);
console.log(nums);// 1,2,3,4,100,200
下面介绍的几种新元素 分别是 forEach(),every()，some(),reduce(),reduceRight(),map(),filter().是针对标准浏览器做的，IE9+，firefox，chrome操作的，IE8及以下不支持的。
一：forEach()方法：该方法接受一个函数作为参数，对数组的每个元素使用该函数，如下代码：
function square(num) {
console.log(num*num);
}
var nums = [1,2,3,4,5,6,7,8,9,10];
console.log(nums.forEach(square));
// 1,4,9,16,25,36,49,64,81,100
二：every()方法 该方法接受一个返回值为布尔类型的函数，对数组中每个元素使用该函数，如果返回所有的为true，则true，否则返回false，如下代码：
function isEven(arrs) {
return arrs % 2 == 0;
}
var arrs = [2,4,6,8];
console.log(arrs.every(isEven));
返回true；如果上面的arrs 是 [2,4,5,6];则返回false
三：some()方法接受一个返回值为布尔类型的函数，只要有一个为true，则返回true，如下代码：
function isEven(arrs) {
return arrs % 2 == 0;
}
var arrs = [1,5,3,7];
console.log(arrs.some(isEven));
返回false，如果上面的arrs = [1,5,3,6];则返回true。
四：reduce()方法接受一个函数，返回一个值，该方法会从一个累加值开始，不断对累加值和数组中的后续元素调用该函数，直到数组中的最后一个元素，最后返回得到的累加值。如下代码：
function add(total,currentVal) {
return total + currentVal;
}
var nums = [1,2,3,4];
console.log(nums.reduce(add));
返回10.
Javascript还提供了reduceRight()方法，和reduce()方法不同，它是从右到左执行的，下面demo是对数组中的字符串做操作，如下代码：
function concat(accumulatedString,item) {
return accumulatedString + item;
}
var words = ["aa",'bb','cc'];
console.log(words.reduce(concat));
返回aabbcc。
但是如果使用reduceRight()方法的话，则值是从右边开始的。如下代码：
function concat(accumulatedString,item) {
return accumulatedString + item;
}
var words = ["aa",'bb','cc'];
console.log(words.reduceRight(concat));
打印 ccbbaa
五：map()方法对数组中的每个元素使用某个函数，产生新数组。如下代码：
function curve(grade) {
return grade +=5;
}
var grades = [77,78,89,13];
console.log(grades.map(curve));// [82,83,94,18]
下面是一个字符串使用map()方法对数组的demo，如下：
function first(word) {
return word[0];
}
var words = ["ased","bvc","cde"];
console.log(words.map(first)); // ['a','b','c'];
console.log(words.map(first).join("")); //"abc"
六：filter()方法：传入一个返回值为布尔类型的函数，对数组中所有元素使用该函数，返回一个新数组，如下代码：
function isEven(num) {
return num % 2 == 0;
}
function isOdd(num) {
return num % 2 != 0;
}
var nums = [];
for(var i = 0; i < 10; i++) {
nums[i] = i + 1;
}
console.log(nums.filter(isEven)); // 2,4,6,8,10
console.log(nums.filter(isOdd)); // 1,3,5,7,9
下面总结下 javascript字符串的基本方法如下：
1. concat()方法：该方法可以把多个参数到指定字符串的尾部。如下代码：
var a="Hello"; var b="World";
console.log(a.concat(b)); // HelloWorld
2. charAt(),charCodeAt()方法。
charAt()用于返回字符串中第N个字符，charCodeAt用于返回字符串中的第N个字符串的代码。如下代码：
var a = "hello world";
console.log(a.charAt(2)); // l
console.log(a.charCodeAt(2)) // 108
3. indexOf(),lastIndexOf()方法，2个都是查找字符串的位置，indexOf()是从头开始查找，lastIndexOf()是从尾部开始查找的，该2个方法分别有2个参数，第一个参数为查找的对象，第二个参数为查找的起始位置。如下代码：
var a = "hello world";
console.log(a.indexOf("lo",1)); // 3
console.log(a.indexOf(2)); // -1
4. substr(),substring()方法。
substr(start,end);该方法根据指定的长度来截取字符串，包含2个参数，第一个参数为截取字符串的起始下标，第二个参数为表示截取的长度。
如下代码：
var a = "hello world";
console.log(a.substr(0,5));// hello
substring(start,stop); start 参数字符串开始的位置，stop字符串结束的位置。如下代码：
var a = "hello world";
console.log(a.substring(2,5)); // llo
5. slice（）方法：
slice()与substring（）类似，都是根据起始下标与结束下标来截取子字符串。slice()方法声明：slice(start, [end])
如下代码：
var a = "hello world";
console.log(a.slice(2,5)); // llo
slice()方法与substring()方法的区别：
区别1：如果第一个参数的值比第二个参数的值大，即起始下标大于结束下标，substring()方法能够在执行截取之前，先交换2个参数，而slice（）方法无效，返回空字符串， 如下代码：
var a = "hello world";
console.log(a.substring(11,6)); // world
console.log(a.slice(11,6)); // 返回空
区别2：如果参数值为负数，slice()方法能够把负号解释为从右侧开始定位，右侧第一个为-1，第二个为-2，以此类推。而substring（）方法无效，并返回空字符串。如下代码：
var a="Hello World";
console.log(a.substring(-5,-1)); // 空
console.log(a.slice(-5,-1)); // worl
6. replace()方法
replace(regexp,replacement); 第一个参数表示执行匹配的正则表达式，也可以是字符串；第二个参数表示准备代替匹配的子字符串。
var a = "hello a";
console.log(a.replace(/a/g,'world')) // hello world
7. toLowerCase(),toUpperCase()方法。
toLowerCase() 将字符串转换成为小写,toUpperCase() 将字符串转换成为大写。
如下代码：
var a="Hello World"
console.log(a.toLowerCase()); // hello world
console.log(a.toUpperCase()); // HELLO WORLD
对模糊匹配中的字符串操作
有时候我们做模拟下拉框模糊匹配时候，比如输入A时候，会有下拉框，其中A需要高亮状态效果，我们可以使用字符串匹配；比如类似于百度的搜索如下图：
所以我们的JS代码可以如下写：
var brandName = "abcdef我是中国人", inputVal = "cde"; var arrs = []; if(brandName.match(inputVal)) { var str = brandName.match(inputVal); // 1. 获取的元素是从第几个位置开始 var curIndexStart = brandName.indexOf(inputVal); // 2. 找到已匹配元素的长度 var matchLen = str.join("").split("").length; // 3. 截取前面的字符 var prefix = brandName.substring(0,curIndexStart); // 4. 截取字符串后面的字符 var suffix = brandName.substring(curIndexStart + matchLen); // 5. 存入数组里面去 arrs.push(prefix + "_" + inputVal + "_"+ suffix + "_" + "-" +"111"); } console.log(arrs); // ab_cde_f我是中国人_-111 console.log(arrs[0].split("-")[0]); // ab_cde_f我是中国人_ var firstStr = arrs[0].split("-")[0]; console.log(firstStr.split("_")[0]); // ab console.log(firstStr.split("_")[1]); // cde console.log(firstStr.split("_")[2]); // f我是中国人
然后把字符串拼接起来，当前的元素需要高亮就加一个标签让他们高亮起来；