前端小知識10點（2019.5.18）

一、當給數組的index賦負數或小數時，數組的長度有無變化？

let arr=[]
  arr[10]=11
  console.log(arr.length); //11

  arr[-1]=-1
  console.log(arr.length) //11
  
  arr[3.14]=3.14
  console.log(arr.length) //11
  //===================================
  let arr1=[]
  
  arr1[2.1]=2.1
  console.log(arr1[2.1],'arr144') //2.1
  console.log(arr1.length,'arr145') //0
  
  arr1[1]=1
  console.log(arr1.length,'arr147') //2
  //========================
  let arr2=[]
  arr2[-1]=-1
  console.log(arr2.length,'arr253') //0
  //========================
  let arr3=[]
  arr3[5]=5
  console.log(arr3.length,'arr258') //6

因而可知，array的length屬性只計算非負整數下標！不計算負數、小數

二、antd-pro 項目熱更新慢而且是在95%（emitting）時卡住怎麼辦？

本人其實是less文件裏多寫了個逗號。。。。😅

三、less 子類名使用 active

span {
      position: relative;
      .leftIcon{
        border-radius: 17px;
      }
      &.active {
        background:rgba(94,112,231,1);
        .leftIcon{
          background:rgba(255,255,255,1);
        }
      }
    }

四、antd 的 Spin 組件不認識 undefined（Spin 組件的 spinning 屬性只對 true/false 生效），若是是 undefined 狀態會是一直讀取的狀態

<Spin spinning={undefined}>
</Spin>

五、flex 超出換行 flex-wrap: wrap

.noIcon {
  display: flex;
  //超出換行
  flex-wrap: wrap;
}

六、sort() 雙重排序
（1）總分排序
（2）若是總分相等，咱們再按照語文成績排序

var jsonStudents = [
    {name:"Dawson", totalScore:"197", Chinese:"100",math:"97"},
    {name:"HanMeiMei", totalScore:"196",Chinese:"99", math:"97"},
    {name:"LiLei", totalScore:"185", Chinese:"88", math:"97"},
    {name:"XiaoMing", totalScore:"196", Chinese:"96",math:"100"},
    {name:"Jim", totalScore:"196", Chinese:"98",math:"98"},
    {name:"Joy", totalScore:"198", Chinese:"99",math:"99"}];
jsonStudents.sort(function(a,b){
    var value1 = a.totalScore,
        value2 = b.totalScore;
    if(value1 === value2){
        return b.Chinese - a.Chinese;
    }
    return value2 - value1;
});

七、正則表達式：js 去掉下劃線,後首個字母變大寫

let str='str_abc'
str=str.replace(/_(\w)/g, (all, letter) => letter.toUpperCase());
console.log(str) //'strAbc'

八、按下 control+enter 鍵，觸發事件

<TextArea onKeyDown={(e)=>{
   if(e.ctrlKey&&event.keyCode===13)
      this.handleOk()
}}/>

onKeyDown 事件的 ctrlKey 是 control 鍵，keyCode=13 是 enter 回車鍵。

九、使用<br/>代替回車符↵，而且使用dangerouslySetInnerHTML使 react 的 DOM 元素能夠讀取字符串中的標籤

dangerouslySetInnerHTML至關於 innerHtml

let str=comment.split(/\r\n|\r|\n/g).join('<br/>')

<div dangerouslySetInnerHTML={{__html:str}} />

十、正則表達式：正整數

const reg = /^[0-9]*[1-9][0-9]*$/;

---

（完）