自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

乐夫天命兮的博客

聊乘化以归尽,乐夫天命复奚疑!

  • 博客(210)
  • 资源 (2)
  • 收藏
  • 关注

原创 前端工具—— 02-Git的使用

就此例而言,Git 会用两个分支的末端(C4 和C5)和它们的共同祖先(C2)进行一次简单的三方合并计算。Git 没有简单地把分支指针右移,而是对三方合并的结果作一新的快照,并自动创建一个指向它的commit(C6)(如下图所示)。不管是git自动合并成功,还是在人工解决冲突下合并成功,提交之前,都要对代码进行测试。此时,密码就可以修改成功了。这个时候在对两个分支合并,git不会产生冲突,因为两个分支是修改同一文件的不同位置。:两个分支的同一个文件的不同地方合并时,git会自动合并,不会产生冲突。

2022-11-01 09:59:24 48

原创 前端工具——01-VS Code的使用

文章标题:《第一次使用 VS Code 时你应该知道的一切配置》。本文的最新内容,更新于 2020-06-19。大家完全不用担心这篇文章会过时,因为随着 VS Code 的版本更新和插件更新,本文也会随之更新。本文的最新内容,也会在GitHub上同步更新,欢迎 star。VS Code 软件实在是太酷、太好用了,越来越多的新生代互联网青年正在使用它。

2022-11-01 09:56:44 347

原创 前端面试(7)—— 异步和单线程

面试时,关于同步和异步,可能会问以下问题:同步和异步的区别是什么?分别举一个同步和异步的例子一个关于 setTimeout 的笔试题前端使用异步的场景哪些?面试时,关于js运行机制,需要注意以下几个问题:如何理解JS的单线程什么是任务队列什么是 EventLoop理解哪些语句会放入异步任务队列理解语句放入异步任务队列的时机。

2022-10-17 09:51:22 54

原创 前端面试(6)—— 跨域通信

从本章起,对代码的要求没之前那么高了,但是,要求你对知识面的掌握要足够宽。1、什么是同源策略及限制同源策略是一个概念,就一句话。有什么限制,就三句话。能说出来即可。2、前后端如何通信如果你不准备,估计也就只能说出ajax。这个可以考察出知识面。3、如何创建AjaxAjax在前后端通信中经常用到。做业务时,可以借助第三方的库,比如vue框架里的库、jQuery也有封装好的方法。但如果让你用原生的js去实现,该怎么做?这就是考察你的动手能力,以及框架原理的掌握。如果能写出来,可以体现出你的基本功。

2022-10-01 14:22:50 86

原创 详解elementUI中input框无法输和select无法改变的问题

测试中发现项目中在input输入的时候发现input框无法输入进去,以及select改变选项时候无法改变,原因可能是由于组件嵌套太深(不是很了解为啥出现这个问题有没有大神解释一波 )后面无意中发现 elementUI中@input事件可以拿到当前的输入的值。刷新通过this.$forceUpdate() 可以解决这个问题。问题找到了 视图没有更新的问题 那么怎么解决了。这样的话这个问题就解决了。

2022-09-10 09:52:46 215

原创 前端面试(5)—— HTTP协议

一面要讲的内容:HTTP协议的主要特点HTTP报文的组成部分HTTP方法get 和 post的区别HTTP状态码什么是持久连接什么是管线化二面要讲的内容;缓存CSRF攻击。

2022-09-08 14:48:56 55

原创 前端面试(4)—— DOM事件的总结

知识点主要包括以下几个方面:- 基本概念:DOM事件的级别面试不会直接问你,DOM有几个级别。但会在题目中体现:“请用DOM2 ....”。- DOM事件模型、DOM事件流面试官如果问你“**DOM事件模型**”,你不一定知道怎么回事。其实说的就是**捕获和冒泡**。**DOM事件流**,指的是事件传递的**三个阶段**。...

2022-08-04 14:42:13 119

原创 前端面试(3)—— CSS盒模型及BFC

以上几点,从上到下,知识点逐渐递增,知识面从理论、CSS、JS,又回到CSS理论。接下来,我们把上面的六条,依次讲解。

2022-08-03 11:31:27 84

原创 前端面试(2)——页面布局

