前端

Proxy 实现双向绑定

Proxy 用于修改某些操作的默认行为，也可以理解为在目标对象之前架设一层拦截，外部所有的访问都必须先通过这层拦截，因此提供了一种机制，可以对外部的访问进行过滤和修改。 <!DOCTYPE html> <html> <head>   <meta charset=“utf-8”>   <title>Proxy双向绑定</title> </head> <body>   <div id=“app”>     <input type=&#82 …

笔记

高效代码审查

代码审查的定义 代码作者以外的其他人对代码进行检查, 以寻找代码的缺陷和可以提高的地方 代码审查的方式 本地编码 本地使用静态检查工具 本地使用单元测试 本地使用工具查看准备发出去的diff 发出审查 通过则puvh 不通过则修改再次提交 代码审查应该检查什么 设计 功能 复杂度 测试 命名 注释 格式 代码审查的收益 直接受益 代码质量 协作效率 研发成本 工程师成长 附带收益 变更决策的审核 工程师社交 如何成功执行代码审查 常见问题 无疾而终 流于形式, 走过场 浪费时间 解决根本: 团队内达成重要的共识 明确代码审查的重要性 计入工作量、计入绩效考核标准 审核统计数据做参考, 主观互评 …

前端

移动端设备分辨率汇总

设备 操作系统 实际尺寸 物理尺寸CM 宽度PX 高度PX 设备宽度 每英寸像素 PX密度 纵横比 Apple iPhone XR iOS 6.1 15.5 828 1792 828 326 100% MDPI 19 . 5 : 9 Apple iPhone 8 Plus iOS 5.5 13.9 1080 1920 1080 401 100% MDPI 16 : 9 Apple iPhone 7 Plus iOS 5.5 14.0 1080 1920 1080 401 100% MDPI 9 : 16 Apple iPhone XS iOS 5.8 14.7 1125 2436 1125 4 …

前端 / 工具

前端逻辑处理工具类

1.去除html标签 export const removeHtmltag = (str) => { return str.replace(/<[^>]+>/g, ”) } 2.获取url参数 export const getQueryString = (name) => { const reg = new RegExp(‘(^|&)’ + name + ‘=([^&]*)(&|$)’, ‘i’); const search = window.location.search.split(‘?’)[1] || ”; const r = s …

前端 / 工具

前端类型判断工具类

1.是否邮箱 export const isEmail = (s) => { return /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/.test(s) } 2.是否手机号码 export const isMobile = (s) => { return /^1[0-9]{10}$/.test(s) } 3.是否电话号码 export const isPhone = (s) => { return /^([0-9]{3,4}-)?[0-9]{7,8}$/.test(s) } 4.是否url地 …

前端

css字符图像生成

实现核心的属性是 background-clip 用于对背景裁剪 属性值： 值 说明 border-box 默认值。背景绘制在边框方框内（剪切成边框方框） padding-box  背景绘制在衬距方框内（剪切成衬距方框） content-box  背景绘制在内容方框内（剪切成内容方框） text  给文本填充图片背景 text-fill-color 用于和背景颜色叠加 <!DOCTYPE html> <html> <head>   <title>背景剪裁属性</title>   <meta http-equiv=“C …