export function copyToBoard(value) {
const element = document.createElement('textarea')
document.body.appendChild(element)
element.value = value
element.select()
if (document.execCommand('copy')) {
document.execCommand('copy')
document.body.removeChild(element)
return true
}
document.body.removeChild(element)
return false
}
使用方式:
//如果复制成功返回true
copyToBoard('lalallala')
原理：
-
创建一个textare元素并调用select()方法选中
-
document.execCommand('copy')方法，拷贝当前选中内容到剪贴板。
3. 休眠多少毫秒
/**
-
休眠xxxms
-
@param {Number} milliseconds
*/
export function sleep(ms) {
return new Promise(resolve => setTimeout(resolve, ms))
}
//使用方式
const fetchData=async()=>{
await sleep(1000)
}
4. 生成随机字符串
/**
-
生成随机id
-
@param {*} length
-
@param {*} chars
*/
export function uuid(length=8, chars='0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ') {
let result = ''
for (let i = length; i > 0; --i)
result += chars[Math.floor(Math.random() * chars.length)]
return result
}
使用方式
//第一个参数指定位数，第二个字符串指定字符，都是可选参数，如果都不传，默认生成8位
uuid()
使用场景：用于前端生成随机的ID,毕竟现在的Vue和React都需要绑定key
5. 简单的深拷贝
/**
*深拷贝
-
@export
-
@param {*} obj
-
@returns
*/
export function deepCopy(obj) {
if (typeof obj != 'object') {
return obj
}
if (obj == null) {
return obj
}
return JSON.parse(JSON.stringify(obj))
}
缺陷：只拷贝对象、数组以及对象数组，对于大部分场景已经足够
const person={name:'xiaoming',child:{name:'Jack'}}
deepCopy(person) //new person
6. 数组去重
/**
-
数组去重
-
@param {*} arr
*/
export function uniqueArray(arr) {
if (!Array.isArray(arr)) {
throw new Error('The first parameter must be an array')
}
if (arr.length == 1) {
return arr
}
return [...new Set(arr)]
}
原理是利用Set中不能出现重复元素的特性
uniqueArray([1,1,1,1,1])//[1]
7. 对象转化为FormData对象
/**
-
对象转化为formdata
-
@param {Object} object
*/
export function getFormData(object) {
const formData = new FormData()
Object.keys(object).forEach(key => {
const value = object[key]
if (Array.isArray(value)) {
value.forEach((subValue, i) =>
formData.append(key + [${i}], subValue)
)
} else {
formData.append(key, object[key])
}
})
最后
中年危机是真实存在的，即便有技术傍身，还是难免对自己的生存能力产生质疑和焦虑，这些年职业发展，一直在寻求消除焦虑的依靠。
-
技术要深入到什么程度？
-
做久了技术总要转型管理？
-
我能做什么，我想做什么？
-
一技之长，就是深耕你的专业技能，你的专业技术。（重点）
-
独立做事，当你的一技之长达到一定深度的时候，需要开始思考如何独立做事。（创业）
-
拥有事业，选择一份使命，带领团队实现它。（创业）
一技之长分五个层次
-
栈内技术 - 是指你的前端专业领域技术
-
栈外技术 - 是指栈内技术的上下游，领域外的相关专业知识
-
工程经验 - 是建设专业技术体系的“解决方案”
-
带人做事 - 是对团队协作能力的要求
-
业界发声 - 工作经验总结对外分享，与他人交流
永远不要放弃一技之长，它值得你长期
信仰持有。
主要内容包括html，css，html5，css3，JavaScript，正则表达式，函数，BOM，DOM，jQuery，AJAX，vue 等等。
