数组

数组初始化

//方法1
const arr = [];
for(let i=0;i<10;i++){
    arr[i]=0;
}

//方法2
const arr = new Array(10).fill(0)

数组有关的常用方法

var colors = ["red","green","blue"];
//toString()、join()都不影响原数组
colors.toString();  //返回"red,green,blue"
colors.join();      //返回"red,green,blue"
colors.join("|");   //返回"red|green|blue"
console.log(colors);//输出 ["red", "green", "blue"]


//push()、pop()、unshift()、shift()都会改变原数组
colors.push("black");console.log(colors);   //输出["red", "green", "blue", "black"]
colors.pop();console.log(colors);           //输出["red", "green", "blue"]
colors.unshift("black");console.log(colors);//输出["black", "red", "green", "blue"]
colors.shift();console.log(colors);         //输出["red", "green", "blue"]


//reverse()、sort()都会改变原数组
colors.reverse();console.log(colors);//输出["blue", "green", "red"]
colors.reverse();console.log(colors);//输出["red", "green", "blue"]

colors.sort();console.log(colors);   //输出["blue", "green", "red"]
colors.sort(function(a,b){
	if(a<b){
		return 1;
	}else if(a>b){
		return -1;
	}else {
		return 0;
	}
});console.log(colors);    //输出["red", "green", "blue"]

/*colors.sort(function(a,b){
	if(a<b){
		return -1;
	}else if(a>b){
		return 1;
	}else {
		return 0;
	}
});
*/
//colors.sort((a,b) => a-b); 升序，注意 a-b的结果非NaN
//colors.sort((a,b) => b-a); 降序, 注意 b-a的结果非NaN


//concat()、slice()不影响原数组;
//splice()改变原数组
var newColors = colors.concat("pink",["white","black"]);
console.log(newColors);//输出["red", "green", "blue", "pink", "white", "black"]
console.log(colors);   //输出["red", "green", "blue"]

newColors = colors.slice(0,2);
console.log(newColors);//输出["red", "green"]
console.log(colors);   //输出["red", "green", "blue"]

colors.splice(3,0,"pink","white","black");
console.log(colors);//输出["red", "green", "blue", "pink", "white", "black"]
colors.splice(3,3);console.log(colors);//输出["red", "green", "blue"]


//indexOf()、lastIndexOf()
colors.push("red");console.log(colors);//输出["red","green","blue","red"]
colors.indexOf("red");    //返回0
colors.lastIndexOf("red");//返回3


//every()、some()、filter()、map()、forEach()、reduce()、reduceRight()
const array = [1,2,3];
const e = array.every(item => item>2);console.log(e);   //输出false
const s = array.some(item => item>2);console.log(s);    //输出true
const f = array.filter(item => item>2);console.log(f);  //输出[3]
const m = array.map(item => item*2);console.log(m);     //输出[2,4,6]
const sum = array.reduce((accu,curr) => accu+curr,0);console.log(sum);     //输出6
const res = array.reduceRight((accu,curr) => accu+curr,0);console.log(res);//输出6

看一个例子吧，webpack中RuleSet类的实现，RuleSet的作用是解析webpack.config.js中的module.rules。

