小技巧随笔

js中给字符串添加空格

使用 

+ '\xa0' + 

即可

超出文本框宽度变为...

text-overflow:ellipsis; width:xxx

overflow:hidden;

white-space:nowrap; 

超出文本宽度换行，超过n行后变为...

 width:xxx
 text-overflow: -o-ellipsis-lastline;

  overflow: hidden;

  text-overflow: ellipsis;

  display: -webkit-box;

  -webkit-line-clamp: 2;

  line-clamp: 2;

  -webkit-box-orient: vertical;

JS 反引号(`)标识的作用

ES6 模板字符串(Template String)是增强版的字符串，用反引号(`)标识，它可以当作普通字符串使用，也可以用来定义多行字符串，或者在字符串中嵌入变量。

例如： var a = 1; console.log('一共有'+a+'个鸡蛋！')

那么现在你只要console.log(`一共有${a}个鸡蛋！`)

数组分组

const  groupBy = (array, f) => {

  const groups = {}

    array.forEach(function (o) {

    const group = JSON.stringify(f(o))

    groups[group] = groups[group] || []

    groups[group].push(o)

  })

  return Object.keys(groups).map(function (group) {

    return groups[group]

  })

}

const arrayGroupBy = (list, groupId) => {

  const sorted = groupBy(list, function (item) {

    return [item[groupId]]

  })

  return sorted

}

更改input样式

input {

  appearance: none;

  text-align: center;

  height: 30px;

  width: 120px;

  border-radius: 15px;

  border: 0px solid #fff;

  padding: 0 8px;

  outline: 0;

  letter-spacing: 1px;

  color: #fff;

  font-weight: 600;

  background: rgba(45, 45, 45, 0.1);

  border: 1px solid rgba(255, 255, 255, 0.2);

  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.2) inset;

  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);

}