每日前端签到（第八十三天）

第八十三天（2018-10-26）

• [html] HTML5的服务器(server-sent event)发送事件有什么应用场景？
• [css] 你有了解css计数器（序列数字字符自动递增）吗？如何通过css的content属性实现呢？
• [js] 用js实现小写金额转大写的方法
• [软技能] 你知道什么是微格式(microformat)吗？说说你的理解，它有什么运用场景？

题目一：
两种服务端推送技术的简单对比:

SSE WebSocket
服务器到浏览器的单向通信 两端之间的双向实时通信
不兼容IE 兼容性更好
协议实现断线重连与消息追踪 不在协议范围内, 需要手动处理
实现简单, 复用HTTP 独立于Http, 实现较复杂
回到问题, 在客户端请求不影响服务端推送数据或客户端请求以及客户端请求不密集的情况下可以考虑使用SSE代替WebSocket.

具体的应用场景有:

邮箱: 实时获取新邮件
后台性能监控: 实时更新监控数据
天气预报: 实时更新天气信息
题目二：
counter-reset:设置计数器 counter-reset: count 0 /* 计数器从1开始 /
counter-increment: 递增数值 counter-increment: count 2 / 用于count 每次递增2 */
eg.

<ul>
<li>Item</li>
<li>Item</li>
<ul>
<li>Item</li>
<li>Item</li>
</ul>
</ul>
ul {
counter-reset: count;
}
li::before {
counter-increment: count;
content: counters(count, '-')'.';
}
1.Item
2.Item
2-1.Item
2-2.Item
题目三：

const digitChar = ['', ...'一二三四五六七八九']
const posChar = ['', ...'十百千万   亿']
const placeholder = '零'

function toChineseNumeralUnder万(digits) {
    let revDigits = digits.split('').reverse()
    let result = ''
    for (let pos = 0; pos < revDigits.length; pos++) {
        const digit = Number(revDigits[pos])
        if (digit)
            { result = posChar[pos] + result }
        if (digit !== 1 || pos !== 1)
            { result = digitChar[digit] + result }
        if (!digit && pos && result && !result.startsWith(placeholder))
            { result = placeholder + result }
    }
    return result
}

function toChineseNumeralUnder亿(digits) {
    let highPart = toChineseNumeralUnder万(digits.slice(-8, -4))
    if (highPart)
        { highPart += posChar[4] }
    let lowPart = toChineseNumeralUnder万(digits.slice(-4))
    return highPart + lowPart
}

function toChineseNumeral(digits) {
    let fragment = ''
    const result = []
    for (const digit of digits.split('').reverse()) {
        if (fragment.length === 8) {
            result.unshift(toChineseNumeralUnder亿(fragment))
            fragment = ''
        }
        fragment = digit + fragment
    }
    result.unshift(toChineseNumeralUnder亿(fragment))
    if (result[0].startsWith(placeholder))
        { result[0] = result[0].slice(1) }
    return result.join(posChar[8]) || placeholder
}
toChineseNumeral('0')
// => '零'
toChineseNumeral('101')
// => '一百零一'
toChineseNumeral('1000001')
// => '一百万零一'
toChineseNumeral('123456708')
// => '一亿二千三百四十五万六千七百零八'
toChineseNumeral('3274823947329471041041234567080')
// => '三百二十七万四千八百二十三亿九千四百七十三万二千九百四十七亿一千零四十一万零四百一十二亿三千四百五十六万七千零八十'

题目四：
microformats官方定义
Designed for humans first and machines second, microformats are a set of simple, open data formats built upon existing and widely adopted standards.

应用场景:

1. 手机通信录使用vCard, 这是一种电子名片的微格. 导出文件格式为vcf
2. 使用hCard定义的一系列语义化属性作为dom的class进行添加, 增强语义化, 有利于SEO