- 博客(39)
- 收藏
- 关注
RSS订阅
原创 前端vue知识点总结
1.为什么在大型项目中data是一个函数而不是一个对象? 组件是一个可复用的实例，当你引用一个组件的时候，组件里的data是一个普通的对象，所有用到这个组件的都引用的同一个data，就会造成数据污染。 但是不使用return包裹的数据会在项目的全局可见，会造成变量污染；使用return包裹后数据中变量只在当前组件或作用域内中生效，不会影响其他组件。 当一个组件被
2021-11-15 10:41:01
808
原创 es6总结
1.ES6介绍ES6是ES2015、ES2016、ES2017他们的统称官方名字：《ECMAScript 2015 标准》=> ES62.包管理机制（npm）1.npm init -y 初始化nodejs项目 生成一个package.json文，该文件中保存了项目所有相关信息2.全局依赖 cnpm install xxx --global
2021-09-27 18:52:00
139
原创 HTML5&&CSS3知识点总结(1)
一、块级元素和行内元素的区别1.块级元素可以独占一行，行内元素需要和其他元素共享一行；2.块级元素可以直接设置宽高，行内元素不能直接设置宽高，需要结合CSS的display来设置。3.块级元素可以嵌套块级与行内元素，而行内只能包含行内元素。二、清除浮动1.父子级-（1）在子级元素后添加一个空元素，为其添加 clear:both -------》弊端：增加了无意义的元素结构；-（2）给父级元素设置一个overflow:hidden—>可以解决第一种方法的弊端； 【推荐使用】-（3）
2021-08-26 20:19:23
313
转载 ES6—异步解决方案
1 Promise对象1.1 定义 promise是一种异步编程解决方案，Promise是一个容器，保存着将来才会执行的代码；从语法角度来说Promise是一个对象，可以用来获取异步操作的消息。 异步操作，同步解决，避免了层层嵌套的回调函数。1.2 特点 Promise 对象代表一个异步操作，有三种状态： &
2021-11-16 10:03:14
495
原创 vue项目的简单制作流程
vue项目的搭建一、项目搭建二、真实对接后台的流程三、路由配置四、图标修改五、封装六、栏目管理一、项目搭建1.搜索vue-admin-template，对于vue-admin-template是一个基于vue-cli脚手架搭建的后台管理框架，现在需要克隆源码；2.在本地新建文件夹，命名。然后打开集成终端，克隆源码,使用 git clone https://github.com/PanJiaChen/vue-admin-template.git 命令；3.下载依赖，使用cnpm install
2021-10-26 22:38:02
216
原创 防抖和节流
防抖和节流1 原理2.实现2.1 防抖2.2 节流1 原理防抖：事件频繁发生应用场景： 1.scroll滚动触发； 2.搜索框查询； 3.表单验证； 4.按钮提交 。节流：如果你持续触发事件,每隔一段时间，执行
2021-10-22 22:19:50
396
原创 axios
axios1 axios概述2 ajax2.1 原生ajax2.2 jquery的ajax3 axios特性4 拦截器4.1请求拦截器4.2 响应拦截器4.2 移除拦截器5 axios创建实例6 axios封装6.1 axios封装6.2 axios封装的使用1 axios概述 Axios 基于Promise的http库,可以用在浏览器和node.js中。2 ajax2.1 原生ajax 默认情况下，Content-
2021-10-22 21:12:16
124
原创 Vuex状态管理机
Vuex状态管理机1 介绍2 基本使用2.1 state2.2 getters2.3 mutations(突变)2.4 actions(动作)2.5 案例-定义状态机实例3 辅助函数4.模块化开发4.1 模块化目的4.2 模块化使用1 介绍 Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式，它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。 
2021-10-21 22:45:28
246
原创 webpack打包工具使用手册
webpack打包工具1 webpack概述1.1 入口1.2 输出(output)1.3 loader(加载)1.3.1 css文件加载1.3.2 less和css中的图片使用，不处理html中的img1.4 插件(plugin)1.5 模式(mode)2 webpack-dev-server 开发服务器示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。1 webpack概述 webpack网站 ：https:
2021-10-20 23:29:18
125
原创 Vue组件机制
vue组件机制1 组件基础1.1 组件概念1.2 组件特点1.3 组件定义1.4 组件复用2 组件注册3 组件交互/通信/传值3.1 父组件向子组件传参3.2 子组件向父组件传参3.3 动态传参3.4 单向数据流1 组件基础1.1 组件概念 组件可以拓展HTML元素，内部封装了可复用的HTML、CSS、JS代码片段。 组件类似于vue实例，比如组件内部有t
2021-10-19 22:47:13
175
原创 用js实现轮播图
<head> <title>轮播</title> <style> body{ background-color: rgba(119, 115, 110); } ul{ width: 800px; height: 200px; list-style: none; padding:
2021-10-19 21:55:26
120
原创 数组API-迭代方法的重构（every,some,filter,map,forEach）
数组API-迭代方法重构1.every2.some3.filter4.map5.forEach1.every 重构every，如果有一项不满足的就会直接返回false,不再继续往后判断。只有全部都满足，才会返回true。 let arr=[1,2,3,4,5]; Array.prototype.myEvery=function(fun,obj){ for(i=0;i<arr.length;i++){
2021-10-19 18:29:00
189
原创 Vue-事件机制
Vue事件机制1 事件修饰符 1.1 常见修饰符如下 1.2 按键修饰符 1.3 鼠标修饰符2 表单3.计算属性1 事件修饰符 1.1 常见修饰符如下 .stop 停止事件冒泡 .prevent 阻止事件默认行为  
2021-10-19 15:54:34
396
原创 Vue生命周期和模板语法
一、Vue概述 Vue 是一套用于构建用户界面的渐进式框架。与其他框架不同的是，Vue被设计为可以自底向上逐层应用。Vue的核心库只关注视图层，不仅容易上手，还便于与第三方库或既有项目整合。另一方面，当与***现代化的工具链***以及各种支持类库结合使用时，Vue也完全能够为复杂的单页应用提供驱动。用来做单页面应用–index.html,页面跳转用的vue插件路由来实现跳转。渐进式框架：根据自身需求，选择框架的
2021-10-18 20:07:33
264
原创 数组去重的n种方法，有待补全....
1.利用双层for循环 let arr = [1,2,3,3,4,1,2,'1','hello','hello']; // 声明箭头函数 声明元素是唯一的 let unique=(arr)=>{ //前面一项 for(i=0;i<arr.length;i++){ //后面一项 for(j=i+1;j<arr.length;j++){ if(arr[i] === arr[j]){
2021-09-28 20:15:27
88
原创 ajax请求和jQuery封装ajax
1.get和post请求是什么? HTTP协议中的两种发送请求的方法。2.get和post区别。 （1）get （2）post3.实现ajax请求的方式(1)无参的get请求 //1.创建实例对象 var xhr =new XMLHttpRequest(); //2.打开一个链接 第一个参数get是请求方式 第二个参数URL是一个接口
2021-09-27 16:47:36
121
原创 前端笔面试题总结（2）
1、linux中 vim有几种模式？如何进行这几种模式的切换?（1）vim有三种模式，分别为命令模式、输入模式和底行模式 在输入模式有四种类型的命令，它们分别代表的含义不同： ①i/I i是从光标所在位置开始输入 ； I是光标所在行的第一个非空白字符开始输入； ②a/A a是从光标所在的下一个字符开始输入； A是从光标所在行的最后一个字符开始输入； ③o/O o是从光标所在行的下一行新的一行开始输入； O是从光标所
2021-09-22 23:44:45
227
原创 web存储和通信（cookies、webStorage）
上文：https://blog.csdn.net/hey_myx/article/details/120308078对于上文的补充总结
2021-09-16 20:29:13
170
原创 画布canvas和webSocket存储
今天的学习主要从画布、拖曳、存储以及webSocket这四方面来学习1.画布一、画布的知识点总结canvas属于html元素 是H5新元素 需要结合js 用来绘制图形在页面上放置一个canvas元素，就相当于放置了一块画布，它可以绘制路径还有很多形状，比如：矩形、圆形、字符、图像属性：·····width 默认值 300px·····height 默认值 150px···· 注意点:canvas需要写闭合标签 不可以以单标签的形式存在· · · ·· ·
2021-09-15 20:44:57
330
原创 jQuery
jQueryjQuery 是一个高效、精简并且功能丰富的 JavaScript 工具库。它提供的 API 易于使用且兼容众多浏览器，这让诸如 HTML 文档遍历和操作、事件处理、动画和 Ajax 操作更加简单。1.功能： 选取HTML元素 操作HTML元素 CSS操作 操作HTML事件 DOM/BOM封装 AJAX等 2.使用： bootcdn 找到资源 把链接引入到HTML文件里 1.直接引入网络资源（复制script标签） <scri
2021-09-14 19:29:55
61
原创 BOM浏览器对象模型
BOM 浏览器对象模型BOM里面的核心对象 window—>通过浏览器访问的一个重要API#1.js是一个单线程的语言，但是我们可以通过超市调用或者间歇调用来调度代码。(一)超市调用 setTimeout 作用：在指定的毫秒数（时间）后执行函数 参数：两个参数 要执行的函数（必须） ？ 以毫秒表示的时间（可选 默认 0） 返回值：是一个数字，是当前setTimeout的id，可以通过这个id取消执行 clear
2021-09-09 23:24:27
54
原创 DOM文档对象模型
DOM 文档对象模型1.DOM的简单介绍DOM是针对HTML和XML文档的一个API（应用程序编程接口）,DOM描绘了一个层次化的节点树，允许开发人员添加，移除，修改页面的某一部分。1998年10月DOM1级规范成为W3C的推荐标准，为基本的文档结构以及查询提供了接口。但是要注意，IE中的所有DOM对象都是以COM对象的形式实现的。这意味着IE中的DOM对象与原生JavaScript对象的行为或活动特点并不一致。DOM可以将任何HTML或XML文档描绘成一个由多层节点构成的结构。节点分为几种不同的类
2021-09-09 23:13:49
286
原创 null与undefined的异同点
1.相同点undefined派生自null,undefined==null，结果为true；都表示一个空值，两者判断值相等上是一样的；在转换为boolean类型时，都是false。2.不同点（1）undefined表示缺少值，此处应该有一个值，但是没有给。① 变量声明了，但是没有赋值，值为undefined；②调用函数时，参数没有传递，默认值为undefined；③函数默认的返回值是undefined；④对象中没有赋值的属性，值为undefined.（2）null表示没有对象，尚
2021-09-07 21:08:37
269
原创 关于对CSS选择器的整理
对与CSS的选择器的优先级取决于三个因素：Importance、Specificity、Source order。(1) 核心选择器 标签选择器 div {} ul {} dl {} 类选择器 .nav {} id选择器 #id {} 组合选择器 body , ul {} 并且选择器 ul.nav {} 普遍选择器 *(2) 层次选择器 父子选择器 父 > 子 .nav > li { } #wrapper > * {}
2021-09-07 15:19:21
64
原创 JavaScript算法题整理
1.获得两个数相除的商和余数console.log(10/3); //商：3.3333console.log(10%3);//余数：1//获得两个数相除的商和余数console.log(Math.floor(10/3)); //1 3 //Math.floor(向下取整)、Math.ceil(向上取整)、round（四舍五入）console.log(0.1+0.2);//在js中，尽量避免做小数点运算//如果有小数位的运算var sum = (0.1*100+0.2*100)/100;c
2021-09-06 16:29:51
2586
1
原创 JavaScript数组总结
1.数组的定义 var arr1=null;//空指针 //空数组 var arr2=[];//字面量 var arr3=new Array();//构造函数 //有数据的数组 //1.字面量 var arr4=[100,200];//在定义的同时进行赋值 var arr5=[]; arr5[0]=100;arr5[1]=200;//通过索引下标进行赋值 //2.构造函数 var arr6=new Array(); arr6[0]=100;arr6[1]=200;//通过索引下标进行
2021-09-04 23:35:38
117
原创 面向对象的常用方法和模式
1.String类型（常用） length 属性，获取字符串的字符量 str.length---属性 str.length()---方法 charAt(i) 返回给定位置的字符 charCodeAt(i) 返回指定位置字符的编码 indexOf("x") 查找指定字符所在位置 如果字符存在，返回的是字符存在位置，如果不存在，返回-1 有一个数字类型的可选参数，代表从哪个位置开始查找。 lastIndexOf(
2021-09-02 15:19:26
231
原创 正则表达式
一、正则表达式主要用于表单校验，校验用户输入内容的格式是否符合我们的预期；还可以从比较长的一段字符串中，提取想要的字符内容；还可以替换文本内容。比如： 手机号：9999999（不能超过11位等） 密码：（不能含义特殊字符）二.、正则表达式对象的创建(1)构造函数 修饰符只能是g i m ,可以省略 var pattern = new RegExp("正则表达式source","修饰符flag"); var pattern = new RegExp("abc","
2021-09-02 10:52:10
68
原创 JavaScript常用关键字和保留字
关键字1.break1.break 关键字可以用于 switch 语句和循环结构中；2.在 switch 语句中 break 关键字的作用是立即结束当前的 switch 语句，如果在循环嵌套的结构中, break 结束的是当前所在的循环结构3.break 关键字后面不能编写任何的语句, 因为永远执行不到2.do 3.try 4.typeof作用：检测一个数据所属的类型语法：typeof 数据 或者 typeof ( 数据 )会得到改属性所属类型的字符串: string nu
2021-08-31 19:54:35
1530
原创 CSS总结
CSS一、盒模型1.盒子的组成：内容width+padding+border+margin 2、标准盒子：box-sizing: content-box 大小可随内容的变化而变化；2. 盒子总宽度：width+padding+border+margin 3、边框盒子：box-sizing: border-box 大小不能被内容改变；3. 盒子总宽度：width+margin二、CSS3的新特性1.边框：border-radius box-shadow border-image2
2021-08-30 23:22:52
125
原创 css设置实现三列，左右定宽中间自适应
1.使用flex属性。 <title>弹性盒子</title> <style> .box{ display: flex; /*弹性盒子*/ flex-direction: row; /*调整主轴方向，默认为水平方向*/ } .left{ width: 200px; background: red; .
2021-08-27 16:42:10
162
原创 es5知识点总结
一、JS三大要素1.ECMAScript —JS核心语法，语法标准，规定了js的语法、类型、语句、关键字、保留字、操作符以及对象等；2.DOM（Document Object Model）文档对象模型—对原生DOM节点进行操作（对浏览器的内容进行操作）；3.BOM(Brower Object Model) —浏览器对象模型，描述了与浏览器进行交互的方法和接口，是对浏览器本身进行操作，比如可以弹出新的窗口，改变状态栏中的文本、移动、缩放和关闭浏览器等。二、数据类型转换1.其他类型转换
2021-08-26 23:21:47
256
原创 对Linux根目录的简单介绍
对 / 下的目录介绍1.bin–>部分系统可执行文件目录, bin目录的主要作用是存放一些常用命令。bin目录其实在PATH这个环境变量里面，如果你在终端输入ls,系统会在/bin目录下查找是否有ls这个程序。2.usr -->包含了命令库文件和在通常操作不会修改的文件。------unix system resources 操作系统的文件------/usr/local 相当于c:/program files3.var -->比如会存放一些缓冲文件，日志文件，缓存文件，
2021-08-23 20:17:30
70
原创 关于对CSS动画的练习
今天我们使用css3 animation 做一个3D立方图。CSS样式结构：<title>魔方</title> <link rel="icon" href="./img/logo_32.ico"> <!-- 引入网页标题的图标 --> <style> /* 设置的目前网页背景颜色 */ html{ background-color: black;
2021-08-20 22:17:43
270
1
原创 关于flex布局的详细教程---及练习
关于flex布局的练习：全局分四个模块，头部、导航、内容以及底部。下面是关于练习的详细代码以及实现的效果图 <div class="zt"> <div class="header"></div> <div class="nav"></div> <div class="content"> <!-- 左边框 --> <div class="l">
2021-08-19 20:05:50
244
原创 关于对-rw-r--r-- 的详细讲解
关于对-rw-r–r-- 1 root root 11321 Mar 16 14:20 index.html的详细讲解1.首先先了解ls 命令常用的几个：(1) ls 查看当前目录下的目录或者文件(2) ls 路径 查看指定路径下的文件目录或者文件(3)-a 查看所有文件和隐藏文件(4)-A 查看所有文件和隐藏文件，除了.和…(5)-l 长格式列出所有的文件和目录2. -rw-r–r-- 1 root root 11321 Mar 16 14:20 index.html
2021-08-19 18:49:30
8299
原创 CSS的animation动画
CSS动画对于animation动画的使用：1.定义关键帧2.@keyframes 自定义的名称{from{css的属性值、多个}to{css的属性值、多个}}@keyframes username{0%{}20%{}60%{}100%{}}3.调用关键帧选择器{动画：开始状态、结束状态 ---->自己的默认状态animation-name:user-defined-name;/引入的关键帧/animation-duraction:3s;/动画时长/anim
2021-08-16 11:29:17
1073
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人