JS系列真实项目中的需求

38次阅读

共计 2567 个字符，预计需要花费 7 分钟才能阅读完成。

1. 时间字符串格式化

有一个时间字符串“2018-4-4 16:26:8”, 变为“04 月 04 日 16 时 26 分”

   方法 1
   /*
   * 1. 基于 split 按照 kongge  把字符串拆分两部分（数组中两项）* 2. 左边的这一部分继续以 split 按照中杠来拆
   * 3. 右边这一部分继续 split 按照冒号来拆
   * 4. 把需要的信息拼接在一起即可（不足 10 位的补零）*/
   function addZero (val){
     return val < 10 ? '0' + val :val;
     // month < 10 ? month = '0' + month :null  // 如果小于 10（不足两位数）就给它加 0
}
   var str = '2018-4-4 16:32:8';
   var ary = str.split(''), //=>["2018-4-4","16:32:8"]
       aryLeft = ary[0].split('-'), //=>["2018", "4", "4"]
       aryRight = ary[1].split(':'); //=>["16", "32", "8"]
   var month = addZero(aryLeft[1]),
       day = addZero(aryLeft[2]),
       hour = addZero(aryRight[0]),
       minute = addZero(aryRight[1]);
   var result = month + '月' + day + '日' + hour + '时' + minute + '分';
   console.log(result)

[外链图片转存失败, 源站可能有防盗链机制, 建议将图片保存下来直接上传(img-dL5WMbdv-1576060307754)(./1576052835774.png)]

第二种方式

第三种方式

提高眼界

   ~function (pro){pro.formatTime = function (template) {template = template || '{0}年 {1} 月{2}日 {3}时 {4} 分{5}秒';
       var ary = this.match(/\d+/g);
       template = template.replace(/\{(\d+)}/g, function () {var n = arguments[1],
          val = ary[n] || '0';
          val < 10 ? val = '0' + val : null;
          return val;
});   
   return template;
}
}(String.prototype)

有一个 url 地址：“https://sports.qq.com/zhufneg…n” 地址问号后面的内容是我们需要解析出来的参数信息
{
lx : 1
name : ‘AA’
sex : man
}

/*
* 1. 先找到问号，把问号后的信息截取下来
* 2. 首先我们要验证是否存在 #哈希值，存在的话我们从问号开始截取到#，不存在的话，我们直接截取到字符串的末尾
* 3. 以 & 进行拆分（数组）* 4. 遍历数组中的每一项，在按照 = 进行拆分，把拆分后的第一项作为对象的属性名，第二项作为属性值进行存储即可

*/
 var str = 'https://sports.qq.com/zhufnegpeixun/stu/?lx=1&name=AA&sex=man#teatcher'; //# 号后面的称为哈希值（hash）值，这个值可能有，可能没有，我们需要处理，有的话，我们截取的时候需要过滤掉
 var indexASK=str.indexOf('?'),
     indexWell=str.indexOf('#');
           //=># 可能有，可能没有，需要判断
     if(indexWell > -1){
           // 存在 #号，我们截取到# 号的位置即可
     str = str.substring(indexASK + 1, indexWell);
}else {
   // 没有 #号，我们截取到末尾
   str = str.substr(indexASK + 1);
}
  console.log(str)
  //=> lx=1&name=AA&sex=man
  var ary = str.split('&'), //=>["lx=1", "name=AA", "sex=man"]
      obj = {};
  for (var i =0 ;i<ary.length; i++){var item =ary[i],
       itemAry = item.split('=');
   console.log(itemAry);  
   //=>(2) ["lx", "1"]0: "lx"1: "1"length: 2__proto__: Array(0)
   //=>    (2) ["name", "AA"]0: "name"1: "AA"length: 2__proto__: Array(0)
  //=>     (2) ["sex", "man"]
  var key = itemAry[0],
     value = itemAry[1];
   obj[key] = value;
}
console.log(obj);

正则

  有一个 url 地址：“https://sports.qq.com/zhufnegpeixun/stu/?lx=1&name=AA&sex=man" 地址问号后面的内容是我们需要解析出来的参数信息

   
    ~function (pro){pro.queryURLParmater = function () {var obj= {},
         reg = /([^?=&#]+)(?:=?([^?=&#]+)?)/g;
     this.replace(reg, function (){var key = arguments[1],
             value = arguments[2] || null;
         obj[key] = value;
   });
    return obj;
  }
}(String.prototype);

 var str = 'https://sports.qq.com/zhufnegpeixun/stu/?lx=1&name=AA&sex=man#teatcher';
  console.log(str.queryURLParmater());
 =>{https://sports.qq.com/zhufnegpeixun/stu/: null, lx: "1", name: "AA", sex: "man", teatcher: null}
https://sports.qq.com/zhufnegpeixun/stu/: null
lx: "1"
name: "AA"
sex: "man"
teatcher: null
__proto__: Object

正文完