- 博客(34)
- 收藏
- 关注
RSS订阅原创 ES6-set数据结构和map数据结构
ES6-set数据结构和map数据结构Set数据结构Map简介Set数据结构一、Set简介set中成员的值都是唯一的，没有重复的值向set中添加成员时，不会发生类型转换向set中添加的对象总是不想等二、常用的属性和方法属性：size：返回set实例的成员总数 <script type="text/javascript"> const set=new Set(); //向set中添加成员 set.ad
2020-08-23 18:12:09
142
原创 ES6-let&cosnt&var
ES6-let&cosnt&varvarletcosnt函数级作用域块级作用域块级作用域存在变量提升不存在变量提升不存在变量提升值可改值不可改值不可改预解析不预解析不预解析内容仅供学习参考，若有错误欢迎大家指正----WUCASE...
2020-08-23 16:41:57
114
原创 JavaScript-es6类和继承
JavaScript-es6类和继承//父类class People { constructor(name) { this.name = name } say() { console.log( `people名叫${this.name},年龄${this.age}` ); } jump(){ console.log("天搜啊"); } }
2020-08-23 16:03:54
104
原创 javaScript-js的继承
javaScript-js的继承组合继承寄生组合式继承（常用）组合继承组合继承（组合原型链继承和借用构造函数继承）（常用）function Person(name){ this.name = name this.drop = function(){ console.log(this.name + " 跳下去"); } } Person.prototype.say = function(){
2020-08-23 16:01:36
98
原创 HTML5+CSS3-基础11-双飞翼布局
HTML5+CSS3-基础11-双飞翼布局双飞翼布局（左固定右固定，中间自适应）双飞翼布局（左固定右固定，中间自适应）<!DOCTYPE html><html lang="en"><head> <title></title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1">
2020-06-24 11:08:51
154
原创 HTML5+CSS3-基础10-圣杯布局
HTML5+CSS3-基础10-圣杯布局圣杯布局（左固定右固定，中间自适应）圣杯布局（左固定右固定，中间自适应）<!DOCTYPE html><html lang="en"><head> <title></title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1">
2020-06-24 10:40:08
353
原创 HTML5+CSS3-基础09-水平&垂直居中
HTML5+CSS3-基础09-水平&垂直居中直接上代码直接上代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style
2020-06-24 10:21:43
138
原创 JavaScript-基础10-防抖&节流
JavaScript-基础10-防抖&节流//防抖function debounce(func, wait, immediate) { let timer = null; let result; console.log(immediate); let debounce = function () { //解决event问题 let args = arguments; cl
2020-06-23 18:12:28
64
原创 JavaScript-基础09-双等于（==）&三等于（===）
JavaScript-基础09-双等于（==）&三等于（===）双等于（转换规则）当进行双等号比较时候： 先检查两个操作数数据类型，如果相同， 则进行=比较， 如果不同， 则进行一次类型转换， 转换成相同类型后再进行比较， 而=比较时， 如果类型不同，直接就是false.双等于（转换规则）对象 == 字符串 （对象.toString()转为字符串）null == undefined (和其他值比较则不相等)NaN == NaN (不相等)剩下的都转为数字..
2020-06-23 14:15:32
240
原创 Vue-06-vue生命周期
Vue-06-vue生命周期每个Vue实例在被创建之前都要经过一系列的初始化过程,这个过程就是vue的生命周期。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</
2020-06-23 14:14:14
62
原创 JavaScript-基础08-数组和对象的区别
JavaScript-基础08-数组和对象的区别区别区别创建方方式对象没有长度】、调用方式不同for in 循环数组是a=【1，2，3，4】，一个对象是a=｛0：1，1：2，2：3，3：4｝输出alert（a[1]），二者的输出结果相同。区别一：1.数组是有序数据的集合，而对象是无序数据的集合。2.对象的存储形式很像数组，因此被称为关联数组，但它不是真正意义上的数组。关联数组就是将值与特定字符串关联在一起。真正的数组与字符串没有联系，但是它将值和非负整数
2020-06-18 08:56:48
361
原创 Vue-05-router和keep-alive
Vue-05-router和keep-alive<keep-alive include="test-keep-alive"> <!-- 将缓存name为test-keep-alive的组件 --> <component></component></keep-alive><keep-alive exclude="test-keep-alive"> <!-- 将不缓存name为test-keep-alive的组件
2020-06-04 16:43:48
89
原创 Vue-04-路由router导航守卫
Vue-04-路由router导航守卫一、全局守卫（1）全局前置守卫beforEach（2）全局后置钩子afterEach（少用）二、路由独享的守卫``（1）beforeEnter三、组件内的守卫（1）beforeRouteEnter（2）beforeRouteUpdate（3）beforeRouteLeave完整的导航解析流程总结一、全局守卫（1）全局前置守卫beforEach> 守卫方法接收三个参数：to：即将要进入的目标路由对象from：当前导航正要离开的路由next：执行下一步
2020-06-04 16:03:30
259
原创 Vue-03-路由router参数及嵌套
Vue-03-路由router参数及嵌套路由（router）参数params方式query方式路由嵌套路由（router）参数params方式router中的index.js里面进行路由设置动态路由{ path:'/maintest', component:MainTest }, { //设置动态路由:id（任取名字，根据名字获取参数） path:'/test/:id', component:Test }跳转页面，并将数据传递<
2020-06-04 15:36:09
116
原创 Vue-02-基础语法（下）
Vue-02-基础语法（下）数据绑定（v-model）事件监听（v-on）循环遍历（v-for）父子组件通信slot插槽数据绑定（v-model）表单绑定单选框绑定多选框绑定选择列表（select）修饰符事件监听（v-on）v-on基础v-on参数v-on修饰符循环遍历（v-for）循环遍历数组循环遍历对象key父子组件通信父传子子传父slot插槽具名插槽作用域插槽
2020-05-28 10:13:09
90
原创 Vue-01-基础语法（上）
Vue-01-基础语法（上）一、插值操作1.Mustache（{{}}）2.v-html3.v-test4.v-once5.v-pre6.v-cloak二、绑定属性1.v-bind一、插值操作1.Mustache（{{}}）2.v-html3.v-test4.v-once5.v-pre6.v-cloak二、绑定属性1.v-bindv-bind绑定class属性对象语法数组语法绑定style属性本文章是参考b战coderwhy老师的自己整理的笔记 ，如有
2020-05-28 09:46:22
70
原创 JavaScript-基础07-正则表达式
JavaScript-基础07-正则表达式正则表达式1.什么是正则表达式2.特点3.使用4详细学习正则表达式在线测试https://c.runoob.com/front-end/854分析:手机号码: /^1[3|4|5|7|8][0-9]{9}$/QQ: [1-9][0-9]{4,} (腾讯QQ号从10000开始)昵称是中文: ^[\u4e00-\u9fa5]{2,8}$1.什么是正则表达式正则表达式（ Regular Expression ）是用于匹配字符串中字
2020-05-26 11:12:46
100
原创 JavaScript-基础06-构造函数和原型对象
JavaScript-基础06-构造函数和原型对象原型（对象属性）原型链原型（对象属性）对象都会有一个属性 proto 指向构造函数的 prototype 原型对象，之所以我们对象可以使用构造函数 prototype原型对象的属性和方法，就是因为对象有 proto 原型的存在。__proto__对象原型和原型对象 prototype 是等价的__proto__对象原型的意义就在于为对象的查找机制提供一个方向，或者说一条路线，但是它是一个非标准属性，因此实际开发中，不可以使用这个属性，它只
2020-05-26 10:47:12
89
原创 JavaScript-基础05-闭包
JavaScript-基础05-闭包闭包闭包1. 闭包特点：（1） 函数嵌套函数（2）内部的函数可以引用外部函数的参数或者变量（3）参数和变量不会被垃圾回收机制回收，因为内部函数还在引用2. 优点（1）变量可以长期驻扎在内存之中（2）避免全局变量的污染，有私有成员3.闭包示例闭包方式调用：a执行后，由于a变量还在被内部函数引用，故不会被回收，再次计算，在上一次的结果上进行累加。function a(){ var a = 1; return function(
2020-05-26 08:52:00
102
原创 JavaScript-基础04-call&apply&bind
JavaScript-基础04-call&apply&bindcall()方法apply()方法bind()方法（不调用函数）call()方法call方法可以改变this的指向，call(参数一，参数二, …),参数一： this的指向其他参数： 传递的数据注意： call() 方法可以调用函数function Father(name, age) { ...
2020-05-01 08:48:42
146
原创 JavaScript-基础02-类和继承
JavaScript-基础02-类和继承类创建方法1. 工厂方式2. 构造器方式3. 原型方式4. 原型/构造联合方式5. 动态原型方式6. 利用Object.create()方法构造实例化obj对象有三步：类的继承1.原型链继承构造函数继承组合继承（构造函数和原型法）类创建方法Javascript是一种基于对象的语言，你遇到的所有东西几乎都是对象。但是，它又不是一种真正的面向对象编程（OOP...
2020-05-01 08:26:21
68
原创 JavaScript-基础03-数组常用方法
JavaScript-基础03-数组常用方法1. join()push()和unshift()pop()和shift()reverse()方法(返回新数组，改变原数组)concat()方法（放回新数组，不改变原数组）slice()方法indexOf()和lastIndexOf()方法截取字符串中的某段字符串1. join()join() 方法用于把数组中的所有元素放入一个字符串。元素是通过指...
2020-05-01 07:28:47
95
原创 JavaScript-基础02-冒泡&默认行为
JavaScript-基础02-JavaScript-基础02-冒泡&默认行为绑定事件1. addEventListener2. onclick3.嵌入dom阻止事件冒泡（从内到外）事件捕获（从外到内）事件的默认行为绑定事件1. addEventListener<div class="father" id="father"> <div class="son...
2020-04-30 14:45:16
226
原创 JavaScript-基础01-数据类型
JavaScript-基础01-数据类型基本数据类型引用数据类型基本数据类型numstringbooleannullunderfined（1）定义了变量没有赋值（2）数组越界（即超出了数组的index索引）（3）访问对象没有的的属性（4）函数默认返回underfined引用数据类型ArrayObject区分Array和Object的三种方法（1）arr.cons...
2020-04-29 16:05:36
108
原创 HTML5+CSS3-基础09-盒子水平和垂直居中
HTML5+CSS3-基础09-盒子水平和垂直居中利用position和translate利用position和margin利用父元素的flex布局利用display：table-cell对子盒子实现绝对定位，利用calc计算位置利用position和translate利用子绝父相父元素和子元素进行定位，然后用transform的translate绝对定位方法：不确定当前div的宽度和...
2020-04-28 15:43:32
159
原创 HTML5+CSS3-基础08-弹性盒模型
HTML5+CSS3-基础08-弹性盒模型弹性盒模型父元素属性子元素属性（flex item）弹性盒模型弹性盒子由弹性容器(Flex container)和弹性子元素(Flex item)组成。弹性容器通过设置 display 属性的值为 flex 或 inline-flex将其定义为弹性容器。弹性容器内包含了一个或多个弹性子元素。注意：弹性容器外及弹性子元素内是正常渲染的。弹性盒子...
2020-04-28 10:20:22
277
原创 HTML5+CSS3-基础07-animation动画
HTML5+CSS3-基础07-animation动画animation动画animation动画animation比较类似于 flash 中的逐帧动画，逐帧动画就像电影的播放一样，表现非常细腻并且有非常大的灵活性。然而transition只是指定了开始和结束态，整个动画的过程也是由特定的函数控制。学习过 flash 的同学知道，这种逐帧动画是由关键帧组成，很多个关键帧连续的播放就组成了动画，...
2020-04-28 00:08:04
148
原创 HTML5+CSS3-基础06-transition过渡
HTML5+CSS3-基础06-transition过渡CSS3 过渡transform属性CSS3 过渡transition：过渡属性 过渡时长 过渡速度 延迟时间；transition-property：指定过渡的CSS属性。transition-duration：指定完成过渡所需的时间。transition-timing-function：指定过渡调速函数。transitio...
2020-04-27 23:10:28
273
原创 HTML5+CSS3-基础05-重排&重绘
HTML5+CSS3-基础05-重排&重绘重排（Relayout/Reflow）重绘（Repainting）性能优化重排（Relayout/Reflow）重排也叫回流，所谓重排，实际上是根据渲染树中每个渲染对象的信息，计算出各自渲染对象的几何信息（DOM对象的位置和尺寸大小），并将其安置在界面中的正确位置。由于浏览器渲染界面是基于流式布局模型的，也就是某一个DOM节点信息更改了，就需要...
2020-04-27 16:43:36
355
原创 HTML5+CSS3-基础04-盒模型&BFC
HTML5+CSS3-基础04-盒模型&BFCW3C盒模型（标准盒模型）IE盒模型（怪异盒模型）盒子尺寸:box-sizing: 默认值(content-box)BFC （块级格式化上下文）W3C盒模型（标准盒模型）在标准的盒子模型中，width指content部分的宽度IE盒模型（怪异盒模型）（IE6及以下 ，不设置！doctype）在IE盒子模型中，width表示c...
2020-04-27 16:13:33
356
1
原创 HTML5+CSS3-基础03-清除浮动&position
HTML5+CSS3-基础03-清除浮动&position3种清除浮动方法Position定位3种清除浮动方法1. 添加新元素，使用clear:both; 这种方式优点就是代码少，容易理解，浏览器几乎都支持，出现的问题比较少，但缺点就是如果页面浮动浮动布局多的话，就要添加很多空div去清除浮动，不便优化。虽然这是常用的清除浮动方式，但不建议使用2.父容器使用overfl...
2020-04-27 15:23:54
498
原创 HTML5+CSS3-基础02-选择器
HTML5--html5基础02选择器选择器标签选择器 div {}class选择器 .btn {}id选择器 #btn {}通配符选择器 * {}组合选择器 div, .btn，#btn {}层级选择器 div>p{} div下的所有子p标签后代选择器 div p{} div下的所有p标签兄弟选择器 div+p 与div相邻的p...
2020-04-27 14:31:54
200
原创 HTML5+CSS3-基础01-meta&语义化&行内和块级元素
01-HTML5基础01HTML5-metaHTML语义化行内和块级元素HTML5-meta定义文档编码==> <meta charset="ISO-8859-1">定义针对搜索引擎的关键词 ⇒ <meta name="keywords" content="关键词" />定义对页面的描述==> <meta name="description" c...
2020-04-27 13:37:05
235
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人