携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第3天，点击查看活动详情
由来🎉
码上掘金上线以来这段时间也零零碎碎的体验了一下，之前一直用的codepen，由于网络原因体验一直没有本地起一个环境来的好，但在一些特定的条件下比如分享一个片段内的代码还是用这些在线的编码环境会更加方便。
入口
在首页创作者中心旁边的小箭头点击一下就可以找到入口，或者来都来了你也可以从这里进入
界面
从首页入口来说码上掘金跟其他平台还是很不一样的，对比一下codepen的入口，可以很明显的看出掘金目前的版本更纯粹，可能更多的想要让用户专注与自己的代码片段，而分享则放在掘金文章这边，没有像codepen首页那么繁杂。说了这么多没用的，还是直接写代码体验一下吧
布局方面也贴心的支持了5种布局
片段模板
支持vue2 vue3 react或者原生模板，已经非常够用了
功能性
支持自定义头部还有body html的class非常方便
style部分提供了一些基础样式可以选择，也可以添加外部的样式通过cdn的方式引入进来
script也同样支持从外部资源引入
体验
之前看到过一个很有意思的面试题：用Javascript实现一个sleep方法
很多语言都有sleep函数，这边拿Java的举例：主要作用就是让当前线程休眠指定时间，单位毫秒，休眠结束后会继续执行之后的代码，大多用于多线程操作中，所以我们要做的也很简单，卡死当前操作就可以
首先分解一下题目，等待的话我们可以使用await加上Promise，休眠我们可以用上setTimeout来结合，所以编写代码如下
实现一个sleep函数并接收需要等待的时间(ms)如下
const sleep = (time) => {
console.log('sleep')
return new Promise(resolve => {
setTimeout(() => {
resolve()
}, time)
})
}
再来编写一个用于run函数，他将用于调用sleep函数和做一些sleep结束之后的操作 并为他加上async修饰符，这样在run函数中就可以使用await关键字了它将会让我们的程序等待sleep函数中的promise执行结束，或者抛出异常之后再往下运行其他代码
const run = async () => {
console.log('开始执行', new Date().toString(), Date.now())
await sleep(1500)
console.log('执行结束', new Date().toString(), Date.now())
}
完整代码如下，最后，我们来调用一下试验一下，这里贴上码上掘金的代码片段，方便大家阅读，可以直接切换到script标签
const sleep = (time) => {
console.log('sleep')
return new Promise(resolve => {
setTimeout(() => {
resolve()
}, time)
})
}
const run = async () => {
console.log('开始执行', new Date().toString(), Date.now())
await sleep(1500)
console.log('执行结束', new Date().toString(), Date.now())
}
run()
成功实现了sleep函数，跟其他语言比如java自带的还是有很大区别的，这里仅作为参考提供一种思路，希望有大佬可以给出一些更好的方案
总结
码上掘金的体验还是非常好的，尤其是在本地化方面，秒开！！！日常作为debug工具或者片段分享工具还是挺实用的，片段模板也支持了国内主流的框架，style部分也支持了主流的less sass scss等，总之就是古德古德！！！
