- 博客(19)
- 收藏
- 关注
RSS订阅原创 JavaScript克隆 JSON方法
JavaScript克隆 JSON方法JSONJSON对象包含两个方法: 用于解析JSON格式字符串将其转换成对象的 parse() 方法，以及将对象/值转换为 JSON字符串的 stringify() 方法深度克隆遍历对象法遍历对象 for(var prop in obj)判断是不是原始值 typeof() object判断是数组还是对象 instanceof toString constructor建立相应的数组或对象递归//深度克隆function deepClone(ori
2020-09-29 15:04:05
1715
原创 Promise
PromisePromise MDN实例对象和函数对象的区别实例对象： new 函数产生的对象,称实例对象简称对象函数对象：将函数作为对象使用时，简称函数对象两种类型的回调函数同步回调：立即执行，执行完了才结束，不会放入回调函数队列异步回调：不会立即执行，会放入回调函数队列中将来执行JS的error处理Error MDN错误类型Error:所有错误的父类型ReferenceError:引用的变量不存在TypeError:数据类型不正确RangeError:数据值不再其允许的
2020-09-24 23:43:07
129
原创 ES6新增
ES6新增作用域作用域是变量所作用的区域，也叫执行期上下文块级作用域let 声明的变量具有块级作用域，不存在变量提升，不能重复声明，声明之后绑定当前作用域const 声明定义的是常量，具有let声明的特性；conset声明指向的是内存中的地址，所以它定义的原始值不能改变，引用值可以改变变量的解构赋值数组的解构赋值 实质是模式匹配数组解构赋值//解构成功，左右两边迭代器要相同即两边都是数组或者两边都是对象let [a,b,c] = [1,2,3];console.log(a,b,c);
2020-09-24 20:19:02
341
原创 数组、字符串、对象、类数组、typeof
数组、字符串、新增对象方法数组中常用方法改变原数组 在原数组上操作.push(num1,num2,num3...)在数组的最后添加数据.pop( )把数组最后一位剪切.shift( )把数组的第一个元素从其中删除，并返回第一个元素的值。.unshift(num1,num2.. )向数组开头添加一个或更多元素，并返回新的长度。.reverse( )将该数组反序.splice(从第几位开始,截取多少长度,在切口添加新的数据1,在切口添加新的数据2...).sort( )根据asc码排升序，提供
2020-09-24 14:51:08
764
原创 JS模块化
JS模块化前端模块化具有相同属性和行为的事物的集合。在前端中，将一些属性比较类似和行为比较类似的内容放在同一个js文件里面，把这个js文件称为模块，为了每个js文件只关注与自身有关的事情，让每个js文件各行其职。模块要有几个特点： 独立、完整、依赖关系CommonJs根CommonJs规范，每一个文件就是一个模块，其内部定义的变量是属于这个模块的，不会对外暴露，也就是说不会污染全局变量。该规范最初是用在服务器端的node的，前端的webpack也是对CommonJS原生支持的。CommonJS
2020-09-22 21:57:15
2038
原创 HTML5常用知识点
HTML5常用知识点HTML5属于上一代HTML的新迭代语言，设计HTML5最主要的目的是为了在移动设备上支持多媒体例如： video 标签和audio 及 canvas 标记新特性：取消了过时的显示效果标记 <font>和 <center>新表单元素引入新语义标签的引入canvas标签（图形设计）本地数据库（本地存储）一些API新语义标签header：定义了文档的头部区域footer：定义文档页脚，它不只是页面的最底部，在文档中也可以定义多个arti
2020-09-18 18:24:01
249
原创 盒子模型
盒子模型标准盒模型 box-sizing: content-box;怪异盒模型 box-sizing: border-box;标准盒模型：元素style的width等于**内容区域**的宽度怪异盒模型：元素style的width等于**内容区域+padding+border**的宽度flex弹性盒模型column多列布局答：其实我们常用的是标准盒模型，它的width是指的内容宽度，盒子的宽高是内容+padding+border，但是我在做项目的是时候给盒子加border就会让盒子变大要重新计算
2020-09-18 12:22:27
124
原创 CSS3过渡、动画和形变
CSS3过渡和动画详情：http://www.ruanyifeng.com/blog/2014/02/css_transition_and_animation.html过渡transition.item { /*transition: 过渡时间 延迟时间 目标属性 过渡速度；可用‘，’同时指定多个属性变化*/ transition: 1s 1s height linear, 1s width;}单独定义： transition-property: height; transitio
2020-09-18 12:13:42
143
原创 两栏布局和三栏布局
两栏布局和三栏布局两栏布局<div class="wrapper"> <div class="left">我是文字测试君</div> <div class="right">我是文字测试君</div></div>1.浮动方法float给固定宽度的一方设置浮动，给自适应的一方设置100%宽度值，用浮动控制左右宽固固定或自适应<style> .left {
2020-09-18 00:42:31
1088
原创 BFC
BFCBFC 定义BFC(Block formatting context)直译为”块级格式化上下文”。它是一个独立的渲染区域，只有Block-level box参与， 它规定了内部的Block-level Box如何布局，并且与这个区域外部毫不相干。哪些元素会生成BFC?根元素float属性不为noneposition为absolute或fixeddisplay为inline-block, table-cell, table-caption, flex, inline-flexoverf
2020-09-17 23:28:36
68
原创 清除浮动 clear float
清除浮动 clear float清除浮动.wrapper::after { content: ''; display: block; clear: both; }清除浮动和边框塌陷.wrapper::after,.wrapper::before { content: ''; display: block; }.wrapper::atter { c
2020-09-17 21:19:55
551
原创 Flex布局（弹性盒子布局）
Flex布局（弹性盒子布局）详情：http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html开启 flex 布局：display:flex;行内元素开启flex布局：display: inline-flex;容器属性flex-direction 决定主轴方向flex-wrap 定义项目在一条主轴上排列不下该如何排列flex-flow 是flex-direction和flex-wrap的复合写法justify-content 定义项目
2020-09-17 20:45:36
309
原创 requestAnimationFrame 客户端存储 历史记录 worker
requestAnimationFrame1、页面刷新前执行一次2、1000ms 60fps -> 16ms3、cancelAnimationFrame4、用法和 setTimeout类似5、兼容性requestAnimationFrame(f)cancelAnimationFrame(id)//requestAnimFramewindow.requestAnimFrame = (function(){return window.requestAnimationFrame ||w
2020-09-06 23:02:17
158
原创 Git日常应知应会
初始化git init（初始化git）vue-cli创建项目时可选择自动初始化git status (检查)git add .(全部提交到本地仓库缓存区)git commit -m "提交说明" (全部保存到本地仓库)再次git status没问题就进行下一步创建远程仓库GitHub/码云关联本地与远程仓库（远程仓库地址：关联到哪个地址上传到哪里）保存提交到远程仓库开新分支每次更新项目就创建一个新的分支git checkout -b newname(分支名）查看当前所有分支git
2020-09-06 22:26:36
79
原创 HTML5应知应会
HTML5什么是HTML5？HTML5 的概念与定义定义：HTML5 定义了 HTML 标准的最新版本，是对 HTML 的第五次重大修改，号称下一代的 HTML两个概念：是一个新版本的 HTML 语言，定义了新的标签、特性和属性拥有一个强大的技术集，这些技术集是指： HTML5 、CSS3 、javascript, 这也是广义上的 HTML5HTML5 拓展了哪些内容语义化标签本地存储兼容特性2D、3D动画、过渡CSS3 特性性能与集成HTML5 新增
2020-09-04 22:48:01
140
原创 CSS3应知应会
CSS3兼容手册：http://www.runoob.com/cssref/css3-browsersupport.html兼容写法：新增样式:圆角、阴影border-radius: 20px; box-shadow: 10px 5px 4px red;渐变背景色、断点换行、开发者自备字体线性渐变：linear; background: linear-gradient(90deg,red 10%, green 100%);径向渐变：radial; background: radial-gr
2020-09-04 22:47:01
141
原创 CSS应知应会
css的作用添加页面样式，美化页面css的引入方式行间样式、内嵌样式、外链样式css选择器基础选择器ID选择器：# 权重：100类选择器：. 权重：10元素选择器：div 权重：1通配符选择器：* 权重：0css复合选择器后代选择器 ul li子元素选择器 ul>li交集选择器 li.red 选中即是li元素，又带有red类名的元素并集选择器 div, ul, .red 同时选中这三个元素伪类选择器 :hover链接伪类选择器a:lin
2020-09-04 11:33:13
434
原创 HTML应知应会
web标准构成：解构、样式、行为HTML超文本标记语言<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <body> </body></html>标签元素双标签单标签标签语义化常用标签排版标签：h1-h6 p <
2020-09-03 22:56:46
160
原创 jQuery应知应会
什么是jQuery？jquery是JavaScript的一个库，是一个封装好的特定的集合主要是为了快速操作DOM，里面基本上是函数方法移动端是用zepto，简化版的jquery，新增了一些移动端api它的宗旨是“写的更少，做的更多”“write less, do more”jQuery的优点是什么？轻量级的库只有几十kb跨浏览器兼容链式编程，隐式迭代对事件、样式、动画支持，大大简化了DOM操作支持第三方插件：如树形菜单、日期控件、轮播图免费、开源如何使用jQuery？页面引
2020-09-03 17:51:04
177
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人