- 博客(99)
- 收藏
- 关注
RSS订阅原创 v-for中key的作用
v-for在渲染的过程中采用就地复用的策略，列表修改数据的时候会根据key来判断某一项是否需要重新渲染，如果该项没有改变则继续复用。我们通常用数组的index来作为key但这其实是一种不推荐的方法。由于jason的插入导致数组的index发生变化，key和数据的一一对应关系也被破坏，那么虚拟dom的diff算法就会以为key和数据不再对应的数据是需要重新渲染的，如此一来就会增加没必要的内存消耗。如果我们直接在数组后面push一条name是john的数据进去，这样用index作为key是没问题的。
2023-09-15 21:07:12
113
原创 javascript 事件循环机制
由于js是单线程，所以需要事件循环机制来处理同步任务和异步任务之间的执行逻辑。那么Js为什么选择单线程呢？这是因为Js主要服务于浏览器中，用于控制浏览器的dom元素，试想下如果js是多线程那么会出现多个线程同时操作一个Dom元素的情况，显然这样是不可取的。
2023-09-14 19:32:04
147
原创 千变万化的Promise
Promise对象代表一个异步操作，有三种状态：pedding(进行中)、fulfilled(已成功)、rejected(已失败)。resovle函数的作用是将Promise对象的状态从pedding变为fulfilled，即从未完成变为成功。reject函数的作用是，将Promise对象的状态从未完成变为失败，在异步操作失败时调用，并将异步操作作为参数传递出去。所谓的Promise，简单来说就是一个容器，里面保存这某个未来才会结束的事件（通常是异步操作）的结果。
2023-09-14 12:57:59
145
原创 原型链（一定要搞懂啊！！！＞-＜）
javascript中每一个对象都有一个“隐式原型”：__proto__；每一个函数都有一个“显示原型”：prototype;对象的隐式原型指向了它的构造函数的显示原型上。
2023-09-12 16:46:05
103
原创 前端八股文之“闭包”
一句话概括闭包：能够访问函数内部变量的函数与这个变量的组合构成了闭包结构。如下代码如代码所示，fuc2和父级变量num构成了一个闭包环境。
2023-09-07 13:17:23
300
原创 vue动态绑定class
在vue框架开发中，有时候我们需要对元素的样式进行动态控制，比如tab按钮的切换。我们可以通过vue指令v-bind对元素的class进行动态控制。控制方式有对象和数组两种。
2023-02-28 10:21:04
2046
原创 js 中 .? 和 ??的用法
他叫做“可选链接操作符”，他的作用是可以省去判断对象属性是否存在就可直接调用。一般情况下当我们要调用对象的属性时，如果对象中没有这个属性，那么浏览器编译时就会报错。获取属性值，则浏览器不会报错。在js中叫做（空值合并操作符），他的作用是用于判断一个值是否为null或undefined，如果跟在他前面的值为null或undefined则取跟在他后面的值，否则就取他前面的值。
2023-02-17 17:19:01
3256
原创 作用域slot的理解与应用
作用域slot可以简单理解为可以传递参数的slot；通过在子组件slot标签上绑定数据，达到在父组件获取子组件信息的作用。
2022-09-26 21:40:40
369
1
原创 VUE slot 的应用
作用slot 意为“插槽”，其作用为子组件预约一个html空间，由调用他的父组件来实现这个空间的具体显示内容。父组件中决定要插入到子组件中的内容，而子组件自行决定插槽的位置。类型1.匿名slot2.具名slot3.作用域slot用法1.匿名slot首先在子组件中需要父组件来确定显示内容的位置定义一个slot。 <template> <div> <slot></slot> <h1>我是子組件</h1
2021-04-30 16:10:04
321
4
原创 VUE--Mixins的理解
个人粗浅的理解仅当学习笔记。Mixins相当于一个VUE组件拥有data、methods、生命周期等。作用：Mixins主要用来把VUE项目中一些公用的方法抽取出来以便复用。用法：1、在项目中创建Mixins文件夹，然后分模块创建自己的Mixins文件，并在该文件中编写公用的方法。2、引入组件中，添加Mixins,然后就可以跟调用自身方法一样去调用mixins中的方法。注意事项：1、当Mixins中的方法与被引入的组件有重名时，被引入组件的方法会自动覆盖...
2021-04-28 11:19:51
327
原创 JavaScript中this最简单的理解
JavaScript中this的指向跟定义它的地方无关，只跟调用它的上下文环境相关（如果存在多级调用，那么它的指向就是离他最近的那个对象）
2020-07-23 16:50:19
169
原创 防止请求频率太高（防抖）的土方法
前端开发会遇到一种情况，用户快速点击某个按钮，然后再前一个请求还未结束的情况下下一个请求又开始了，这样就会导致各种问题，比如参数还未处理到位，或者响应数据为空等等。 来，朋友们，今天就来用最土的方法解决一下此问题。 先说说鄙人遇到的问题吧，如下图，当用户点击人员名称时发送请求，查询该员工数据，然后显示在表格中由于 人员名称需要请求获取，因此在请求该员工数据之前，还要一段时间来获取人员名称，如果用户点击过快，会出现人员名称不匹配或为空的情况，因此需要限制用户的请求次数。...
2020-05-28 17:12:58
891
原创 vuex之store拆分即多模块状态管理(modules)篇
原文：https://blog.csdn.net/wang839305939/article/details/73398585
2019-10-10 11:11:38
505
原创 vue-axios interceptors(拦截器)实际应用
原文：https://www.jianshu.com/p/ff8541e0976a
2019-10-09 16:03:09
763
原创 vue-cli3根据不同环境配置axios的baseUrl
浏览：https://blog.csdn.net/Dj_Fairy/article/details/88928432
2019-10-09 15:34:12
950
原创 vue-cli3 移动端适配方案
需要用到两个插件：1、flexible 此插件的作用是根据屏幕大小自动修改根元素的fontsize，首先需要先安装此插件，然后在main.js中引入“import"lib-flexible"”由于此插件会自动为页面生成<metaname="viewport"content="width=device-width,initial-scale=1.0">所以千万要...
2019-10-09 14:58:53
748
原创 git提交流程
git pull origin remoteBranch(develop ) 从远程develop分支拉取代码到本地git addgit commit -m ...git push origin localBranch(dev):remoteBranch(develop) 把本地dev分支的代码推送到远程develop分支上。...
2019-08-05 14:42:03
166
转载 全局安装和本地安装
命令中，全局安装（global）和本地安装（local）方式的区别为带参数-g和不带参数-g。具体区别：1.安装位置：npm install moduleName ，则是将模块下载到当前命令行所在目录。npm install moduleName -g ，模块将被下载安装到全局目录中，即Node的安装目录下的node_modules下2.调用方式：在代码中，本地安装可以直接通过requ...
2019-07-27 21:29:23
974
原创 Vue组件传参
父子传参通过在子组件中定义props的参数名，然后在父组件中给定义的参数名传值，以达到父子传参的目的。1、子组件在props中定义参数名。 props:["title"]2、父组件给定义参数名赋值。 <myPageSon1 title="nihao" > Are you ok ? </myPageSon1>子父传参在父组件中...
2019-07-21 20:39:36
205
原创 React-redux基本使用
redux在React中的作用类似于vue的vuex用作全局状态管理。其基本的使用流程如下：下载redux 在项目中新建一个store文件夹，其中包括了：state.js、reducer.js、actionCreator.js。 在store.js中使用redux的createStore(reducer)来创建store。注意：必须要关联相应的reducer作为参数 import {c...
2019-07-13 20:24:10
146
原创 React组件传值
React组件之间传值与Vuel类似，分为父-子传值和子-父传值。一、父子传值通过组件的props属性，来达到父组件传值给子组件的目的，二、子父传值在父组件中定义方法，并通过props传递给子组件，子组件通过this.props.funName(data)激活父组件方法，传递“data”值。注意：在父组件通过Props传递自定义方法时一定要用bind(this);绑定this。...
2019-07-12 18:22:47
183
原创 jQuery在html元素中保存数据的 data()方法
jq的attr()方法添加的属性只能是String类型，如果你需要再html元素中保存其他类型的数据，就需要使用data()这个方法。data()方法不能获通过attr()存储的值，它的使用方法如下：设置值：$("element").data("val",obj);获取值：$("element").data("val");...
2019-06-18 14:25:41
1334
原创 ES6的IE兼容问题
习惯用ES6的字符模板来进行数据的渲染，结果IE11浏览器报错，提示字符模板的语句“语法错误”。之后百度搜索解决方案，现总结如下，方便以后避坑。1、项目中加入browser.min.js文件（百度搜索），引入。2、在JS文件标签中加入type="text/babel" 例如：<script type="text/babel" src="js/index.js"></sc...
2019-05-23 10:28:21
5127
转载 layer相关方法
1、访问父页面元素值varparentId=parent.$("#id").val();//访问父页面元素值2、访问父页面方法varparentMethodValue=parent.getMethodValue();//访问父页面方法3、如何关闭弹出的子页面窗口varindex=parent.layer.getFrameIndex(window....
2019-04-18 11:24:45
230
原创 JS数组相关方法总结
一、concat()1、concat(值)给数组尾部添加一个元素，兵返回一个新数组。2、concat(值1、值2、值3....)给数组尾部添加多个元素，并返回一个新数组。 cv03、concat(数组)将调用该方法的数组与添加的数组合并形成新数组，并且返回。4、concat(数组1,数组2,数组3)连接所有数组，并返回这个新数组。Z二、splice()1、s...
2019-02-24 19:39:15
509
原创 伪数组转换为数组的方法
一、创建一个新数组，遍历这个伪数组，并将其每一项添加到新数组中。 var ul=document.getElementsByTagName("li"); var newArr=[]; for(var i=0;i<ul.length;i++){ newArr.push(ul[i]); } console.log(newArr)二、借用...
2019-01-25 14:30:39
2622
1
原创 js的组合继承
组合式继承是最js中最常用的继承方法，它融合了“原型继承”和“借用构造函数继承”的优点，使它拥有了这两种继承所具备的功能：1、子类可以为父类的构造函数传参。2、子类修改从父类继承的引用类型属性，不会影响到其他子类。具体实现方法如下： //构造方法 function Animal (name,age){ this.name=name; this.a...
2019-01-23 08:29:18
456
转载 理解虚拟Dom
什么是虚拟DOM一、前言虚拟DOM概念随着react的诞生而诞生，由facebook提出，其卓越的性能很快得到广大开发者的认可；继react之后vue2.0也在其核心引入了虚拟DOM的概念，本文将以vue2.0使用的snabbdom入手，来介绍虚拟DOM的主要实现原理。二、虚拟DOM在开始介绍snabbdom之前我们想来想两个问题，（1）什么是虚拟DOM？vdom可以看作是...
2019-01-19 08:47:06
438
转载 AMD和CMD的区别
他们两者的共同点就是都是一种框架在推广的过程中对模块定义的规范产出；而且他们都是异步加载模块。AMD即Asynchronous Module Definition,翻译过来就是异步模块化定义，是一个模块化开发的规范。此处是规范链接 那么AMD是怎么弄出来的呢？其实AMD是在RequireJS之后才出来的，是大名鼎鼎的RequireJS产出了这一套模块化开发的概念。那么谈AMD就必须先谈Requ...
2019-01-09 08:41:41
3375
转载 面向对象与面向过程的区别
面向过程就是分析出解决问题所需要的步骤，然后用函数把这些步骤一步一步实现，使用的时候一个一个依次调用就可以了。面向对象是把构成问题事务分解成各个对象，建立对象的目的不是为了完成一个步骤，而是为了描叙某个事物在整个解决问题的步骤中的行为。 面向过程优点：性能比面向对象高，因为类调用时需要实例化，开销比较大，比较消耗资源;比如单片机、嵌入式开发、 Linux/Unix等一般采用面向过程开发...
2019-01-09 08:21:24
440
原创 node遍历文件
var fs=require("fs");var path=require("path")var filePath=path.resolve("E:\\KwDownload\\") fileDisplay(filePath)function fileDisplay(filePath) { fs.readdir(filePath,function(err,files){ ...
2019-01-08 08:53:15
268
原创 sass和less的异同
相同点sass和less都是Css的预处理语言，他们引入了mixins，参数，嵌套规则，运算，颜色，名字空间，作用域，JavaScript赋值等 加快了css开发效率,当然这两者都可以配合gulp和webpack等前端构建工具使用。差异1、less定义变量用“@”，saxx用“$”/*less*/@width：100px;.box{ width:@width;}...
2019-01-07 08:32:53
794
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人