数组和字符串、正则易混淆的几个方法

# 数组和字符串、正则易混淆的几个方法

# 数组方法sort

arr.sort([compareFunction])
// compareFunction比较函数，接受两个参数，当第一个参数排在第二个参数之前，返回负数，否则返回正数，相等则返回0

sort() 方法用于对数组的元素进行排序，并返回数组。默认排序顺序是根据字符串UniCode码。返回排序后的数组

function compare(a, b) {
  if (a < b ) {           // 按某种排序标准进行比较, a 小于 b
    return -1;
  }
  if (a > b ) {
    return 1;
  }
  // a must be equal to b
  return 0;
}

如果要比较数字而非字符串，比较函数可以简单的以 a 减 b

let arr=[1,111,2,20,3,19,28]
console.log(arr.sort())
//[1, 111, 19, 2, 20, 28, 3]

console.log(arr.sort((a,b)=>{return a-b}))
//[1, 2, 3, 19, 20, 28, 111]
//需要比较后得出正确的顺序

function compare(value1, value2) {
  if (value1 < value2) {
    return -1;
  } else if (value1 > value2) {
    return 1;
  } else {
    return 0;
  }
}
let values = [0, 1, 5, 10, 15];
values.sort(compare);
console.log(values);  // 0,1,5,10,15

# sort实现原理，手写sort

 let _arr1=[1,5,11,30,9]	   
		  function fx(a,b){
			  return a-b
		  }
		_arr1.sort=function(){//fx用来接收调用_arr1.sort时传过来的参数,此时fx=function(a,b){return a-b;}
						//然后用冒泡排序从前往后进行比较，按由小到大的顺序排序
						var _empty=null;
						for(var n=0; n<_arr1.length-1;n++){
							for(var i=0;i<_arr1.length-1; i++){
								//因为fx接收过参数之后fx=function(a,b){return a-b},那么这里调用fx时传过去两个参数
								//就相当于给function传了两个参数,a=_arr1[i+1],b=_arr[i](因为返回的是a-b),用后一位数减前一位数
								if(fx(_arr1[i+1],_arr1[i])<0){//判断用第i+1个元素减去第i个元素是否小于0,如果小于0,说明i+1位置上的数较小，进行交换
															  //例如95-8大于0,不交换,31-95小于0,进行交换,把较小的值放在前面
									_empty=_arr1[i];
									_arr1[i]=_arr1[i+1];
									_arr1[i+1]=_empty;
								}
							}
						}
						console.log(_arr1);
						//(5) [1, 5, 9, 11, 30, sort: ƒ]

		}
		_arr1.sort()

# sort 处理对象数组

如果比较值相减，不是数字，是NaN的话，比较就会无效，需要通过其他方式，转换对比

	var datas = [
	    {"title":"asd","level":2,"content":"asd","date":"12/14/2018, 8:09:44 PM"},
	    {"title":"asd","level":3,"content":"asd","date":"12/14/2018, 8:09:44 PM"},
	    {"title":"asd","level":4,"content":"asd","date":"12/14/2018, 8:09:44 PM"},
	    {"title":"asd","level":5,"content":"asd","date":"12/14/2018, 8:09:44 PM"},
	    {"title":"asd","level":3,"content":"asd","date":"12/14/2018, 8:09:44 PM"},
	    {"title":"fsdfg","level":4,"content":"asd","date":"12/14/2018, 8:09:44 PM"},
	    {"title":"asd","level":4,"content":"asd","date":"12/14/2018, 8:09:44 PM"},
	    {"title":"asd","level":4,"content":"asdasf","date":"12/14/2018, 8:09:44 PM"},
	    {"title":"fsdfg","level":5,"content":"rsgdv","date":"12/14/2018, 8:10:48 PM"}
	]
	 
	datas.sort((a,b)=>{
		console.log(a.title === b.title)
		if(a.title === b.title){
			return -1
		}else{
			return 0
		}
	})
	console.log(datas)

# 多个排序规则的sort排序

链接 (opens new window)

# 数组方法splice

array.splice(index,howmany,item1,.....,itemX)

参数	描述	-
index	必需。规定从何处添加/删除元素。	该参数是开始插入和（或）删除的数组元素的下标，必须是数字。
howmany	可选。规定应该删除多少元素。必须是数字，但可以是 "0"。	如果未规定此参数，则删除从 index 开始到原数组结尾的所有元素。
item1, ..., itemX	可选。要添加到数组的新元素	-

向/从数组中添加/删除项，然后返回 被删除的项 。会改变原始数组。

let arr = [1,3,5,7]
arr.splice(1,2,9,10)
console.log(arr)
//[1, 9, 10, 7]

let arr = [1,3,5,7]
arr.splice(1,0,9,10)
console.log(arr)
//[1, 9, 10, 3, 5, 7]

