每日前端签到（第107天）

第107天（2018-11-19）

• [html] 举例说明HTML5的Canvas元素有什么用途？
• [css] 为什么要使用css sprites？
• [js] 写一个把数字转成中文的方法，例如：101转成一百零一
• [软技能] 你知道什么是B/S和C/S架构吗？说说它们的区别

题目一：
生成图片，动画什么的
题目二：
可以减少http请求
题目三：

    function formatChineseTypeNumber(number) {
      const digitChar = [...'零一二三四五六七八九']
      const posChar = ['', ...'十百千']
      const unit = ['', '万', '亿']

      let str = ''
      let arr = number.replace(/(\d{1,4})(?=(?:\d{4})+(?!\d))/g,'$1,').split(',')

      const formatWan = (number, unit) => {
        let string = ''
        number.split('').forEach((x, i) => {
          if (x !== '0') {
            let posCharIndex = number.length - i - 1
            // 处理 `一十万` 改为 `十万`
            if (x === '1' && posCharIndex === 1) {
              string += `${posChar[posCharIndex]}`
            } else {
              string += `${digitChar[x]}${posChar[posCharIndex]}`
            }
          } else if (string.slice(-1) !== '零') {
            string += '零'
          }
        })
        while(string.slice(-1) === '零') {
          string = string.slice(0, -1)
        }
        return string && `${string}${unit}`
      }

      arr.forEach((item, index) => {
        str += formatWan(item, `${unit[arr.length - index - 1]}`)
      })
      return str
    }

    formatChineseTypeNumber('10000') // 一万
    formatChineseTypeNumber('1000') // 十万
    formatChineseTypeNumber('1000000') // 一百万

题目四：
大概的意思应该是面向手机端，和面向PC端