web前端学习：JavaScript 打怪升级-把业务逻辑当练习题做
前言
开发项目和出没社区有一段时间了，会遇上一些比较有形象事务需求。这些事务需求，可能是自己开发项目遇上的，可能是在社区看到的事务需求，或许其他状况接触到的需求，可是这些事务需求的完成逻辑都值得一写。由于这些事务逻辑能够作为练习题一样，能够给我们练手。也期望我们从这些需求完成的逻辑里边能够能到javascript的相关知识，当然如果我们觉得代码需求怎样优化，或许有什么建议，更好的完成计划，觉得我哪里写错了，或许有觉得能够共享的需求，能够在评论提下！
如果你们想要了解或者想要深入学习可以进我的群里进行交流学习,群号：614315657 。欢迎我们进去交流学习，我们一同学习一同行进，我觉得程序员不应该中止脚步，而是一向在学习的道路上一向行进。
2.月份坐标轴
这个需求是，看下图就懂了
完成方法其实很简单，我在代码打上注释，我们就懂了！
var _date=[],dateData=["1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月"];
//预备一个月份反转的数组
var dateDataRet=Object.assign([],dateData).reverse();
//获取当时年份
var yearText=new Date().getFullYear();
//获取当时月份 调试的时候，我们能够通过调整now调试 3月-now=2,12月now=11...
var now=new Date().getMonth();
if(now-i<0){
//如果now-i<0，从dateDataRet里边拿数据，下标=|now-i|-1。
_date.push(yearText-1+'年'+dateDataRet[Math.abs(now-i)-1]);
else{
_date.push(yearText+'年'+dateData[now-i]);
}
_date.reverse();
可能我们看着会懵，直接看下面的循环图就懂了
3.数值区间
如下图，就是几个数值区间，并且会有一个最小值和最大值
var _min=5,_max=50;
function checkArr(arr,min,max){
//排序
arr.sort(function(n1,n2){return n1.min-n2.min})
//遍历
for(var i=0;i
//区间的最小值不能大于等于区间最大值
if(arr[i].min>=arr[i].max){
console.log('区间的最小值不能大于等于区间最大值');
return;
}
//区间的最小值不能小于默许最小值
if(arr[i].min
console.log('区间的最小值不能小于默许最小值');
return;
}
//区间的最大值不能大于默许最大值
if(arr[i].max>max){
console.log('区间的最大值不能大于默许最大值');
return;
}
//元素比照，从第二个元素开端
if(i>0){
//minInclude，maxInclude，为false就是不包括，为true就是包括
//{min:10,max:20,minInclude:false,maxInclude:false}
//等同于(10,20)
//{min:20,max:30,minInclude:true,maxInclude:false}
//等同于[20,30);
//如果前一个的最大值和当时的最小值都是包括状况，那么当时区间的最小值必定要比前一个区间的最大值大1
if(arr[i].minInclude&&arr[i-1].maxInclude&&arr[i].min-arr[i-1].max!==1){
console.log('取值规模错误-当时区间的最小值和前一个区间的最大值都是包括状况，当时区间的最小值必定要比前一个区间的最大值大1');
return;
}
//如果前一个的最大值和当时的最小值。一个是包括，一个是不包括，那么当时区间的的最小值必定要等于上一个区间的最大值
else if(arr[i].minInclude!==arr[i-1].maxInclude&&arr[i].min!==arr[i-1].max){
console.log('取值规模错误-当时区间的最小值和前一个区间的最大值其间一个是包括，一个是不包括状况，当时区间的最小值必定要等于前一个区间的最大值');
return;
}
//如果前一个的最大值和当时的最小值都是不包括，必定不满意
else if((!arr[i].minInclude)&&(!arr[i-1].maxInclude)){
console.log('取值规模错误-前一个的最大值和当时的最小值都是不包括状况，不满意收尾相连');
return;
}
}
测验用例
var arr1=[{min:10,max:20,minInclude:false,maxInclude:true},{min:21,max:30,minInclude:true,maxInclude:true}],
arr2=[{min:10,max:20,minInclude:false,maxInclude:true},{min:20,max:30,minInclude:true,maxInclude:false}],
arr3=[{min:10,max:20,minInclude:false,maxInclude:true},{min:20,max:30,minInclude:false,maxInclude:false}],
arr4=[{min:10,max:20,minInclude:false,maxInclude:false},{min:20,max:30,minInclude:true,maxInclude:false}],
arr5=[{min:10,max:20,minInclude:false,maxInclude:false},{min:21,max:30,minInclude:true,maxInclude:false}],
arr6=[{min:10,max:20,minInclude:false,maxInclude:false},{min:15,max:30,minInclude:false,maxInclude:false}],
arr7=[{min:10,max:20,minInclude:false,maxInclude:false},{min:20,max:30,minInclude:false,maxInclude:false}],
arr8=[{min:1,max:20,minInclude:false,maxInclude:false},{min:20,max:30,minInclude:false,maxInclude:false}],
arr9=[{min:20,max:20,minInclude:false,maxInclude:false},{min:20,max:30,minInclude:false,maxInclude:false}],
arr10=[{min:20,max:30,minInclude:false,maxInclude:false},{min:20,max:70,minInclude:false,maxInclude:false}];
运转成果
4.数组比照
这个根据我答复过的一个问题，现在化用，改写一下
JavaScript如何比照两个数组？数组B根据数组A来做出增删？ (不必jquery，原生js)
具体问题是这样的：
arryA
var arrayA = ['a','b','c'];
arryB
var arrayB = [{
key:'a',
num1:'1'，
num2:'2',
num3:'3',
tot:'6'
},{
key:'b'，
num1:'11',
num2:'22',
num3:'33',
tot:'66'
},{
key: 'c',
num1: '111',
num2: '222',
num3: '333',
tot:666
}];
1、如果arryA中有a，arryB中没有，那么在arryB中增加一个key值为a的boj，且其他特点值可均为'0';如下： {key:'a',num1:'0',num2:'0',num3:'0',tot':0'}
2、如果arryA中有a，arryB中也有key值为a的obj,那么arryB则不改动，并且该obj里的其他特点和特点值均不变;
3、如果在arryA中删除了a，那么arryB中key值为a的obj整个删掉。
//预备暂时数组
function compareArr(arr1,arr2){
var result=[],arr;
//遍历
for(var i=0;i
//根据arr1[i]的值，查找arrayB，如果arr2中的有满意条件（arrayB中的目标，有key值等于arrayA[i]）的项，就会回来满意条件的项，不然回来underfind;
arr=arr2.find(function(val){return val.key===arr1[i]});
//如果arr不是undefind，就会增加arr，不然增加{key:arrayA[i],num1:'0',num2:'0',num3:'0',tot:'0'}。
arr?result.push(arr):result.push({key:arrayA[i],num1:'0',num2:'0',num3:'0',tot:'0'});
}
测验
var arrayA = ['b','c'];
var arrayB = [{
key:'a',
num1:'1',
num2:'2',
num3:'3',
tot:'6'
},{
key:'b',
num1:'11',
num2:'22',
num3:'33',
tot:'66'
},{
key: 'c',
num1: '111',
num2: '222',
num3: '333',
tot:666
}];
compareArr(arrayA,arrayB);
5.学院获奖
计算学生请求优异毕业生，并且契合条件的（成绩优异，拿过奖学金，取得过三好学生）。前提是要请求
大概的流程图就是像下面这样！
我在代码上写上注释，相信不难理解了
//学生列表
//isApply：是否有请求优异毕业生
let studentList = [
{
name: 'aa',
isApply: false,
id: 1
},
{
name: 'bb',
isApply: true,
id: 2
},
{
name: 'cc',
isApply: true,
id: 3
}
];
//请求优异毕业生的学生 isApply:true
let _student = studentList.filter(function (item) {
return item.isApply; });
//isExcellent:优异学生的id列表
//isScholarship:取得过奖学金的学生的id列表
//isThreeGood:取得过三好学生的学生的id列表
//accord:集合
let isExcellent = [1, 2, 3, 4, 5], isScholarship = [4, 2, 5, 6, 2, 1, 2], isThreeGood = [2, 1, 4, 52, 36], accord = [];
//数组去重函数
function removeRepeatArr(arr) {
return arr.filter(function (item, index, self) {
return self.indexOf(item) === index;
});
}
//计算数组中，一个遇上元素的出现次数
function getEleCount(obj, ele) {
let num = 0;
for (let i = 0, len = obj.length; i < len; i++) {
if (ele === obj[i]) {
num++;
}
}
return num;
}
//增加学生记载，把取得成绩优异的学生的id，取得过奖学金的学生的id，取得过三好学生的id增加进去。
//可是增加之前，要对取得成绩优异的学生的id，取得过奖学金的学生的id，取得过三好学生的id。这个三个数组进行去重再增加进accord，由于一个学生可能不止一次成绩优异，不止一次取得过奖学金，不止一次取得过三好学生
//这样就方便下面的判别，只要学生的id在accord里边出现两次及以上就契合条件
accord.push.apply(accord, removeRepeatArr(isExcellent));
accord.push.apply(accord, removeRepeatArr(isScholarship));
accord.push.apply(accord, removeRepeatArr(isThreeGood));
console.log(accord);
//契合条件的学生列表
let accordStudent = [];
for (let i = 0; i < _student.length; i++) {
//只要学生的id在accord里边出现两次及以上
if (getEleCount(accord, _student[i].id) >= 2) {
//记载哪些学生契合条件
accordStudent.push(_student[i]);
}
}
console.log(accordStudent);
6.数组接连的最大长度
这个也是出于我答复过的问题：如下
//假如有一个数组，下面这个数组最大的接连长度就是4——————8,9,10,11
var arr=[1,2,4,5,6,8,9,10,11];
//代码完成
function countLen(arr){
//如果参数不是数组或许长度为0，直接回来0
if(arr.constructor!==Array||arr.length===0){return 0;}
//首要进入当时接连长度nowLen设初始化为1，最大接连长度maxLen初始化为0
var nowLen=1,maxLen=0;
for(var i=1,len=arr.length;i
//当时数组元素是不是比上一个数组大1
if(arr[i]-arr[i-1]===1){
//如果是，当时接连长度nowLen+1
nowLen++;
}
else{
//不然先判别，当时接连长度是否大于最大接连长度
if(maxLen
//如果是就赋值
maxLen=nowLen
}
//当时接连长度初始化为1
nowLen=1;
}
}
//循环完再判别一次当时接连长度是否大于最大接连长度（避免最大接连长度是数组最后面几个数组时发生的bug）
if(maxLen
maxLen=nowLen
}
//回来最大接连长度
return maxLen;
}
7.答题连对数
这个和上面的代码基本一样，只是判别条件毫厘之差，直接贴，我们看就好
function countTrue(arr){debugger;
//如果参数不是数组或许长度为0，直接回来0
if(arr.constructor!==Array||arr.length===0){return 0;}
//首要初始化接连答对长度nowLen为0，最大接连答对长度maxLen为0
var nowLen=0,maxLen=0;
for(var i=0,len=arr.length;i
//当时数组元素是不是比上一个数组大1
if(arr[i]){
//如果是，当时接连长度nowLen+1
nowLen++;
}
else{
//不然先判别，当时接连长度是否大于最大接连长度
if(maxLen
//如果是就赋值
maxLen=nowLen
}
//当时接连长度初始化为0
nowLen=0;
}
}
//循环完再判别一次当时接连长度是否大于最大接连长度（避免最大接连长度是数组最后面几个数组时发生的bug）
if(maxLen
maxLen=nowLen
}
//回来最大接连长度
return maxLen;
}
8.命名方法转换
比方驼峰命名方法转'-'命名方法。
var str = "shouHou";
//$1-榜首个括号匹配的内容
//这个实例，$1='H'
str = str.replace(/([A-Z])/g,"-$1").toLowerCase();
比方'-'命名方法转驼峰命名方法
var str="shou-hou";
//$0-匹配的成果 $1-榜首个括号匹配的内容
//这个实例$0='-h' $1='h'
str=str.replace(/-(w)/g,function($0,$1){
return $1.toUpperCase();
});
9.格局化字符
这个最常见的就是在金额方面的显现需求上，比方后台回来10000。前端要显现成10,000或许其他格局等！
//str
//size-每隔几个字符进行切割 默许3
//delimiter-切割符 默许','
function formatText(str,size,delimiter){
var _str=str.toString();
var _size=size||3,_delimiter=delimiter||',';
/*
如果_size是3
"d{1,3}(?=(d{3})+$)"
*/
var regText='\d{1,'+_size+'}(?=(\d{'+_size+'})+$)';
/*
/d{1,3}(?=(d{3})+$)/g 这个正则的意思：匹配接连的三个数字，可是这些三个数字不能是字符串的最初1-3个字符
*/
var reg=new RegExp(regText,'g');
/*
(-?) 匹配前面的-号 (d+)匹配中间的数字 ((.d+)?)匹配小数点后面的数字
//$0-匹配成果，$1-榜首个括号回来的内容----(-?) $2,$3如此类推
*/
return _str.replace(/^(-?)(d+)((.d+)?)$/, function ($0, $1, $2, $3) {
return $1 + $2.replace(reg, '$&,') + $3;
})
}
10.目标兼并，并且记载反常数据
这个需求，可能我们有点懵。下面实例分析 比方有两个都当地记载了我的信息
let info1={
name:"守候",
sex:"男",
age:24,
job:"web前端"
},info2={
name:"守候!",
country:"china",
interest:"basketball",
phone:"12345678910",
job:"web前端"
}
现在要兼并我的信息，并且记载可能有反常的信息。比方上面的name特点，在两个目标都有，并且两个目标的值不一样，那么就不知道到底是info1中的name特点是正确的，还是info2中的name特点是正确的。所以，就得把name这个特点记载起来，方便以后核对name这个特点。
如下图
下面，一步一步来，先不管3721，直接兼并特点
let objAll={};
function assignObj(objArr) {
let _obj={};
for(let i=0;i
_obj=Object.assign(_obj,objArr[i],{});
}
return JSON.parse(JSON.stringify(_obj));
}
objAll=assignObj([objA,objB]);
然后先预备一个字段，记载哪些反常信息
objAll.warnInfo=[];
最后检查目标，判别哪些信息有反常
function checkObj(_objAll,objList) {
//获取所有特点
let _keys=Object.keys(_objAll);
for(let i=0;i
for(let j=0;j<_keys.length;j++){
//如果_keys[j]这个特点，在objList[i]和_objAll里边都存在，并且这两个值是不一样的，那么就是一场数据，需求记载！
if(objList[i][_keys[j]]!==undefined&&_objAll[_keys[j]]!==objList[i][_keys[j]]){
_objAll.isError.push(_keys[j]);
return _objAll;
console.log(checkObj(objAll,[objA,objB]));
如果你们想要了解或者想要深入学习可以进我的群里进行交流学习,群号：614315657 。欢迎我们进去交流学习，我们一同学习一同行进，我觉得程序员不应该中止脚步，而是一向在学习的道路上一向行进。