- 博客(34)
- 收藏
- 关注
RSS订阅原创 javascript设计模式之创建型建造者模式
OrderBuilder 类表示订单生成器，它提供了一些方法来设置订单的各个部分，并最终构建出一个完整的订单对象。客户端代码使用 OrderBuilder 来构建一个包含两个商品的订单，并输出它的详细信息。Item 接口表示商品，它有两个具体实现类 Fruit 和 Food，分别表示水果和食品。我们使用建造者模式创建了一个 Order 对象，该对象包含客户名称、送货地址和一些商品。Order 类表示订单，它接受一个 OrderBuilder 对象来构建自己。
2023-04-16 18:54:13
148
1
原创 javascript设计模式之创造型工厂模式
在此示例中，使用了抽象类 Animal 来表示具体的产品，每个具体产品（Cat、Dog 和 Human）都继承自 Animal 并实现它们的 speak 方法。工厂类 AnimalFactory 根据传入的参数来创建相应的产品。这种方式使得工厂可以根据需要创建不同类型的产品，并且可以方便地增加新的产品或工厂。注意在 TypeScript 中，使用了可选链操作符?. 来访问 speak 方法以避免空引用错误。
2023-04-16 17:54:57
134
原创 less文件中无法使用each函数
有时候我们需要在less文件中循环生成一些类名譬如就会需要用到each函数循环设置css选择器规则。于是我就在项目中使用了该函数，但是并没有生效，查询资料https://lesscss.org/functions/可知，该函数是在v3.7.0开始生效，该项目安装的less版本低于该版本，所以无法生效....
2022-06-09 13:59:29
1682
原创 获取网页的LCP
LCP：最大内容绘制var observer = new PerformanceObserver((entryList) => { var perfEntries = entryList.getEntries(); var lastEntry = perfEntries[perfEntries.length - 1]; var lcp = lastEntry.renderTime || lastEntry.loadTime; console.log('LCP:', lcp)});
2022-03-10 10:53:43
419
原创 less 循环生成间距样式 margin padding
@list: 2, 10, 16;each(@list, { .m-r-@{value} { margin-right: @value * 1px; } .m-t-@{value} { margin-top: @value * 1px; } .m-b-@{value} { margin-bottom: @value * 1px; } .m-l-@{value} { margin-left: @value * 1px; } .p-t-@{v
2022-02-09 15:58:20
911
原创 angular8工程错误信息：Error: error:0308010C:digital envelope routines::unsupported
控制台输入这个即可export NODE_OPTIONS=--openssl-legacy-provider
2021-12-04 10:12:45
904
原创 npm does not support Node.js v8.9.3 macbook版本
今天在安装项目依赖的时候，提示npm不支持nodejs的版本，提示信息如下：npm WARN npm npm does not support Node.js v8.9.3npm WARN npm You should probably upgrade to a newer version of node as wenpm WARN npm can't make any promises that npm will work with this version.npm WARN npm You ca
2021-11-28 23:19:13
1010
原创 npm install失败
报错信息：Fix the upstream dependency conflict, or retrynpm ERR! this command with --force, or --legacy-peer-deps使用强制安装的命令解决npm install --force
2021-11-28 23:06:40
165
原创 JS的执行过程与本质
JS引擎#mermaid-svg-9D7YkACliBOKxNlp .label{font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family);fill:#333;color:#333}#mermaid-svg-9D7YkACliBOKxNlp .label text{fill:#333}#mermaid-svg-9D7YkACliBOKxNlp .node rect,#mermaid-svg-9D7Yk
2021-06-14 23:27:47
67
原创 echarts 横向超出容器
1、效果如图：数据超出容器被遮挡住2、解决办法xAxis: { type: "value", // 防止数据横向超出 boundaryGap: ["0", "1%"],设置横轴的boundaryGap属性即可解决
2021-05-12 19:07:24
458
原创 flex布局子元素自动换行
-webkit-flex-wrap: wrap;-moz-flex-wrap: wrap;-ms-flex-wrap: wrap;-o-flex-wrap: wrap;flex-wrap: wrap;
2021-03-01 22:18:51
2267
1
原创 el-input只允许输入数字
有时候输入框里只允许输入数字法一：<el-input v-model="inputValue" onKeypress="return(/^[0-9]*$/.test(String.fromCharCode(event.keyCode)))"></el-input>
2021-01-24 17:37:07
19094
1
原创 前端面试集锦（1）
1、 如何让Chrome支持小于12px的字2、 为什么要清除浮动，清除浮动的方式3、 Img标签的title和Alt有什么区别4、 如何用css实现三角形5、 事件传播的三个阶段6、 什么是事件代理7、 事件代理有什么作用8、 什么是闭包9、 闭包有什么优缺点10、 Js如何实现继承11、 了解事件循环机制吗12、 什么是防抖节流 以及应用场景13、 平时会用es6的哪些特性14、 Var,let,const的区别15、 对前后端跨域可以说一下吗？如何解决跨域的？16、 输入
2021-01-11 20:17:27
61
原创 scss动态生成类名、样式值
常常会有需求 根据不同的状态给元素设置不同的颜色值，类似状态标签等等如图的标签用scss的同学,可以用@each指令 完成一系列样式的设置代码如下：$colors: ( blue: #008fff, grey: #909299, orange: #fa8c16, red: #fe5951, green: #2ac66a,);.status { .label { &:before { content: ""; display
2020-10-22 12:52:19
5116
原创 vue 退出页面前弹出alert窗
let _this = this window.onbeforeunload = function (e) { if (_this.$route.name == "XXX") { e = e || window.event; // 兼容IE8和Firefox 4之前的版本 if (e) { e.returnValue = '关闭提示1111'; } // Chrome, Safari, F
2020-10-08 11:58:23
1038
原创 小程序获取 dom节点 uni-app框架
自定义组件let outter = uni.createSelectorQuery().in(this).select('#outter');outter.fields({size:true},data => { console.log(data.height);}).exec()框架预设组件let outter = uni.createSelectorQuery().select('#outter');outter.fields({size:true},data => {
2020-09-23 21:52:13
2808
原创 Cannot download “https://github.com/sass/node-sass/releases/download/v4.14.1/win 32-x64-72_binding.
Cannot download “https://github.com/sass/node-sass/releases/download/v4.14.1/win32-x64-72_binding.node”:解决方法 npm i node-sass --sass_binary_site=https://npm.taobao.org/mirrors/node-sass/
2020-09-03 16:31:12
1044
原创 vue-cli3查看webpack配置
开发环境npx vue-cli-service inspect --mode development >> webpack.config.development.js生产环境npx vue-cli-service inspect --mode production >> webpack.config.production.js在生成文件前面加上module.exports=
2020-09-03 14:26:52
297
原创 –skip-grant-tables
mysql添加新用户时后报 The MySQL server is running with the –skip-grant-tables option so it cannot execute this statement原因是数据库启动是跳跃了权限表控制出现此类情况，执行下flush privilegesflush privileges 命令本质上的作用是将当前user和privilige表中的用户信息/权限设置从mysql库(MySQL数据库的内置库)中提取到内存里，可以用在修改了mysq.
2020-08-19 23:36:39
400
原创 原型与构造函数
1、对象具有属性__proto__，可称为隐式原型，一个对象的隐式原型指向构造该对象的构造函数的原型2、Function.prototype是所有函数的__proto__，因为Function也是函数，所以Function.proto===Function.prototypeproto、prototype、constructor这三者之间的关系脉络如下图...
2020-08-08 19:41:30
133
原创 ES6可计算属性名
var prefix = 'test';var obj = { [prefix + '1']: 'hello', [prefix + '2']: 'world',}obj['test1']; // helloobj['test2']; // world
2020-08-06 23:39:08
166
原创 对象基础知识回顾
JavaScript的对象用来保存键值对和更复杂的实体创建对象创建对象可以用2种方式来创建// 构造函数var test1 = new Object();// 对象字面量var test2 = {};对象属性的操作var test = {};// 增加test.attr = 'attr1';// "attr1"// 修改test.attr = 'attr2';// "attr2"// 查询test.attr;// "attr2"// 删除delete test.
2020-08-06 23:35:03
97
原创 typescript中使用for in 出现警告：for (... in ...) statements must be filtered with an if statement
typescript中使用for in 出现警告：for (… in …) statements must be filtered with an if statementfor (const index in data)原因因为for in会遍历出对象的所有属性，包括原型链上的可枚举属性，该警告是想让你过滤出你想要遍历的属性而不是所有的属性。方法方法一使用ts中的 // tslin...
2020-03-16 15:19:59
1217
原创 关于parseInt的一道有趣的面试题
突然看到这道面试题，一个小知识点，拿来分享一下var arr = ['1', '2', '3'].map(parseInt)console.log(arr)//[1, NaN, NaN]为啥这数组的后两项是NaN呢，我第一个想到的也是[‘1’,‘2’,‘3’]，首先，从map的参数说起Array.prototype.map((value, index, arr) => {}, th...
2019-11-04 22:27:04
270
原创 【微信分享】的踩坑和总结
本文主要介绍微信分享踩的坑，希望对大家有所帮助要做微信分享内容自定义，需要使用微信JS-SDK官方指导文档：[微信JS-SDK说明文档](https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html)# 公众号设置里面设置js安全域名欢迎使用Markdown编辑器你好！ 这是你第一次使用 Mark...
2019-10-28 01:02:37
576
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人