- 博客(50)
- 收藏
- 关注
原创 webpack 性能优化
webpack性能优化优化开发体验优化输出质量优化开发体验提升效率优化构建速度优化使⽤体验优化输出质量优化要发布到线上的代码,减少⽤户能感知到的加载时间提升代码性能,性能好,执⾏就快缩⼩⽂件范围 Loader优化loader配置test include exclude三个配置项来缩⼩loader的处理范围推荐inclu...
2021-06-16 21:43:00
206
原创 nginx 启动出现 [error] open() "/usr/local/nginx/logs/nginx.pid" failed (2: No such file or directory)...
在做Vue 项目上线时,修改nginx.conf文件做反向代理时出现重启nginx,失败于是上网查找资料解决一番1.首先输入命令 ps -ef | grep nginx检查一下nginx服务是否在运行。2.停止Nginx服务cd /usr/local/nginx/sbin./nginx -s stop //发现停止不了3.打开nginx.conf配置文件,把下面红色部分打开,...
2020-07-18 17:14:00
933
原创 Vue中的组件传值
1.父传子通过props传值语法:v-bind:子组件props中的变量名= “父组件中的data中定义的数据”父组件:Vue.component('Father',{ template: '#father', data () { return { money: 2000 } } })子组件:通过prop...
2020-07-18 16:03:00
139
原创 computed和watch的区别?
计算属性computed:支持缓存,只有依赖数据发生改变,才会重新进行计算不支持异步,当computed内有异步操作时无效,无法监听数据的变化computed 属性值会默认走缓存,计算属性是基于它们的响应式依赖进行缓存的,也就是基于data中声明过或者父组件传递的props中的数据通过计算得到的值如果一个属性是由其他属性计算而来的,这个属性依赖其他属性,是一个多对一或者一对一,...
2020-07-18 15:07:00
617
原创 vue中v-if和v-show有什么区别?
两个都是让元素不可见。但是两个选项有区别v-if 在条件切换时,会对标签进行适当的创建和销毁,而v-show则仅在初始化时加载一次,因此v-if的开销比v-show大v-show控制的时元素的display属性,无论初始条件是否成立,都会渲染标签。而v-if是惰性的,只有在条件成立时才渲染为真实的标签,条件为假,不会去渲染标签项目中如何使用?当初始条件为假时,v-show初...
2020-07-18 14:51:00
518
原创 为什么vue组件中data必须是一个函数?
在函数内声明实例属性保存data,每个实例对象的data都是经过一次函数执行得到有不同的返回结果,所以返回data的值具有自己独立的作用域。在定义Vue实例时,给Vue传参是一个对象,对象中data就是一个函数,Vue在实例化的时候会调用这个函数每个实例都会返回新的值,data得到不同的值作用域另外,赋值函数不一定要定义在原型上,也可以定义为函数或类的实例方法总结对象为...
2020-07-18 14:41:00
638
原创 vue的生命周期的理解?
1.什么是vue生命周期?Vue 实例从创建到销毁的过程,就是生命周期。从开始创建、初始化数据、编译模板、挂载Dom→渲染、更新→渲染、销毁等一系列过程,称之为 Vue 的生命周期。2.vue生命周期的作用是什么?它的生命周期中有多个事件钩子,让我们在控制整个Vue实例的过程时更容易形成好的逻辑3.生命周期是谁的?谁在用生命周期组件4.为什么我们需要使用生命周期?...
2020-07-18 14:32:00
243
原创 JS 事件循环怎么处理宏任务和微任务?
前言我们知道JavaScript的单线程,与它的用途有关。作为浏览器脚本语言,JavaScript的主要用途是与用户互动,以及操作DOM。这决定了它只能是单线程,否则会带来很复杂的同步问题。比如,假定JavaScript同时有两个线程,一个线程在某个DOM节点上添加内容,另一个线程删除了这个节点,这时浏览器应该以哪个线程为准?所以,为了避免复杂性,从一诞生,JavaScript就是...
2020-04-28 19:24:00
268
原创 浅谈json.stringify()与json.parse()的区别以及JSON.stringify()与toString()的区别
一、JSON.stringify()与JSON.parse()的区别前言在做项目时候,经常遇到JSON.stringify()和JSON.parse()之间的来回转换。JSON 的常规用途是同 web 服务器进行数据交换。在向 web 服务器发送数据时,数据必须是字符串。通过 JSON.stringify() 把 JavaScript 对象转换为字符串。对 JavaScri...
2020-04-25 20:44:00
193
原创 各种文件MIME_type对照表
MIME_type对照表{".3gp", "video/3gpp"}, {".apk", "application/vnd.android.package-archive"}, {".asf", "video/x-ms-asf"}, {".avi", "video/x-msvideo"}, {".bin", "application...
2020-04-25 13:01:00
340
原创 浅谈 JS 的防抖和节流
浅谈 JS 的防抖和节流前言:在了解防抖和节流之前,我们来认识聚焦事件和键盘事件一、聚焦事件 (focus、blur、input)FocusEvent事件焦点事件主要用于表单元素,以及超链接,使用点击或者tab可以切换汇聚焦距,当input聚焦是触发focus,失去焦点时触发blurfoucs 是汇聚焦距 一般汇聚焦距时,会有outline样式blur 失去焦点事...
2020-04-18 22:01:00
276
原创 Js 事件侦听和删除
事件侦听addEventListener : 非 IE 7 8 下使用语法: 元素.addEventListener('事件类型', 事件处理函数, 冒泡还是捕获)要点:侦听事件函数不能带入参数;侦听事件函数有且仅有一个参数e,就是事件接收到事件对象,其他函数没有;事件函数不能写return 返回值,但是可以用return跳出,不再执行下去; <butto...
2020-04-18 18:12:00
766
原创 Js 事件原理与事件委托
事件原理三阶段捕获(有外向内)、目标、冒泡(由内向外)事件冒泡(event bubbling),即事件开始时由最具体的元素(文档中嵌套层次最深的那个节点)接收,然后逐级向上传播到较为不具体的节点(文档)。即子标签发生事件后,向父级发送该事件,一直追溯到document。如:点击一个嵌套在 body中的button,则该button的onclick事件也会传递给body、docume...
2020-04-18 16:21:00
122
原创 JS 的事件基础、事件侦听与抛发、
前言JavaScript是一种事件驱动型语言。事件驱动是指JavaScript引擎并不是在看到代码之后就会立即执行,而是会在合适的时间才去执行。这个合适的时间是指当某个事件发生之后(例如一个输入框的内容发生了变化,这就是一个事件)。只有当相应的事件发生了之后,相应的操作才会执行,这就是事件驱动。事件驱动包含三个关键内容:事件、事主和处理方法。理解了事件模型,我们就能明白JavaSc...
2020-04-18 12:13:00
424
原创 For循环详解
for语句学过c语言都对循环结构不陌生,尤其是for循环,他是C语言中最有特色的循环语句,使用最为灵活。形式结构:for(表达式1;表达式2;表达式3){循环体结构}每部分的作用表达式1:一般作为循环变量赋初始值;表达式2:循环继续的条件,即能判断出真假的条件,一般为关系表达式;表达式3:用于循环变量的的改变,可加=加法,可减法.执行顺序(1)求解表达式1(只执行一次)...
2020-03-21 23:49:00
2227
原创 CSS3 制作正方体
一、预备知识变形属性2D变形属性transform:他是css3中的变形属性:通过transform(变形) 来实现2d 或者3d 转换,其中2d 有,缩放 scale(x, y) ,移动 translate(x, y),旋转 rotate(deg),倾斜 skew(deg, deg) ,矩阵matrix() ,3D就是在2D基础上增加了Z轴,2D属性仍可以使用。3D转...
2020-03-08 22:09:00
595
原创 BFC的理解与应用
什么是BFC(Block formatting contexts)BFC的通俗理解: 首先BFC是一个名词,是一个独立的布局环境,我们可以理解为一个箱子(实际上是看不见摸不着的),箱子里面物品的摆放是不受外界的影响的。转换为BFC的理解则是:BFC中的元素的布局是不受外界的影响(我们往往利用这个特性来消除浮动元素对其非浮动的兄弟元素和其子元素带来的影响...
2020-03-03 19:49:00
117
原创 CSS盒模型属性详细介绍
一、概述 CSS盒模型是定义元素周围的间隔、尺寸、外边距、边框以及文本内容和边框之间内边距的一组属性的集合。 示例代码: 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Do...
2020-02-24 21:39:00
1425
1
原创 PHP 5.6连接MySQL 8.0版本遇到的坑
一、数据库失败Warning: mysqli_connect(): The server requested authentication method unknown to t...1 <?php2 3 //查询数据的查询语句4 //1.建立与数据库服务器之间的连接5 $connection = @mysqli_connect('127.0.0.1','roo...
2019-11-12 18:41:00
1624
原创 Math.max.apply()用法
apply的一些其他巧妙用法Math.max.apply( null, [12,23,34,45] ); //细心的人可能已经察觉到,在我调用apply方法的时候, // 第一个参数是对象(this), // 第二个参数是一个数组集合, // 在调用Person的时候,他需要的不是一个数组, // ...
2019-11-07 20:57:00
2543
1
原创 push和appendChild的区别
概述:绑定事件(push和appendChild用法相似:但是一个是控制数组,一个是控制元素节点)用法:1.数组1的更改后的长度 = 数组1.push();//用来控制数组,在数组最后面插入项,返回数组的长度 2.父节点.appendChild(新节点);//在父节点的最后添加一个新节点...
2019-10-30 17:52:00
320
原创 去除数组中的重复元素
var arr = [1,2,3,4,5,2,3,4]; console.log(arr); var aaa = fn(arr); console.log(aaa); //思路:创建一个新数组,循环遍历,只要新数组中有老数组的值,就不用再添加了。 function fn(array){ var newArr = ...
2019-10-25 21:24:00
221
原创 找出数组中的元素出现次数
var arr5 = ["c","a","x","a","x","a"]; var json = {};for(var i=0;i<arr5.length;i++){ //判断数组中的元素,在json中是否存在属性值。 if(json[arr5[i]]){ json[arr5[i]] += 1; ...
2019-10-25 21:17:00
217
原创 js数组的遍历(API)
1.for 循环普通遍历方法,可优化,存下数组的length,避免每次都去获取数组的length,性能提升for(var i=0;i<arr.length;i++){ console.log(arr[i]); }2.for-in不仅可遍历数组还可以遍历对象for(key in obj)该方法可以读取对象本身的成员属性,又可以遍历出对象的...
2019-10-25 20:37:00
454
原创 js中的回调函数
回调函数就是一个参数,将这个函数作为参数传到另一个函数里面,当那个函数执行完之后,再执行传进去的这个函数。这个过程就叫做回调。看代码://定义主函数,回调函数作为参数function A(callback) { callback(); console.log('我是主函数'); }//定义回调函数function B...
2019-10-25 20:15:00
49
原创 数组的连接和截取(contact和slice和splice)
1 <script> 2 3 var arr1 = ["a","b","c"]; 4 var arr2 = [1,2,3]; 5 6 //concat把数组链接在一起 7 var arr3 = arr1.concat(arr2); 8 var arr4 = arr2.concat(arr1...
2019-10-25 19:56:00
1396
原创 数组的翻转和排序
<script>//数组排序:sort(功能很强大!能对数字和字母进行排列。 // 回调函数。 console.log(arr2.sort(function (a,b) {// a-b升序// b-a降序 return a-b; }));...
2019-10-25 19:26:00
86
原创 数组的增加与删除(push、pop、unshift、shift)
1、 数组增删和换位置(原数组将被修改) push() //在数组最后面插入项,返回数组的长度 数组1改后的长度 = 数组1.push(元素1); pop() //取出数组中的最后一项,返回最后一项 被删除的元素 = 数组1.pop(); unshift() //在数组最前面插入项,返回数组的长度 数组1改...
2019-10-25 19:21:00
559
原创 伪数组
1 <script> 2 3 fn(1,2,3,4,5); 4 function fn(a,b){ 5 //只在函数中使用,实参的数组。 6 arguments[0] = 0;//只能在函数内部使用 7 arguments[1] = 1;//只能在函数内部使用 8 ...
2019-10-25 19:17:00
77
原创 javascript的数据类型(基本和复杂)
一、基本数据类型 string number boolean二、复杂数据类型 Array Date object RegExp Sting Number Boolean 核心:Object function typeof返回值为string类型 String Number Date 首字母大写的都是构造函数//参数...
2019-10-25 19:01:00
136
原创 for循环in遍历
1 <script> 2 //对象本身没有length,所以不能用for循环遍历 3 //要用for。。。in...循环 4 5 var aaa = {"name":"拴住","age":18,"arr":[1,2,3]}; 6 var str = "name"; 7 8 for(var k in ...
2019-10-25 18:47:00
532
原创 回调函数
1 <script> 2 3 //执行函数就等于:函数名+(); 整个函数+(); 4 // 1.fn(); 5 // 2.(function(){})() 6 7 fn(test); 8 fn(demo); 9 //回调函数:函数作为参数进行传递和使用。10 fun...
2019-10-25 18:17:00
91
原创 函数声明和预解析
1 <script> 2 //预解析:js的解析器在页面加载的时候,首先检查页面上的语法错误。把变量声明提升起来。 3 //变量值提升变量名,不提升变量值。而用function直接定义的方法是整体提升。 4 //1.查看语法错误。 5 //2.变量声明提升和函数整体提升(变量声明提升的时候,只提升变量名,不提升变量值)...
2019-10-25 16:59:00
76
原创 undefined 和 not defined
概念上的解释:undefined是javascript语言中定义的五个原始类中的一个,换句话说,undefined并不是程序报错,而是程序允许的一个值。not defined是javascript在运行我们的javascript代码时,遇到没有定义就用来运算的变量时爆出来的错误。那么问题来了:在许多的javascript教程中都介绍有javascript变量即使不定义也可以直...
2019-10-25 16:52:00
551
原创 变量和作用域
1 <script> 2 3 //变量问题:根据作用范围,变量可以分为局部变量和全局变量。 4 5 //局部变量:只有局部能够访问的变量。 6 //函数内部用var定义的变量。 7 //全局变量:在哪里都能访问到的变量。 8 //函数外部或者进入javascript之后立即定义的变量...
2019-10-25 16:42:00
61
原创 函数的定义
<script> //第一种,此方法最强大,定义完毕后,在哪里都可以访问,无位置限制 function fn1(){ console.log("我是第一种定义方法!"); }//后面两种:有局限性(使用函数必须在定义函数之后,不然会报错)// //第二种(匿名函数) var fn2 = function ()...
2019-10-25 16:18:00
93
原创 函数加载的过程
1 <script> 2 3 //函数名,就等于整个函数。 4 //执行函数,就等于函数的功能+返回值; 5 6 7 //打印函数名,就等于打印整个函数。(包括注释) 8 console.log(fn); 9 //打印执行函数,就等于打印函数的返回值。(没返回值,undefined)10 ...
2019-10-25 16:13:00
176
原创 js中的return
1 //函数的返回值必须要执行函数才能得到。 2 //求和: 3 var num = getSum()+1+1+1; 4 alert(num); 5 6 function getSum(){ 7 var sum = 0; 8 for(var i=1;i...
2019-10-25 16:09:00
61
原创 快速排序
1 <script> 2 //采用二分法,取出中间数,数组每次和中间数比较,小的放左边,大的放右边 3 var arr = [3, 1, 4, 6, 5, 7, 2,0]; 4 function quickSort(arr) { 5 if(arr.length == 0) { 6 return [...
2019-10-25 16:05:00
109
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人