前端充电站：新建文件夹名字的排序和补位问题新建文件名字的排序和补位问题情景重现：需要向数组中按顺序添加添加新建文件夹，命

新建文件名字的排序和补位问题

情景重现：需要向数组中按顺序添加添加新建文件夹，命名规则为新建文件夹${i}
情景重现：数组中某一个文件夹(数据)被删除时，再次点击新建文件夹时，需要判断是否补位

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
<script>

//初始数据
let data = [
    "我的音乐",
    "我的课程",
    "新建文件夹",
    "新建文件夹(3)"
];

//给页面添加点击事件
document.onclick=function(){

var names=data.filter(function(item){
	//判断data数据项是否满足要求
	if(item.substring(0,6)=='新建文件夹'){
		return true;
	}else if (
      item.substring(0,6)=="新建文件夹("  
      && Number(item.substring(6,item.length-1))>=2 
      && item.substring(item.length-1)==')') {
		return true;
	}
    
    //创建一个只存在 新建文件夹(?) 的数组
	return false;
})

//console.log(data)

//根据新建文件夹(???number???)对names数组进行重新排序
names.sort(function(n1,n2){
  n1=n1.substring(6,n1.length-1)
  n2=n2.substring(6,n2.length-1)
  n1 = isNaN(n1)?0:n1;
  n2 = isNaN(n2)?0:n2;
  return n1-n2
})

//console.log(names)

//如果names第一项不是 新建文件夹 时重新添加该选项
//情景：被删除了 && 本身就没有
if(names[0]!=='新建文件夹'){
  data.push('新建文件夹')
  return;
}
    
    
//遍历names数组如果names[i]的值不是 新建文件夹(i+1) 的话就添加
for(var i=1;i<names.length;i++){
  if(Number(names[i].substring(6,names[i].length-1))!== i+1){
    data.push(`新建文件夹(${i+1})`)
    return;
  }
}

//其他情况只需要根据names数组的长度去判断添加 
data.push(`新建文件夹(${names.length+1})`)
    
}
</script>