- 博客(137)
- 收藏
- 关注
原创 localStorage
在HTML5中,新加入了一个localStorage特性,这个特性主要是用来作为本地存储来使用的,解决了cookie存储空间不足的问题(cookie中每条cookie的存储空间为4k),localStorage中一般浏览器支持的是5M大小,这个在不同的浏览器中localStorage会有所不同。
2025-03-06 10:09:17
958
原创 弹性布局(display_flex)属性详解
Flexbox 是 flexible box 的简称(注:意思是“灵活的盒子容器”),是 CSS3 引入的新的布局模式。它决定了元素如何在页面上排列,使它们能在不同的屏幕尺寸和设备下可预测地展现出来。它之所以被称为 Flexbox ,是因为它能够扩展和收缩 flex 容器内的元素,以最大限度地填充可用空间。与以前布局方式(如 table 布局和浮动元素内嵌块元素)相比,Flexbox 是一个更强大的方式:在不同方向排列元素重新排列元素的显示顺序更改元素的对齐方式动态地将元素装入容器。
2025-03-06 10:07:30
741
原创 css实现元素垂直居中显示的7种方式
当居中元素知道宽高的时候,设置居中的方式比较简单单一。三种方法的本质是一样的,都是对居中元素进行绝对定位,在定位到上50%,左50%后再拉回居中元素的一半宽高实现真正的居中。三种方式的区别就在于拉回元素本身宽高的方式不同。
2025-03-06 10:05:36
1259
原创 try-catch-finally的执行顺序
无return,无异常无return,有异常try(未出现异常的前半段) -> catch ->finallytry或catch中有return,无异常try或catch中有return,有异常try(未出现异常的前半段) -> catch ->finally->return(catch)只要是finally中有return的情况不论有没有异常,try或catch中有没有return我们可以看出当finally中有return的时候,相当于此代码肯定会返回该值。
2025-03-06 10:05:05
754
原创 JS一些小知识点
之前第98行的drawFeature方法执行后的feature是用new promise对象里的reslolve进行抛出进行值的获取的,需要在90行里通过then进行接收,上面这种方式和之前处理方式有些区别,直接在drawFeature的callback函数里调用drawCallBack,boxQuery里处理后可以保证调用空间搜索的时候已经获取到了wkt等数据。type: type || 0, // ||在此处用法用于默认值填充,判断是否传参或该值是否存在,如果不存在就使用||后买你的值作为默认值。
2025-03-06 10:03:49
931
原创 loadash知识整理
(boolean)_: 如果 `value` 为一个普通对象,那么返回 `true`,否则返回 `false`。3. `[defaultValue]` _(*)_: 如果解析值是 `undefined` ,这值会被返回。_(boolean)_: 如果`path`存在,那么返回 `true` ,否则返回 `false`。2. `path` _(Array|string)_: 要检查的路径`path`。1. `value` _(*)_: 要检查的值。1. `value` _(*)_: 要检查的值。
2025-03-06 10:03:19
735
原创 js正则表达式
正则表达式( Regular expression)是一组由字母和符号组成的特殊文本, 它可以用来从文本中找出满足你想要的格式的句子。比如我们在网站中看到对用户名规则做出了如下限制:只能包含小写字母、数字、下划线和连字符,并且限制用户名长度在3~15个字符之间,如何验证一个用户名是否符合规则呢?我们使用以下正则表达式:以上的正则表达式可以接受john_doe、jo-hn_doe、john12_as,但不能匹配Jo,因为它包含了大写字母而且长度不到3个字符。
2025-03-06 10:02:44
631
原创 JavaScript数组去重(12种方法,史上最全)
数组去重,一般都是在面试的时候才会碰到,一般是要求手写数组去重方法的代码。如果是被提问到,数组去重的方法有哪些?你能答出其中的10种,面试官很有可能对你刮目相看。在真实的项目中碰到的数组去重,一般都是后台去处理,很少让前端处理数组去重。虽然日常项目用到的概率比较低,但还是需要了解一下,以防面试的时候可能回被问到。注:写的匆忙,加上这几天有点忙,还没有非常认真核对过,不过思路是没有问题,可能一些小细节出错而已。
2025-03-06 10:00:45
1069
原创 深入理解JavaScript的执行机制
既然js是单线程,那就像只有一个窗口的银行,客户需要排队一个一个办理业务,同理js任务也要一个一个顺序执行。Tips:简化讲:先执行一个宏任务(script同步代码),然后执行并清空微任务,再执行一个宏任务,然后执行并清空微任务,再执行一个宏任务,再然后执行并清空微任务…执行new Promise(),Promise构造函数是直接调用的同步代码,所以 console.log( ‘promise1’ )但是微任务2执行后,await async2()语句结束,后面的代码不再被阻塞,所以打印。
2025-03-05 20:44:37
902
原创 forEach,map,for...in,for...of等方法总结及易错点分析
好的,some()已经办不到了,它只会告诉我是否存在,filter()确实可以做到,但是如果我本身就知道这个数组里即使有我想的那个,也肯定只有一个,不可能出现多个,所以,好的,some()已经办不到了,它只会告诉我是否存在,filter()确实可以做到,但是如果我本身就知道这个数组里即使有我想的那个,也肯定只有一个,不可能出现多个,所以,`find()`顾名思义,就是用来在数组中找到我们所需要的元素,并且和`some()`一样,只要有一个满足即返回该元素,不会多余遍历,对性能很友善。
2025-03-05 20:44:04
1027
原创 es6常见知识点
``plain```JavaScript 现在有两种模块。一种是 ES6模块,一种是 CommonJS 模块。CommonJS 模块是 Node.js 专用的,与 ES6 模块不兼容。语法上面,两者最明显的差异是,CommonJS 模块使用require()和,ES6 模块使用import和export。它们采用不同的加载方案。从 Node.js v13.2 版本开始,Node.js 已经默认打开了 ES6 模块支持。Node.js 要求 ES6 模块采用.mjs后缀文件名。
2025-03-05 20:43:33
1063
原创 如何将Promise.then中的值直接return出来
Promise 如何返回值,而不是返回 Promise 对象。实际开发中使用封装好的异步请求函数,为什么调用该函数返回的值一直都是 undefined。
2025-03-05 20:43:02
294
原创 从vue源码解析Vue.set()和this.$set()
最近死磕了一段时间vue源码,想想觉得还是要输出点东西,我们先来从Vue提供的Vue.set()和this.$set()这两个api看看它内部是怎么实现的。
2025-03-05 20:40:11
1777
原创 详解vue中使用refs定位dom出现undefined
await`操作符使用方式如下:expression:可以是任何值,但通常是一个 promise;rv: 可选。如果有且 expression 是非 promise 的值,则 rv 等于 expression 本身;不然,rv 等于兑现的 promise 的值,如果该 promise 被拒绝,则抛个异常(所以await一般被 try-catch 包裹,异常可以被捕获到)。但注意await必须在 async 函数中使用,不然会报语法错误。
2025-03-05 20:39:31
681
原创 TS入门必备
TypeScript 提供最新的和不断发展的 JavaScript 特性,包括那些来自 2015 年的 ECMAScript 和未来的提案中的特性,比如异步功能和 Decorators,以帮助建立健壮的组件。下图显示了 TypeScript 与 ES5、ES2015 和 ES2016 之间的关系:1.安装 TypeScript2.编译 TypeScript 文件当然,对于刚入门 TypeScript 的小伙伴,也可以不用安装 ,而是直接使用线上的 TypeScript Playground 来学习新的语
2025-03-05 20:39:01
754
原创 前端架构师职责
使用window.performance在页面中获取相关页面构建参数,传给后台进行可视化分析。common.css(主题色等相关样式)?如何引入项目,和项目中的~@var的结合使用。1、初始化项目(vue-cli)(如何自己写一个基于ve-cli 的脚手架)如何写一个适用多种场景的公共组件,采用initstall方式注册。JS设计模式分析与理解,如何在现有项目中使用?学习element源码组件封装方法。2、构建和调试(webpack)3、测试(单元测试,集成测试)
2025-03-05 20:36:40
207
转载 深浅拷贝总结(vue的数据赋值联动改变解决方案)
/ 'fiona'// 'fiona'栈:自动分配的内存空间,大小确定会自动释放。存放变量/局部变量/形参等。在js中存放简单数据段(五种基本数据类型:Number、String、Boolean、Null、Undefined),他们是按值存放的,可以直接访问。堆:动态分配的内存,大小不定并且不会自动释放。存放在堆内存中的对象,栈中的变量实际保存的是一个指针,这个指针指向堆中的某一个位置。所以上述例子中,属于浅拷贝,当我们声明一个对象,由于他不属于五种基本数据类型(即非简单数据段。
2025-03-05 19:39:08
11
转载 js基础知识
然后二面就是项目面了,啊好累啊,现在前端真卷啊,其实感觉可以多问点工程化,虽然准备了很多但是没被问上。emmm,因为看评论区嘛,就想说,乐观点,其实也没这么卷,只要自己多写写代码和看看八股文都可以的,当然最重要的还是思考。emm想加群一起卷的可以看沸点作者:溪饱鱼链接:https://juejin.cn/post/7193979904458195005来源:稀土掘金著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
2025-03-05 19:34:32
11
原创 js基础知识总结
替换前代码如下:?123code> A code>code> B code>code> C code>替换后代码如下:?123pre> A pre>pre>
2025-02-19 20:28:25
188
2
转载 vue-cli项目中怎么mock数据
在vue项目中, mock数据可以使用 node 的 express模块搭建服务1. 在根目录下创建 test 目录, 用来存放模拟的 json 数据, 在 test 目录下创建模拟的数据 data.json 文件2.在build目录下的 dev-server.js的文件作如下更改var appData = require('../test/data.json')// 获取...
2025-02-13 20:23:05
17
原创 Vue中extend基本用法
可以看到,extend 创建的是 Vue 构造器,而不是我们平时常写的组件实例,所以不可以通过 new Vue({ components: testExtend }) 来直接使用,需要通过 new Profile().$mount(’#mount-point’) 来挂载到指定的元素上。我个人的理解来看,extend提供了一个能够构造组件的函数(也就是构造器)。在一些特定的应用场景(如自己构建一个复杂弹窗)下,我们使用这种函数式的构造组件的方法,会更灵活一些。(2) 新建messageBox.js。
2023-09-08 11:47:05
2589
原创 peerDependency到底是什么
它告诉 NPM 忽略项目中引入的各个 modules 之间的相同 modules 但不同版本的问题并继续安装,保证各个引入的依赖之间对自身所使用的不同版本 modules 共存。在 NPM v7 中,默认安装 peerDependencies,在我们日常使用的插件例如 babel-plugin-dynamic-import-node、babel-plugin-transform-vue-jsx、lottie-web,它们都依赖于 webpack 进行开发的。正常开发中,我们经常接触到的是。
2023-08-04 15:05:41
1916
原创 前端代码审查清单
前端代码审查清单是一个保证前端代码质量的审查清单。当我们在开发写代码的时候,总会各种各样的问题,自测的时候由于太熟悉自己的代码逻辑往往测试不够充分,无法发现问题。前端代码审查清单就是为了解决这个问题!清单存放了一些常见的问题,当我们开发完成之后,对照清单思考一下这些问题在代码中是否遇到或者妥善处理,从而提高代码质量。由于本人才疏学浅,部分场景没有覆盖,欢迎大家补充更多审查点,提高前端代码质量!
2023-04-24 11:01:24
1273
原创 css设置超出几行显示省略号(单行、多行),兼容数字英文不换行问题,兼容中文字符隔空换行问题
1、单行文本超长显示省略号2、多行文本显示省略号因使用了WebKit的CSS扩展属性,该方法适用于WebKit浏览器及移动端;用来限制在一个块元素显示的文本的行数。为了实现该效果,它需要组合其他的WebKit属性。3、兼容 数字、英文 不换行只需要加入下面的代码4、中文字符隔空换行如上图只需加上下面样式即可。
2023-03-28 10:34:29
2134
转载 Vue2.0源码解析——编译原理
实际上Vue最终在渲染函数的时候是通过js进行渲染的,Vue封装了所有创建DOM的操作,基于虚拟dom来渲染真实dom(真实dom包含太多无用属性,操作起来太消耗性能),因此创建一个虚拟dom对这个虚拟dom进行操作,最后生成一个最终的虚拟dom,然后利用js创建dom的方法生成真实dom。那是以因为当我们在书写出一个Vue的模板的时候,Vue会在内部做一个编译的过程,这个过程就是把我们写的浏览器不认识的带有指令版本的模板(中可以找到所有创建DOM的方法,而这些方法最终会被引用用于创建真正的DOM。
2023-03-21 17:25:17
342
原创 Vue3源码里的一些知识点理解
call 知识点:call 是 Function 对象自带的一个方法,可以改变函数体内部的 this 指向,第一个参数就是 this要指向的对象,也就是想指定的上下文,后面的参数它会按顺序传递进去。如果 data 是个对象,那么整个vue实例将共享一份数据,也就是各个组件实例间可以随意修改其他组件的任意值,但是 data 定义成一个函数,将会 return 出一个唯一的对象,不会和其他组件共享一个对象。官网解释:调用一个对象的一个方法,以另一个对象替换当前对象。data 为什么是个函数而不是个对象?
2023-03-15 16:18:17
304
转载 104道 CSS 面试题,助你查漏补缺
CSS 面试知识点总结最近在整理 CSS 的时候发现遇到了很多面试中常见的面试题,本部分主要原作者在 Github 等各大论坛收录的 CSS 相关知识和一些相关面试题时所做的笔记,分享这份总结给大家,对大家对 CSS 的可以来一次全方位的检漏和排查,感谢原作者 CavsZhouyou 的付出,原文链接放在文章最下方,如果出现错误,希望大家共同指出!1.介绍一下标准的 CSS 的盒子模型?低...
2020-03-25 14:28:28
821
转载 vscode前端常用插件推荐,搭建JQuery、Vue等开发环境
vscode是微软开发的的一款代码编辑器,就如官网上说的一样,vscode重新定义(redefined)了代码编辑器。当前市面上常用的轻型代码编辑器主要是:sublime,notepad++,editplus,atom这几种。比起notepad++、editplus,vscode集成了许多IDE才具有的功能,比起它们更像一个代码编辑器;比起sublime,vscode颜值更高,安装配置插件更为方便...
2020-03-24 19:51:41
377
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人