添加的数是加在指定位置前的

# join和split转化数组字符串

 let a='21k123k123324ksdafk3'
 let arr =a.split("k")
 console.log(arr)
 //["21", "123", "123324", "sdaf", "3"]
 let b=arr.join("--")
 console.log(b)
 //21--123--123324--sdaf--3

# split

split除了对字符串还可以对正则表达式处理，除了第一个参数必填，还可以传一个数值， 用来控制生成数组的个数

var str="How are you doing today?";
var n=str.split(/you/ig);
console.log(n)
// ["How are ", " doing today?"]

# concat()数组和字符

用于连接两个或多个数组。

该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本,字符串同理，也不会改变原来字符串。

var a = [1,2,3];
console.log(a.concat(4,5));//[1,2,3,4,5]

var str1 = "Hello ";
var str2 = "world!";
var n = str1.concat(str2);
//Hello world!

# indexOf数组和字符串

let arr=[1,2,3,4,5,6]
let str="123456"
console.log(arr.indexOf(3))//2
console.log(str.indexOf(45))//3

# includes 数组和字符串

let arr=[1,2,3,4,5,6]
let str="123456"
console.log(arr.includes(3))//true
console.log(str.includes(45))//true
console.log(arr.includes(2,1))//true
console.log(arr.includes(2,3))//false

# slice()数组和字符串

数组（字符串）使用slice方法的目的就是截取目标数组（字符串），通俗的来讲就是截取想要的。

不填参数

var arr = new Array("a","b","c","d");
console.log(arr.slice());//["a","b","c","d"]相当于截取全部

参数	描述
start	可选。规定从何处开始选取。如果是负数，那么它规定从数组尾部开始算起的位置。也就是说，-1 指最后一个元素，-2 指倒数第二个元素，以此类推。
end	可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数，那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数，那么它规定的是从数组尾部开始算起的元素。

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var myBest = fruits.slice(-3,-1);
//Lemon,Apple

var str="www.runoob.com!";
document.write(str.slice(4)+"<br>"); // 从第 5 个字符开始截取到末尾
document.write(str.slice(4,10)); // 从第 5 个字符开始截取到第10个字符
//runoob.com!
//runoob

# slice在数组的实现，包括将类数组转为数组

Array.prototype.myslice = function (start, end) {
    var result = new Array();
    start = start || 0;
    end = end || this.length; //this指向调用的对象，当用了call后，能够改变this的指向，也就是指向传进来的对象，这是关键
    for (var i = start; i < end; i++) {
        result.push(this[i]);
    }
    return result;
	
};

var arr = [0, 1, 2, 3];
console.log(arr.myslice(1, 3));
console.log(arr.slice(1, 3));

# match字符串检测正则是否匹配

match() 方法可在字符串内检索指定的值，或找到一个或多个正则表达式的匹配。

该方法类似 indexOf() 和 lastIndexOf()，但是它返回指定的值，而不是字符串的位置。

stringObject.match(searchvalue)
stringObject.match(regexp)
//存放匹配结果的数组。该数组的内容依赖于 regexp 是否具有全局标志 g。

var str="Is this all there is?";
var patt1=/is/g;
document.write(str.match(patt1));
console.log(str.match(patt1))
//is,is
//["is", "is"]

var str = "Visit W3School";
var patt1 = /w3school/i;
document.write(str.match(patt1));
console.log(str.match(patt1))
//W3School
//["W3School", index: 6, input: "Visit W3School", groups: undefined]

如果 regexp 没有标志 g，那么 match() 方法就只能在 stringObject 中执行一次匹配。如果没有找到任何匹配的文本， match() 将返回 null。否则，它将返回一个数组，其中存放了与它找到的匹配文本有关的信息。该数组的第 0 个元素存放的是匹配文本，而其余的元素存放的是与正则表达式的子表达式匹配的文本。除了这些常规的数组元素之外，返回的数组还含有两个对象属性。 index 属性声明的是匹配文本的起始字符在 stringObject 中的位置，input 属性声明的是对 stringObject 的引用。

如果 regexp 具有标志 g，则 match() 方法将执行全局检索，找到 stringObject 中的所有匹配子字符串。若没有找到任何匹配的子串，则返回 null。如果找到了一个或多个匹配子串，则返回一个数组。不过 全局匹配返回的数组的内容与前者大不相同，它的数组元素中存放的是 stringObject 中所有的匹配子串，而且也没有 index 属性或 input 属性 。

# search 字符串检测字符位置，检测正则位置

search() 方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串。

如果没有找到任何匹配的子串，则返回 -1。

var str="Mr. Blue has a blue house";
document.write(str.search("blue"));//15

var str="Mr. Blue has a blue house";
document.write(str.search(/blue/i));//4

← 混淆 attribute和property →