const notMatcher = matcher => {
	return str => !matcher(str);
}
const orMatcher = items => {
	return str => {
		for(let i=0;i<items.length;i++){
			if(items[i](str)) return true;
		}
		return false;
	}
}
const andMatcher = items => {
	return str => {
		for(let i=0;i<items.length;i++){
			if(!items[i](str)) return false;
		}
		return true;
	}
}
class RuleSet{
	constructor(rules){
		this.rules = RuleSet.normalizeRules(rules);
	}
	static normalizeRules(rules){
		if(Array.isArray(rules)){
			return rules.map(rule => {
				return RuleSet.normalizeRule(rule);
			})
		}else {
			return [];
		}
	}
	static normalizeRule(rule){
		if(typeof rule === "string"){
			return {
				use:[
					{
						loader:rule
					}
				]
			}
		}
		if(!rule){
			throw new Error("Unexpected null when object was expected as rule");
		}
		if(typeof rule !== "object"){
			throw new Error("Unexpected "+ typeof rule+ " when expected object was expected as rule ("+rule+")");
		}
		const newRule = {};
		let condition;
		if(rule.test || rule.include || rule.exclude){
			condition = {
				test:rule.test,
				include:rule.include,
				exclude:rule.exclude
			}
			try{
				newRule.resource = RuleSet.normalizeCondition(condition);
			}catch(err){
				throw new Error(err);
			}
		}
		if(rule.use){
			newRule.use = RuleSet.normalizeUse(rule.use);
		}
		return newRule;
	}
	static normalizeUse(use){
		if(typeof use === "function"){
			return data => RuleSet.normalizeUse(use(data));
		}
		if(Array.isArray(use)){
			return use.map(item => RuleSet.normalizeUse(item))
			          .reduce((arr,items) => arr.concat(items),[]);
		}
		return [RuleSet.normalizeUseItem(use)];
	}
	static normalizeUseItem(item){
		if(typeof item === "string"){
			return RuleSet.normalizeUseItemString(item);
		}
		const newItem = {};
		for(let key in item){
			newItem[key] = item[key];
		}
		return newItem;
	}
	static normalizeUseItemString(useItemString){
		var idx = useItemString.indexOf("?");
		if(idx>=0){
			return {
				loader:useItemString.slice(0,idx),
				options:useItemString.slice(idx+1)
			}
		}
		return {
			loader:useItemString,
			options:undefined
		}
	}
	static normalizeCondition(condition){
		if(!condition) throw new Error("Expected condition but got falsy value");
		if(typeof condition === "string"){
			return str => str.indexOf(condition) === 0;
		}
		if(typeof condition === "function"){
			return condition;
		}
		if(condition instanceof RegExp){
			return condition.test.bind(condition);
		}
		if(Array.isArray(condition)){
			const items = condition.map(c => RuleSet.normalizeCondition(c))
			return orMatcher(items);
		}
 
		const matchers = [];
		Object.keys(condition).forEach(function(key){
			const value = condition[key];
			switch(key){
				case "include":
				case "test":
					if(value){
						matchers.push(RuleSet.normalizeCondition(value));
					}
					break;
				case "exclude":
					if(value){
						const item = RuleSet.normalizeCondition(value);
						return notMatcher(item);
					}
					break;
				default:throw new Error("Unexpected property "+key+" in condition");
			}
		})
		if(matchers.length === 0){
			throw new Error("Expected condition but got "+condition);
		}
		if(matchers.length === 1){
			return matchers[0];
		}
		return andMatcher(matchers);
	}
	exec(data){
		const result = [];
		this._run(data,{
			rules:this.rules
		},result);
		return result;
	}
	_run(data,rule,result){
		if(rule.resource && !data.resource) return false;
		if(rule.resource && !(rule.resource(data.resource))) return false;
		if(rule.use){
			const process = use => {
				if(typeof use === "function"){
					process(use(data));
				}else if(Array.isArray(use)){
					use.forEach(process);
				}else{
					result.push({
						type:"use",
						value:use
					})
				}
			}
			process(rule.use);
		}
 
		if(rule.rules){
			for(let i=0;i<rule.rules.length;i++){
				this._run(data,rule.rules[i],result);
			}
		}
 
	}
}
 
const module = {};
module.rules = [
	"json-loader",
	{
		test:/\.(png|jpg|svg|gif)$/,
		use:"file-loader"
	},
	{
		test:/\.xml$/,
		use:["xml-loader"]
	},
	{
		test:/\.js$/,
		use:["babel-loader?cacheDirectory"]
	},
	{
		test:/\.jsx$/,
		include:/src/,
		exclude:/node_modules/,
		use:{
			loader:"babel-loader",
			options:{
				cacheDirectory:true
			}
		}
	},
	{
		test:/\.(css|scss)$/,
		use:[
			'style-loader',
			'css-loader',
			'sass-loader'
		]
	}
];
const rules = new RuleSet(module.rules);
const result = rules.exec({
	resource:"index.js"
});
const result2 = rules.exec({
	resource:"index.scss"
});