- 博客(35)
- 收藏
- 关注
RSS订阅原创 手写一个基础的VueRouter构造函数
let _vue = nullexport default class VueRouter { static install (Vue) { // 判断当前插件是否已经安装 if (VueRouter.install.installed) { return } VueRouter.install.installed = true // vue记录到全局变量 _vue = Vue // 创建vue实例时,把传入的routes对象注入到v
2021-05-26 12:33:50
278
原创 vue中设置全屏和退出全屏,esc和f11的按键事件的特殊处理
//mounted中 //本来想直接禁掉esc的键盘按下的默认行为的,但是浏览器会有个提示,并且百度看了众多解决方案,这个提示貌似不好去掉 // if (navigator.keyboard && navigator.keyboard.lock) { // // 禁用esc退出全屏 // navigator.keyboard.lock(['Escape']) // } else { // console.log('您的浏览器上不支持该功能
2021-05-20 18:12:47
4840
7
原创 基础webpack打包后的文件分析
两个文件,index.js,login.js,login导出变量,index.js引入,并使用,使用webpack打包(function(modules){ //定义对象缓存加载过的对象 let installedModules = {}; //定义函数,替换import,require加载操作,导出模块对应的exports function __webpack_require__(moduleId) { //判断当前缓存中是都存在要被加载,存在直接返回 if(instal
2021-05-20 13:03:33
369
原创 node导入excel文件,处理并导出excel文件
const fs = require('fs')const xlsx = require('node-xlsx').default // 读取Excellet exceldata = xlsx.parse(`${__dirname}/11.xlsx`)let exportData = []for (let rowId in exceldata[0]['data']) { let row = exceldata[0]['data'][rowId] exportData.push(r
2021-05-19 22:24:20
538
原创 gulp打包的配置文件
const {src,dest,parallel,series,watch}=require('gulp')const loadPlugins=require('gulp-load-plugins')const plugin=loadPlugins()//实现自动下载依赖// const plugin.sass=require('gulp-sass')// //js转换还要下这两个依赖@babel/core @babel/preset-env// const plugin.bebel=requi
2021-05-14 15:40:14
130
原创 手写一个自己的promise
// Promise有状态,pending,fulfilled,rejected//创建实例的时候,要丢一个函数进去,形参是resolve,reject两个方法//调用resolve,就是把pending状态改为fulfilled,reject()是改为rejected,一旦状态更改后,就不可以再改了//先定义三个状态const PENDING='pending'const FULFILLED='fulfilled'const REJECTED='rejected'class Myprom
2021-04-27 13:47:45
222
5
原创 Reflect介绍,及常用的方法
Reflect是ES2015新推出的特性,虽然是大写开头,但就像Math一样,其内部的属性和方法都是静态的,不能使用new来创建实例.在Reflect提出之前,我们对对象的操作基本上五花八门添加一个键值对是obj[key]=value删除属性用的是delete操作符获取全部的key用的Object.keys()判断对象是否包含一个属性,用的又是in操作符没有什么统一性可言,Reflect的提出,有望以后去掉不统一的操作,慢慢的过渡到Reflect的统一操作上来Reflect成员方法就是Prox
2021-04-23 16:12:01
935
原创 proxy知识点分享
Proxy是ES2015新增的特性,其内置的捕捉器可以很好的监听到对象的各种变化,比原先的Object.defineProperty可以监听到更多的对象变化,并且写起来也更加方便,所以vue3采用了新的proxy特性来实现数据的双向绑定下面演示3种基本的对象操作以及其对应的proxy的捕捉器的简单代码const person={ name:'tom', age:20}const proxy=new Proxy(person,{ get(target,property){ conso
2021-04-23 15:49:57
172
2
原创 git的学习整理,git指令整理,git配置,git配置指令别名,git操作忽略文件
git安装windows上安装1.官网下载安装包,下一步安装2.桌面右击,有git bash here就标识安装成功3.配置gitgit config --global user.name '用户名'git config --global user.email '邮箱'--global 标识这台机器上的git仓库都会使用这个配置//如果配置错误的话,在本地凭据管理中删掉git的凭据,重新配置即可git config --global color.ui true 让Git显示颜色gi
2020-11-29 15:26:17
156
原创 利用vue-cli快速创建vue项目的基础步骤
安装vue-cli进入终端,输入下面指令 npm i -g @vue/cli //下载并安装指令 vue -V //查看是否下载成功,如果成功,会显示当前下载的版本号创建项目vue create . //就以当前文件夹的名字为项目名称 或者下面这个指令创建vue create 项目名称 //项目名称不能为中文选择创建的一些要求,使用上下键切换和空格键/回车...
2020-03-27 23:21:07
171
原创 vue实例和vue组件的生命周期以及生命周期钩子函数
beforeCreate函数,实例初始化之前就会触发,这个函数没什么用,因为它什么也没拿到created函数,实例初始化完了,会触发,这时候,可以拿到实例里面的data了,如果在这个函数内部,更改数据,不会触发updated和beforeUpdate函数beforeMounte函数,虚拟dom生成之前触发,也可以拿到实例里面的数据mounted函数,虚拟dom完成,并挂载好了,可以拿到页面...
2020-03-25 23:06:22
194
原创 组件之间通信
利用props实现父组件给子组件传递数据,就是子组件可以使用到父组件的数据<body> <div id="box"> <father></father> </div> <template id="father"> <div> &l...
2020-03-24 23:02:58
201
原创 vue的监听器和计算属性
本篇主要介绍vue的wtach属性和computed属性的一个简单使用场景.实现需求,设置一个数,通过单击对应按钮,我们可以让这个数按规律变化(比如自增),同时页面是可以实时得到根据这个数变化而变化的一些值(比如,这个数的两倍).下面提供了三种解决方法.一、利用函数解决，这个方法有个弊端，changeTwo方法中实际使用的数据就是num，但是当data中其余的数据产生变化的时候，依旧会触发ch...
2020-03-21 23:13:32
143
原创 vue中的v-for指令
通过v-for,循环把数据渲染到页面上,也可以通过它创建多个类似的元素.应用举例:<body> <div class="box"> <ul> <li v-for='item in arr'>{{item}}</li>//遍历arr数组,item就是遍历时,拿到的每一个元素 ...
2020-03-20 23:35:22
206
原创 利用vue的v-bind指令给元素设置id,class和style
利用v-bind添加一个类名<head> <style> .a{ color:yellow; } </style></head><body> <p v-bind:class="'a'">111111111111</p>//给p标签添加名为a的类 //v-bind可以省略 <p :...
2020-03-19 23:18:02
1554
原创 vue网址和特点,mvvm模型简单介绍
vue的官网地址 https://cn.vuejs.org/vue的特点:易用,灵活,和高效,我们利用vue管理数据,简化操作,可以丢掉复杂的dom操作.vue的模型是mvvm,分成三部分,m(model)数据模型层,v(view)视图层,还有(vm)viewmodel层,其中vm和m之间是双向绑定,m将数据传递给vm,v层直接取走渲染到页面,用户在v层操作,让vm通知m层更新数据,重新传递...
2020-03-18 23:18:36
532
原创 深拷贝与浅拷贝
前提js中根据存储方式的不同,将数据分为两大类,一类是基本数据类型,另一类是引用数据类型,基本数据类型存储在栈中,而引用数据类型在栈中存储的是指向堆内存的地址.let arr=[1,3,5]let arr1=arr //把arr的地址值给arr1,那么arr1和arr指向堆内存的地址是一样的,修改任意arr或者arr1,就是将对应地址中的内容修改了,和这个情况类似,还有函数和对象和其引用...
2020-03-11 23:39:36
100
原创 set数据结构及常用方法
set数据结构set类似于数组,不允许元素重复1,set创建let s1=new Set() //创建一个空的set集合let s2=new Set([1,2,4,5,6]) //创建一个包含1,2,4,5,6的set集合2,add()方法s1.add(‘haha’) //给s1中添加元素’haha’,如果已经有这个元素了,就添加不进去了,返回值是添加过后的s1,因此...
2020-03-09 23:50:10
885
原创 回调地狱和promise解决方案,async await解决方案
回调函数是函数的一种应用方式在你调用 a 函数的时候, 把 b 函数当作参数传递进去比如下面这种getSend('./server/a.php', function (res) { // res 就是后端发回来的响应体 var result = JSON.parse(res) // 2. 发送第二个请求 getSend(`./server/b.php?n1=${result...
2020-03-07 23:44:34
164
原创 js中数据类型转换
js中数据类型转换,分为两大类:强制类型转换和自动类型转换强制类型转换:分成三种1、转成number类型有三个方法Number(),parseInt(),parseFloat()Number(),将括号里的内容整体解析转变成数字类型,如果整体不是数字类型,就变成NaN其中Number(false)是0,Number(true)是1,Number(‘10’)是10,Number(null)...
2020-03-06 23:00:45
290
原创 如何解决跨域问题
首先要了解:浏览器有个同源策略同源策略是浏览器给请求方的限制,只能向自己家的服务器发送请求如果你给和你不同传输协议或者域名不同或者端口不同的服务器发送请求,就会触发同源策略,这个请求就称为跨域请求跨域请求有很多种解决方案,下面介绍三种解决方案第一种:jsonpjsonp原理:script的src属性不受同源策略的影响,可以任意请求,不管请求的什么类型的文件,都当做js文件来处理<...
2020-03-06 00:00:22
167
原创 referrer值的设置及对应的意义
在自己的页面中引入一些别的网页上的图片,如果页面中不显示图片,要在html的header中加上<meta name="referrer" content=“no-referrer”>referrer是用于追踪用户是从哪个页面跳转过来,设置为no-referrer,表示所有请求都不发送referrer.如果content属性不是合法的取值，浏览器会自动选择no-referer策略...
2020-03-04 23:45:02
2702
原创 设计模式，单例模式，组合模式，观察者模式
概念设计模式就是根据特定问题，给出的简洁而优化的解决方案单例模式模式的目的：一个构造函数只能new出一个对象组合模式观察者模式
2020-03-01 23:00:31
184
原创 在js中使用的正则的语法和方法
正则是什么正则表达式(RegExp),查找符合某些符合规则的字符串正则的创建第一种构造函数创建:let reg=new RegExp(‘匹配模式’,‘匹配特征’);示例:let reg=new RegExp(‘a’,‘i’) 这个正则就是用来查找字符串中是否包含了字符串’a’,并且忽略大小写第二种字面量式创建:let reg =/匹配模式/匹配特征;let reg =/a/i;这个正...
2020-02-28 23:53:04
179
原创 gulp打包,做哪些基础操作
首先gulp是什么?gulp是基于node的自动化打包工具gulp可以对我们的代码进行压缩,混淆和合并的操作gulp工具的安装,检查和卸载安装: npm install --global gulp卸载: npm uninstall --global gulp检查: npm --version 如果安装成功了,会显示gulp的版本号打包的操作步骤1.有项目的原始代码和素材...
2020-02-27 23:22:09
276
原创 sass基础语法
变量语法:$变量名:值注意:$也是变量名的一部分!注释 // 当行注释 这种注释,在编译的时候直接滤掉 /* 多行注释 这种注释编译时会保留,但是gulp打包时会去掉 */ /*! 多行注释 这种注释编译时会保留,即使gulp打包时也不会去掉 */数组变量:(),()...
2020-02-26 21:34:58
563
原创 npm基础指令及介绍
千锋逆战班!王猫猫学习写博客的第二天~~~~npm init 简写为npm init -y(按默认值生成文件)初始化当前项目,执行后,要输入描述当前项目的一些参数会在当前目录下产生一个文件package.json这个文件会记载项目产生的过程中有哪些通过npm下载的依赖项npm install 包名 简写为 npm i 包名执行这条指令后,会在当前目录中产生一个文件夹mode_modul...
2020-02-25 22:59:59
753
原创 闭包概念,闭包条件,闭包语法,闭包特点
闭包闭包就是函数的高级应用闭包的前提条件在函数的定义阶段1,在内存中开辟一块空间2,把函数体以字符串形式存储,不解析变量3,把函数体地址值赋值给函数名在函数的执行阶段1,根据函数地址值找到那个空间2,再开辟一个函数的执行空间3,给函数的形参赋值4,预解析5,把所有的代码复制到执行空间6,执行代码,解析代码7,销毁执行空间特殊情况下,执行空间不会销毁当函数的返回值是一...
2020-02-23 20:09:34
370
2
原创 自封装数组的forEach(),fliter(),some(),every()方法 和字符串的repeat()方法
封装数组的forEach() 实现数组的遍历//封装数组的forEach() 实现数组的遍历 function forEach(array,fn){ for(let i=0;i<arr.length;i++){ fn(array[i],i,array); } } let arr =[1,3,5,6,7,8]...
2020-01-11 15:23:22
1127
原创 求两个数组的差集,并集和交集和数组元素的去重处理
差集//差集 元素在第一个集合中，但不在第二个集合中var arr1=[2,1,3,5,67];var arr2=[2,4,6,89,13,5];var arr5=[];for(var i=0;i<arr1.length;i++){ if(arr2.indexOf(arr1[i])===-1){ arr5.push(arr1[i]); }}do...
2020-01-07 21:30:48
321
原创 变量泄露
循环体中定义的函数,函数内部是函数作用域,循环内除了函数的部分属于全局作用域.函数内部是函数作用域.而且函数属于不调用,不执行的代码块.函数被调用时,函数内部的循环变量,已经是循环结束之后的循环变量值.,不会随着循环变量的改变而改变.水平有限,只能理解到这个程度了.欢迎大神指点....
2020-01-07 21:11:43
557
原创 自编写数组的pop方法,push方法,shift方法,unshift方法,concat方法,join方法,slice方法
push函数 function push(){ //获取传进来的数组 if(!Array.isArray(arguments[0])){return;} var arr=arguments[0]; for(var i=1;i<arguments.length;i++){ ...
2020-01-06 21:51:34
271
原创 事件代理(事件委托)的案例
将事件绑定在触发元素的父元素身上,触发元素即even.target,如果是点击事件,even.target就指向被点击的元素.<div class="container"> <div class="titles"> <div class="title active">1</div> &...
2020-01-06 21:43:15
315
原创 获取属性节点和文本节点
获取属性节点和文本节点<p title="txt" id="p"> 文本</p><script> var a=document.getElementById('p'); //获取元素 console.log(a.attributes[1].nodeType); //a.attributes获取到的是元素的属...
2020-01-04 10:14:24
575
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人