页面布局CSS盒模型:是CSS的基石。DOM事件HTTP协议面向对象原型链:能说出原型链的始末涉及到的知识点:(1)语义化掌握到位:每个区域用section、article代表容器、div代表块儿。如果通篇都用 div,那就是语义化没掌握好。(2)页面布局理解深刻。(3)CSS基础知识扎实。(4)思维灵活且积极上进。题目中可以通过网格布局来体现。(5)代码书写规范。注意命名。上面的代码中,没有一行代码是多的。...

2022-08-03 11:30:19 257

原创 前端面试(1)——准备

技术面试:问技术问题。负责人面试:考察综合能力。比如:项目把控能力、项目深度、项目架构、业务等。hr 面试:侧重于性格、沟通、潜力等。每轮面试在一小时左右。概念:职位描述:注重的是工作职责。任职要求:要求的是工作能力。通常描述得很细致。PS:前端的知识庞大,不可能所有的内容都准备好,但是要向“任职要求”靠拢。分析职位描述(JD)的目的是:快速识别出这个岗位是否是自己喜欢的、想要的。目前的技能是否能胜任岗位的要求。短期内的准备能否胜任。面试问的问题,很大层次上,取决你的简历和自我介绍。...

2022-08-03 11:29:10 430

原创 前端性能优化认知

通常来讲,前端性能优化是指:从用户开始访问网站到整个页面完整地展现出来的过程中,通过各种优化策略和优化方法,让页面加载得更快,让用户的操作相应更及时,给用户更好的使用体验。优化是在做什么:客户端和服务器端建立连接、加载资源、解析资源并渲染。[译]JavaScript 的时间消耗。...

2022-08-03 11:24:11 516

原创 代码review

代码日常review

2022-07-07 14:47:09 97

原创 Visual Studio Code自动生成vue模板

