qq_44439022的博客

原创 JS获取当前时间方法

1.获取时间 var date = new Date(); var year = date.getFullYear(); // 返回的是年份 var month = date.getMonth() + 1; // 返回的月份上个月的月份，记得+1才是当月 var dates = date.getDate(); // 返回的是几号 var day = date.getDay(); // 周一返回的是1，周六是6，但是周日是0

原创 JS手搓方法

1.手搓数组反转 function reverse(arr){ if(arr instanceof Array){ var newArr = []; for(var i = arr.length-1;i>=0;i--){ newArr[newArr.length] = arr[i]; } return newArr; }else{ alert('请传数组格式的值) } }console.log(reverse([1,2,3,4,5,6,7]))

原创 vue $bus

一、bus的使用流程1.bus就是vue的一个实例，可以理解为vue实例化后的一个组件2.var bus = new Vue();3.把bus挂载Vue实例的原型对象上，也就是说用Vue实例化的每个组件都可以访问到这个$bus属性了。4.Vue.prototype.$bus = bus;5.之后就可以使用$bus进行监听和触发了。6.his.$bus.$emit(event)7.this.$bus.$on(event,fn)二、为什么把Vue的实例挂载Vue原型上就可以通讯了呢？

原创 css选择器,优先级

1.优先级1.在属性后面使用 !important 会覆盖页面内任何位置定义的元素样式。2.作为style属性写在元素内的样式。 权值为 10003.id选择器。 权值为 1004.类选择器。 权值为 105.标签选择器。 权值为 16.通配符选择器。7.浏览器自定义或继承。总结:!important > 行内样式>ID选择器 > 类选择器 > 标签 > 通配符 > 继承 > 浏览器默认属性2.css选择符(css选择器

原创 cookie哪些属性可以设置

chrome控制台的application下可查看:Cookie是由服务器端生成，浏览器会将Cookie的key/value保存到某个目录下的文本文件内，下次请求同一网站时就发送该Cookie给服务器。每个cookie除了name名称和value值这两个属性以外，常用属性还有：expires过期时间、 path路径、 domain域、以及 secure安全、HttpOnly属性1. name : 字段为一个cookie的名称。2. value : 字段为一个cookie的值。3. domain :

原创 vue中的let声明,const声明

原创 v-if和v-for谁的优先级更高

1.两个指令不可以用在同一个元素身上1.1vue2:v-for的优先级比v-if高,每次循环都会去执行一次v-if,1.2vue3:v-if的优先级高于v-for,

原创 JS排序算法

1.冒泡排序两两做比较，第一轮下来找不到最小的值1.外层循环控制行,内层循环控制列,循环的嵌套 var arr = [5,99,2,9,1,5,67,7,10,23]; for(var i = 0;i < arr.length-1;i++){ //大循环，用于遍历数组每个元素 for(var j = 0;j < arr.length-i-1;j++){ //小循环，用于将数组中的某个元素与其它所有元素相比较 var sum; //声明一个局部变量，当作第三

转载 this指向以及（call，apply，bind）

1.所谓的this其实可以理解成一根指针：其实 this 的指向，始终坚持一个原理：this 永远指向最后调用它的那个对象,这就是精髓。最关键所在，function test() { console.log(this);};test();指向window 输出下面的代码：// Window {speechSynthesis: SpeechSynthesis, caches: CacheStorage, localStorage: Storage, sessionStorage: Stora

转载 重绘和回流

回流必将引起重绘，重绘不一定会引起回流回流(Reflow)：当Render Tree中部分或全部元素的尺寸、结构、或某些属性发生改变时，浏览器重新渲染部分或全部文档的过程称为回流下面内容会导致回流:页面首次渲染浏览器窗口大小发生改变元素尺寸或位置发生改变元素内容变化（文字数量或图片大小等等）元素字体大小变化添加或者删除可见的DOM元素激活CSS伪类（例如：:hover）查询某些属性或调用某些方法一些常用且会导致回流的属性和方法：clientWidth、clientHeight、cl

原创 js 数组方法是否改变原有数组

不会改变原来数组的有：1.concat()—连接两个或更多的数组，并返回结果。2.every()—检测数组元素的每个元素是否都符合条件。3.some()—检测数组元素中是否有元素符合指定条件。4.filter()—检测数组元素，并返回符合条件所有元素的数组。5.indexOf()—搜索数组中的元素，并返回它所在的位置。6.join()—把数组的所有元素放入一个字符串。7.toString() —把数组转换为字符串，并返回结果。8.lastIndexOf()—返回一个指定的字符串值最后出现的位

原创 关于URL上面的解码

1.一般url上面会拼接一些参数,但是为了保证这些参数不会乱码,而是用转码与解码2.写法:(转两次)1.为什么要使用两次?encodeURIComponent(encodeURIComponent(data.productName))decodeURIComponent(decodeURIComponent(query.productName)) 1.简单来说: Url是将中文编码成ASCII码后的URL； 2.而Url2是将ASCII码编码后的URL，由于用GBK、UTF-8、

原创 获取验证码增加滑块拼图验证

1.用法1.在public里面的index.html文件中引入:<script src="https://ssl.captcha.qq.com/TCaptcha.js"></script>//使用：const appId = "xxxx" //腾讯滑块验证码appidsendSms() { this.form.validateFields(["phone"], (err, values) => { if (err) return;

原创 调用高德地图

1.写法:2.引入高德地图链接:

原创 正则表达式

1.手机号码验证isPhone(value) {return /^(+86)?1[3456789]\d{9}$/.test(value);},2.客户名称验证custName(value) {return /1+$/.test(value);},3.邮箱地址验证email(value) {return /2+([-_.][A-Za-z\d]+)*@([A-Za-z\d]+[-.])+[A-Za-z\d]{2,4}$/.test(value);},4.身份证号码验证cardId(v

原创 vscode插件

1.Prettier ( 代码格式话插件:不需要配置，直接格式换的时候用即可。)2.GitLens,( 会显示谁修改的代码,以及修改的时间。)3.Auto Rename Tag ,( 修改 html 标签，自动帮你完成尾部闭合标签的同步修改. )4.HTMLHint,( html代码检测 )5.Path Intellisense, ( 路径智能提示 )6.Debugger for Chrome, ( 让 vscode 映射 chrome 的 debug功能，静态页面都可以用 vsco

原创 Object(...)(...).then is not a function

遇到这种问题，先去看你用的这个方法是不是一个promise对象，不是promise的话不能.then !!1.如：这就不是一个promise对象,2.如:这就是一个promise对象, http.post或者http.get都是promise对象3.这样请求的话就会出现上面的报错: Object(…)(…).then is not a function (错误的！！)4.正确的请求:重点:如果不知道如何看的话，直接console.log()一下这个方法就可以知道是否为promis

原创 Sourcetree使用

1.如果clone的时候显报错这不是一个有效的路径，或者仓库的时候，去把凭证和账号信息删除一下然后重新打开sourcetree，它会弹出一个输入框，让你填写你的账号和密码，就是GitLab的账号密码！

原创 js去重和排序，以及统计字符串次数

1.双层for循环。var arr = [1,2,3,4,1,2,3,4,5,12,312,41,513,12 ];for(var i = 0 ; i < arr.length; i++){ for(var j = i+1; j < arr.length;j++){ if(arr[i] == arr[j]){ arr.splice(j,1); j--; } }}console.log(arr)2.利用indexOf。var arr = [1,2,3,

原创 js

1.for of 和 for in的区别for of用于遍历数组 数组对象 字符串 但是不能遍历对象 不支持普通对象for in会遍历数组所有的可枚举属性，包括原型。2.px和em的区别: px是固定的尺寸，em是会继承父级的font-size.3.css中盒模型的组成: 内容区（content）、边界区（padding）、边框区（border）。4.svn和git的区别：4.1.git是分布式，svn是集中式4.2.svn有全局版本，git没有4.3.git和svn中的分支不同

原创 http状态

http状态码：2xx（成功）200：请求被正常处理204：请求被受理但没有资源可以返回206：客户端只是请求资源的一部分，服务器只对请求的部分资源执行GET方法，相应报文中通过Content-Range指定范围的资源。3xx（重定向）301：永久性重定向302：临时重定向303：与302状态码有相似功能，只是它希望客户端在请求一个URI的时候，能通过GET方法重定向到另一个URI上304：发送附带条件的请求时，条件不满足时返回，与重定向无关307：临时重定向，与302类似，只是强制要求

原创 JS的方法

1.concat () 用于连接两个数组，或者多个数组，不会改变原数组，返回新数组，2.join () 把数组的所有元素放入一个字符串中，元素通过指定的符号分隔字符串，不会改变原数组3.pop() 删除并返回最后一个原素，改变原数组；返回被删除的那个元素4.push () 向数组的尾部添加一个或者多个元素，会改变原数组，返回新数组的长度5.shift() 删除并返回第一个元素，改变原数组，返回删除的元素6.unshift ()向数组的头部添加一位或者多位元素，返回新元素的长度，改变原

原创 vue-router配置

路由配置参数是个变量就要用绑定属性router-link 标签必须要加 to=‘’方法，不加的话不显示内容声明式:编程式：this.router.push()添加一个新的页面（this.router.push()添加一个新的页面 （this.router.push()添加一个新的页面（this.router.push(‘/detail’)）this.router.replace()替换当前页面this.router.replace()替换当前页面this.router.replac

原创 导航守卫

导航守卫：vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航。（在路由跳转时触发）导航守卫：只关心去哪里，不关心从哪里来，所以to是必须设置的每个守卫方法接收三个参数：to:  即将要进入的目标路由对象from: 当前导航正要离开的路由next: Function: 一定要调用该方法来 resolve 这个钩子。执行效果依赖 next 方法的调用参数。next(): 进行管道中的下一个钩子。如果全部钩子

原创 MVC,MVP,MVVM模式

MVX模式：MVC模式：model + view + controller 数据模型，页面，控制器最早出现在java中，一种业务逻辑，数据，界面显示分离的方法组织代码优点：耦合性低，重用性高，生命周期成本低，部署快，可维护性高，有利于软件工程化管理。缺点：用于模型和视图要严格的分离，这样也给调试应用程序带来了一定的困难，每个构件中使用之前都需要经过彻底的测试MVP模式: model view presenter 数据层 ，视图层，发布层，它是mvc的一种演变MVP 模式将 Controller

原创 vuex理解

Vue状态管理：把组件的共享状态抽取出来，以一个全局单例模式管理，这种模式下，我们的组件树构成了一个巨大的“视图”，不管在树的哪个位置，任何组件都能获取状态或者触发行为，通过定义和隔离状态管理中的各种概念并通过强制规则维持视图和状态间的独立性，我们的代码将会变得更结构化且易维护‘为什么使用状态管理：1：传参的方法对于多层嵌套的组件将会非常繁琐，并且对于兄弟组件间的状态传递无能为力2: 我们经常会采用父子组件直接引用或者通过事件来变更和同步状态的多份拷贝。以上的这些模式非常脆弱，通常会导致无法维护的代

原创 vue双向绑定原理

Vue:双向绑定原理：是由数据劫持结合发布者－订阅者模式实现的，通过Object.defineProperty()来劫持对象属性的setter和操作，在数据变动时做你想要做的事情原理：1.实现一个监听器Observer，用来劫持并监听所有属性，如果有变动的，就通知订阅者。2.实现一个订阅者Watcher，可以收到属性的变化通知并执行相应的函数，从而更新视图。3.实现一个解析器Compile，可以扫描和解析每个节点的相关指令，并根据初始化模板数据以及初始化相应的订阅器。首先要对数据进行劫持监听，所以

原创 Number类型

Number()可以用于任何数据类型的转换。转换规则如下：1.如果是Boolean值，true和false将分别被转换为1或0.2.如果是null值，返回0；3.如果是undefined，返回NaN;4.如果是字符串则遵循以下规则：字符串只把含数字（包含前面带正号或负号的情况），则将其转换为十进制数值，前导零会被忽略。（例如“011”会变成11）；如果字符串中包含有效的浮点格式，则将其转换为相应的浮点数值,前导零会被忽略；如果字符串中包含十六进制格式，则将其转换为相同大小的十进制整数；//nu

原创 安装vue

全局安装vue：cnpm i @vue/cli -g图形化创建项目界面：vue uiVue创建项目命令：vue create myapp选择：Manually select features2.除了typescr不选择，其他全选3.输入y4.选择：Sass/SCSS (with node-sass)5.选择代码的校验规则：ESLint + Standard config 这是标准的规则6.什么时候去校验 选择：Lint on save7.选择：Mocha + Chai 测试8.选择

原创 vue中的v-model

v-model的修饰符v-model.lazy 只有在input输入框发生一个blur时才触发.相当于懒加载，v-model.trim 将用户输入的前后的空格去掉v-model.number 将用户输入的字符串转换成numberV-model在input textarea select中使用v-model一般和表单元素混合使用.stop ：阻止点击事件冒泡 <div class=“middle” @click.stop=“middle”>.prevent : 用于取消默认事件.

原创 vue中的Keep-alive组件

Keep-alive在动态组件上使用 keep-alivekeep-alive 是 Vue 内置的一个组件，可以使被包含的组件保留状态，避免重新渲染 ，以避免反复重渲染导致的性能问题kepp-alive“组件”/kepp-alive能在组件切换过程中将状态保留在内存中，防止重复渲染DOMkeep-alive生命周期钩子函数：activated、deactivated,使用会将数据保留在内存中，如果要在每次进入页面的时候获取最新的数据，需要在activated阶段获取数据，承担原来creat

原创 Get和Post区别

Get和Post区别：    Get传输的数据在url 是可见的，不安全 有长度限制 2048    Post传输的数据是在后台，不可见的，安全 没有长度限制    get(‘http://39.99.182.33/api/users/login’).then(res =>{})     post(‘http://39.99.

原创 JS逻辑运算符

逻辑运算符：对于“&&”和‘||’的规律：1、只要“||”前面为false，无论“||”后面是true还是false，结果都返回“||”后面的值。2、只要“||”前面为true，无论“||”后面是true还是false，结果都返回“||”前面的值。3、只要“&&”前面是false，无论“&&”后面是true还是false，结果都将返“&&”前面的值;4、只要“&&”前面是true，无论“&&”后面是tr

原创 call和apply区别

call和apply的区别      每个函数都包含两个非继承而来的方法：apply()和call()。call与apply都属于Function.prototype的一个方法，所以每个function实例都有call、apply属性；使用call方法参数必须写完整，不能支持数组。       var a = [1,2,3,9,8,7]  &nbsp

翻译 cookie，localStorage，sessionStorage 的区别

cookie是在HTML4中使用的给客户端保存数据的，也可以和session配合实现跟踪浏览器用户身份；而webstorage（包括：localStorage和sessionStorage）是在HTML5提出来的，纯粹为了保存数据，不会与服务器端通信。WebStorage两个主要目标：提供一种在cookie之外存储会话数据的路径提供一种存储大量可以跨会话存在的数据的机制二、cookie 的特点          只能使用文本文件  &n

原创 if判断和三目语法

var box = 1;if(true == box){ alert("为真")}else{ alert("为假")} 只要if括号里面有布尔值，那么在判断中就会把括号里所有的数据类型都隐士类型转换为布尔型在if括号中非零的数字都会被转换成true，非空的字符串都会转换成true；三目写法 var a = 6; a = a < 10 ? "0" + a : a ; console.log(a) (字符串的比较规则是比较ASCII码）...