在使用vs开发vue中经常新建vue文件进行模块开发,新建文件结构着实痛苦于是百度配置一下自己的vs编辑器:1.点击vs左下角设置选择用户代码片段2.输入vue回车,将下边代码复制粘贴到vue.json进行保存{ "Print to console": { "prefix": "vue", "body": [ "<template>", " <di...

2022-05-02 11:16:03 332

原创 axios封装及API接口管理

在src文件夹下新建api文件夹,并新建index.js用来作为axios封装index.js代码如下import axios from 'axios'import config from '../config/server.js'import qs from 'qs'import Vue from 'vue'import { getToken } from '../utils/com...

2022-05-02 11:15:48 85

原创 some() 方法详解

定义和用法some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。some() 方法会依次执行数组的每个元素:如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。如果没有满足条件的元素,则返回false。作用:用于检测数组中的元素是否满足指定条件(函数提供)。会依次执行数组的每个元素:如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。every:一假即假:some:一真即真注意: some() 不会对空数组进行检测。注意:

2022-05-02 11:05:40 3458

原创 map()方法详解

map() 方法创建一个新数组,这个新数组由原数组中的每个元素都调用一次提供的函数后的返回值组成。map 方法会给原数组中的每个元素都按顺序调用一次 callback 函数。callback 每次执行后的返回值(包括 undefined)组合起来形成一个新数组。 callback 函数只会在有值的索引上被调用;那些从来没被赋过值或者使用 delete 删除的索引则不会被调用。因为map生成一个新数组,当你不打算使用返回的新数组却使用map是违背设计初衷的,请用forEach或者for-of替代。你不该使

2022-05-02 10:55:23 5007

原创 reduce()方法详解

定义和用法reduce() 方法将数组缩减为单个值。reduce() 方法为数组的每个值(从左到右)执行提供的函数。函数的返回值存储在累加器中(结果/总计)。注释:对没有值的数组元素,不执行 reduce() 方法。注释:reduce() 方法不会改变原始数组。语法array.reduce(function(total, currentValue, currentIndex, arr), initialValue)参数值参数描述function(total, curren

2022-05-02 10:17:06 6798 1

原创 Object.keys()的详解和用法

一、语法Object.keys(obj)参数:要返回其枚举自身属性的对象返回值:一个表示给定对象的所有可枚举属性的字符串数组在实际开发中,我们有时需要知道对象的所有属性;ES5 引入了Object.keys方法,成员是参数对象自身的(不含继承的)所有可遍历( enumerable )属性的键名。二、处理对象,返回可枚举的属性数组let person = {name:"张三",age:25,address:"深圳",getName:function(){}}Object.keys(person

2022-05-01 09:50:09 17019

原创 React V18.0.0

Concurrent ModeConcurrent Mode(以下简称 CM)翻译叫并发模式,这个概念我已经听了好多年了,并且一度非常担忧React 官方憋了好多年的大招,会不会是一个破坏性不兼容的超级大版本?就像 VUE v3 和 v2。现有的生态是不是都得跟着大版本升级?比如 ant design,ahooks 等。随着对 CM 的了解,我发现它其实是人畜无害的。CM 本身并不是一个功能,而是一个底层设计,它使 React 能够同时准备多个版本的 UI。在以前,React 在状态变更后

2022-04-22 10:57:17 155

原创 Element中如何对el-select进行失焦校验

想要实现的效果是当选择框失去焦点的时候会显示出校验提示,解决的办法如下:因为使用的是element中的el-select组件,所以可以根据框架中提供的校验方式来进行校验1、首先在el-form上加上rules属性并在data中进行定义:2、在下拉选择框中定义一个失去焦点事件:3、利用表单组件示例中的方法:handleChangeSelect(key, value) { this.$refs.ruleForm[value ? 'clearValidate' : 'validateField.

2022-03-29 09:55:36 2756

原创 vue项目webpack打包css顺序异常导致警告问题解决 couldn‘t fulfill desired order of chunk group(s)

看到这个报错真的是一头雾水后来发现是ExtractTextWebpackPlugin插件编译提示的预警:解决问题先看的懂预警提示信息:明白了这句话后就知道了是组件顺序加载出现问题:提示后边的“,”号代表正确的有几个不正确的有几个;然后全局搜索引用组件顺序,调整后执行提示消失。...

2022-03-23 14:22:49 2017

原创 基于ElementUI input 实现IPinput

实现效果代码:<template> <div :class="['ip-input-container', 'input240', disabled && 'is-disabled']" @paste="handlePaste" > <span v-for="(item, index) in list" :key="index" class="item"> <el-input :ref

2022-03-10 10:10:10 994

原创 JavaScript 循环方法梳理使用场景

1 、 forvar arr = [1,2,3];var len = arr.length;// for breakfor(var i = 0; i < len; i += 1){ for(var j = 0; j < 3; j++){ if(j === 1){ break; } console.log(arr[i]+'-'+j); }}结果:1)break:break退出当前循环,也就是

2022-03-01 11:07:17 344

原创 review过程汇总

在开发中,我们本身就使用es6+语法,一定要把自己的代码用到极致,多想、多看,提高自身的编码能力。es6+语法一定要熟,W3C标准多看 vue-组件名一定要以大写开头!!!一个方法中定义的变量当使用一次时,就不要定义变量了,直接返回不更好 forEacrh, map, filter, some这些方法,当只有一层判断或是数据处理时,可不用写return,如下:arr.map(el => xxxx)能用js-内置方法,一定不要自创方法,除非你非常自信 if 慎用,多想想是不是可以用更优的方.

2022-02-28 11:33:57 366

原创 GitLab进阶之路之.gitlab-ci.yml

要使用 GitLab CI/CD,您需要:托管在 Git 存储库中的应用程序代码。.gitlab-ci.yml在存储库根目录中调用的文件,其中包含 CI/CD 配置。在.gitlab-ci.yml文件中,您可以定义:您要运行的脚本。您想要包含的其他配置文件和模板。依赖项和缓存。要按顺序运行的命令和要并行运行的命令。将应用程序部署到的位置。您是要自动运行脚本还是手动触发其中的任何脚本。脚本被分组到作业中,作业作为更大管道的一部分运行。您可以将多个独立作业分组为按定义顺序运行的阶段。

2021-12-02 11:26:27 799

原创 GitLab CI/CD概念

通过软件开发的持续方法,您可以持续构建、测试和部署迭代代码更改。这种迭代过程有助于减少您基于有缺陷或失败的先前版本开发新代码的机会。使用这种方法,您可以努力减少从开发新代码到部署的人工干预,甚至根本不需要干预。连续法的三种主要方法是:持续集成持续交付持续部署持续集成考虑一个应用程序,它的代码存储在 GitLab 的 Git 存储库中。开发人员每天多次推送代码更改。对于每次推送到存储库,您可以创建一组脚本来自动构建和测试您的应用程序。这些脚本有助于减少您在应用程序中引入错误的机会。这种做法称

2021-12-02 11:11:37 991

原创 Duplicated key ‘isFetch‘ vue/no-dupe-keys

最晕的报错出现了::脑子不知道在干嘛?然后就暗自自黑记录一下这个愚蠢的行为。。。。。

2021-11-23 11:17:39 4211 3

原创 [Vue warn]: Avoid using non-primitive value as key, use string/number value instead.

那么问题来了这个报错是什么意思呢???还是老方法,先暴力翻译一下报错语句的意思:key值是必须唯一的,如果重复就会报错可以把key值改为index或者id,就可以避免这个情况(这里key最好用id,才能达到key值唯一,就地复用的原则,大大节省了dom的渲染)...

2021-10-19 10:34:05 490

原创 寻找两个正序数组的中位数

给定两个大小分别为 m 和 n 的正序(从小到大)数组 nums1 和 nums2。请你找出并返回这两个正序数组的 中位数 。示例 1:输入:nums1 = [1,3], nums2 = [2]输出:2.00000解释:合并数组 = [1,2,3] ,中位数 2示例 2:输入:nums1 = [1,2], nums2 = [3,4]输出:2.50000解释:合并数组 = [1,2,3,4] ,中位数 (2 + 3) / 2 = 2.5示例 3:输入:nums1 = [0,0],

2021-09-16 14:28:37 28

原创 无重复字符的最长子串

给定一个字符串 s ,请你找出其中不含有重复字符的 最长子串 的长度。示例 1:输入: s = “abcabcbb”输出: 3解释: 因为无重复字符的最长子串是 “abc”,所以其长度为 3。示例 2:输入: s = “bbbbb”输出: 1解释: 因为无重复字符的最长子串是 “b”,所以其长度为 1。示例 3:输入: s = “pwwkew”输出: 3解释: 因为无重复字符的最长子串是 “wke”,所以其长度为 3。请注意,你的答案必须是 子串 的长度,“pwke” 是

2021-09-15 10:41:49 32

原创 多年前三月随感

偶然间翻出自己大学时期写的一些内心活动,挺好的,所思所想记下来。  今天是乙未年 己卯月 乙巳日羊年的第89天,离今年的结束还有276天。今年特别的想家,多少年的情感在这一瞬迸发。离家十年读书的时间一晃就真的十年了。古人有十年寒窗苦读,只为一朝金榜题名。想我如今已经将近读了16年的书,可依旧是一事无成。想这一路走来的确坎坷。少年多病多灾,好在有个严厉要求我的母亲和永远把我的学业放在第一位的老爸。   小时候特想过现在的日子 ,没有作业,没有考试,没有父母的逼迫。于是在15岁的时候就做了一个很蠢的决定.

2021-09-13 15:26:20 56 2

原创 JavaScript BOM的介绍

JavaScript的组成JavaScript基础分为三个部分:ECMAScript:JavaScript的语法标准。包括变量、表达式、运算符、函数、if语句、for语句等。DOM:文档对象模型,操作网页上的元素的API。比如让盒子移动、变色、轮播图等。BOM:浏览器对象模型,操作浏览器部分功能的API。比如让浏览器自动滚动。什么是BOMBOM:Browser Object Model,浏览器对象模型。BOM的结构图:从上图也可以看出:window对象是BOM的顶层(

2021-09-13 09:55:56 146

原创 JavaScript原型对象

原型的引入 function Person(name, age, gender) { this.name = name; this.age = age; this.gender = gender; //向对象中添加一个方法 this.sayName = function () { console.log("我是" + this.name);

2021-09-13 09:52:40 53

原创 JavaScript事件委托

事件委托事件委托,通俗地来讲,就是把一个元素响应事件(click、keydown…)的函数委托到另一个元素。比如说有一个列表 ul,列表之中有大量的列表项 <a>标签:<ul id="parent-list"> <li><a href="javascript:;" class="my_link">超链接一</a></li> <li><a href="javascript:;" class="my_

2021-09-10 14:23:35 45 1

原创 JavaScript事件的传播和事件冒泡

DOM事件流事件传播的三个阶段是:事件捕获、事件冒泡和目标。事件捕获阶段:事件从祖先元素往子元素查找(DOM树结构),直到捕获到事件目标 target。在这个过程中,默认情况下,事件相应的监听函数是不会被触发的。事件目标:当到达目标元素之后,执行目标元素该事件相应的处理函数。如果没有绑定监听函数,那就不执行。事件冒泡阶段:事件从事件目标 target 开始,从子元素往冒泡祖先元素冒泡,直到页面的最上一级标签。如下图所示:PS:这个概念类似于 Android 里的 touch 事

2021-09-10 14:20:37 218 1

原创 JavaScript浅拷贝和深拷贝

概念浅拷贝:只拷贝最外面一层的数据;更深层次的对象,只拷贝引用。深拷贝:拷贝多层数据;每一层级别的数据都会拷贝。总结:拷贝引用的时候,是属于传址,而非传值。关于传值和传址的区别,是很基础的内容,详见《JavaScript 基础/对象简介.md》这篇文章。深拷贝会把对象里所有的数据重新复制到新的内存空间,是最彻底的拷贝。浅拷贝的实现方式用 for in 实现浅拷贝(比较繁琐)const obj1 = { name: 'qianguyihao', age: 28,

2021-09-10 14:15:16 32

原创 JavaScript作用域和变量提升

作用域(Scope)的概念概念:通俗来讲,作用域是一个变量或函数的作用范围。作用域在函数定义时,就已经确定了。目的:为了提高程序的可靠性,同时减少命名冲突。作用域的分类在 JS 中,一共有两种作用域:(ES6 之前)全局作用域:作用于整个 script 标签内部,或者作用域一个独立的 JS 文件。函数作用域(局部作用域):作用于函数内的代码环境。作用域的访问关系在内部作用域中可以访问到外部作用域的变量,在外部作用域中无法访问到内部作用域的变量。代码举例:var a

2021-09-10 14:12:16 118 1

原创 JavaScript变量的数据类型:基本数据类型和引用数据类型

变量的数据类型为什么需要数据类型在计算机中,不同的数据所需占用的存储空间不同,为了充分利用存储空间,于是定义了不同的数据类型。而且,不同的数据类型,寓意也不同。我们都知道,无论这个变量是字符串类型,还是数字类型,我们都可以直接用 var 去定义它。比如:var a = 'hello word';var b = 123;为什么可以这样做呢?这是因为:JavaScript 是一种「弱类型语言」,或者说是一种「动态语言」,这意味着不需要提前声明变量的类型,在程序运行过程中,类型会自动被确定。JS

2021-09-10 09:54:39 98

原创 JavaScript简介

JavaScript背景Web前端有三层:HTML:从语义的角度,描述页面结构CSS:从审美的角度,描述样式(美化页面)JavaScript:从交互的角度,描述行为(实现业务逻辑和页面控制)发展历史JavaScript诞生于1995年。网景公司的员工布兰登 • 艾奇(Brendan Eich,1961年~)在1995年开发出了 JavaScript 语言。JavaScript是由网景公司(Netscape)发明,最初命名为LiveScript;1995年12月与SUN公司合作,

2021-09-10 09:52:06 328

原创 VS Code的使用

前言文章标题:《第一次使用 VS Code 时你应该知道的一切配置》。本文的最新内容,更新于 2020-06-19。大家完全不用担心这篇文章会过时,因为随着 VS Code 的版本更新和插件更新,本文也会随之更新。本文的最新内容,也会在GitHub上同步更新,欢迎 star。VS Code 软件实在是太酷、太好用了,越来越多的新生代互联网青年正在使用它。前端男神尤雨溪大大这样评价 VS Code:有一点你可能会感到惊讶:VS Code 这款软件本身,是用 JavaScript 语言编写的

2021-09-09 09:59:39 3227 1

SVG+CSS3圆形倒计时滚动条动画效果

SVG+CSS3圆形倒计时滚动条动画效果,采用canvas技术进行实现

2018-03-16

easyUI三级菜单

采用easyUI进行平台框架搭建的模板,参照此模板能够快速进行前端架构搭建

2018-03-16

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除