自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(76)

原创 box-shadow好玩炫酷的阴影效果

话不多说,先上代码!根据内阴影和外阴影,最终组合成。根据阴影层级的关系。 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-w

2019-01-27 15:33:28 349

原创 object.freeze()之冻结对象小结

Object.freeze() 具有冻结一个对象的功能:冻结的对象属性不能修改,不能添加属性(类似 const 一个原始值) ,但是还是阔以借用他的方法。(我们还可以冻结数组)let num = 1;let obj = { foo() { num++; }, bar() { return num; }};Object.freeze(obj);obj...

2018-12-16 14:23:26 888

转载 Vue 的插件机制

Vue 的插件机制vue 提供了一个 use 方法,来加载插件:Vue.use = function (plugin: Function | Object) { const installedPlugins = (this._installedPlugins || (this._installedPlugins = [])); if (installedPlugins.i...

2018-12-15 15:48:12 237

原创 理解vue原理以及实现流程

从 jquery 的操作 dom 到 vue,react等框架的vdom实现,大大减少了dom的操作,提高性能。前端的刀耕火种,到现在的模块化,前端的内容每天都在发生着变化,每天都有着进步。前端的发展中我们绕不过一个坎,那就是jquery,接下来我们会对比jquery和现在框架,来发现这些年前端取得的进步。jquery与框架的区别:jquery的本质还是操作dom,在处理dom的时候,也会...

2018-12-14 14:25:45 423 1

原创 Vue之computed 和 wacth

计算属性computed ,监听属性wacth:计算属性存在的意义:在html中插入一个普通函数时(methdos中的函数),每次修改数据,html结果就会刷新(局部的重排和重绘)。同时普通函数也会重复执行。这样性能大打折扣。所以就有了计算属性computed。computed的内部机制:当他依赖的值发生变化的时候。他会重新计算内部设置有缓存,会缓存当前数据。会监听当前值的变化...

2018-12-14 14:20:39 173

原创 微信小程序之细节注意点

小程序为数据驱动。没有dom手机适应属性: rpx页面跳转: API导航中数据绑定:参照vue双括号( {{数据}} )。(行间样式绑定小不同一个双一个是单)双括号中还可以写简单的逻辑运算,三元,网络请求:api修改数据,需要经过 setData()  (如果设置没有的数据 则是添加数据,这里有个底层封装异步过程,但是在试引用类型的时候有问题,怀疑是没做深克隆处理)列表...

2018-12-14 14:12:36 64

原创 JavaScript原生API小结

Array对象:属性:arr.length  // 数组长度Array.isArray(arr)  //用来判断一个值是否为数组Array实例方法  :var a=[]a.valueof() //返回数组本身a.toString() //返回数组的字符串形式(有逗号)a.push(value,vlaue....) //用于在数组的末端添加一个或多个元素,...

2018-12-14 14:05:07 94

转载 常用状态码大全

2开头(请求成功)表示成功处理了请求的状态代码。200 (成功)服务器已成功处理了请求。通常,这表示服务器提供了请求的网页。201(已创建)请求成功并且服务器创建了新的资源。202(已接受)服务器已接受请求,但尚未处理。203(非授权信息)服务器已成功处理了请求,但返回的信息可能来自另一来源。204(无内容)服务器成功处理了请求,但没有返回任...

2018-12-05 18:48:38 47

原创 webpack4.0从无到有

webpack是什么? 为什么要用webpack? 如何使用webpack? 常见问题及解决办法。 答案:1:webpack是一个现代js应用程序得静态模块打包器。当webpack处理应用程序时,会递归得构建一个依赖关系图,包含应用程序需要的每个模块,然后将这些模块打包成一个或多个包。在webpack中一切皆模块,通过loader转换文件,通过plugin...

2018-11-15 17:59:53 140

原创 前端刀耕火种到模块化开发

为什么要模块化开发:因为有了模块,我们就可以更方便地使用别人的代码,想要什么功能,就加载什么模块。但是有个前提:标准的统一读懂这篇文章:https://blog.csdn.net/m_review/article/details/78643967前端模块化的诞生:CommonJS:2009年,美国程序员Ryan Dahl创造了node.js项目,将javascript语言用...

2018-11-07 14:24:32 106

原创 JavaScript与node.js之把问题壁咚到墙角

学习方法学会提问 科学思考eg:为什么要学node.js?node.js 很火。很多公司招聘都要求 node.js继续提问node为什么火(这时候就要对比他们的区别了)?3.node.js和JavaScript有什么区别?node.js是平台(Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境)。JavaScript是编程语言。衍生问...

2018-10-31 12:02:18 83

原创 vue之生命周期函数入门了解

以下是一个vue实例的整个生命周期:红色圆角都是对应的生命周期钩子图来自官方:  对应的生命周期参考资源来自:https://segmentfault.com/a/1190000008010666                   https://segmentfault.com/a/1190000008010666<!DOCTYPE html&gt...

2018-10-25 22:04:44 30

原创 Vue之组件参数校验与非props特性

子组件对父组件传递数据的校验:何为校验:就是对父组件传递的数据进行一定的限制。比如我子组件只接收字符串类型数据。其他不要等等。(如果数据类型不符合。Vue会在控制台抛出警告。)一下是数据可以为数字类型或者字符串类型的写法。以数组的形式:数据类型的其他写法。放要求数据必须传过来时:content写成对象形式:required 为true表示必传子组件可以设置默认值(没...

2018-10-24 14:51:13 60

原创 Vue之父子组件传值

单项数据流‘:父组件可以随意传数据给子组件,  父可以随意修改 , 子不能修改父的数据,会报错。如果子组件修改了父组件的数据。那么会对其他的子组件也会有相应的影响。处理方式:父组件的值,子组件接收够用一个变量接收。这样就变成子组件自用的了 (完美解决)父组件向子组件传值:通过属性传值父组件要传值给子组件,需要在子组件上绑定属性(用v-bind动态绑定,如果不用那就相当于传入固定值)...

2018-10-24 14:39:26 69

原创 数据结构之二叉树

在计算机科学中,二叉树是每个结点最多有两个子树的树结构。通常子树被称作“左子树”(left subtree)和“右子树”(right subtree)。二叉树常被用于实现二叉查找树和二叉堆。第一次接触二叉树是因为二分查找。被自己画成了树状图。二叉树应用的广泛。树:有向无环图二叉树在图论中是这样定义的:二叉树是一个连通的无环图,有根二叉树还要满足根结点的度不大于2。有了根结点之后,每个顶...

2018-10-23 13:57:43 42

原创 ES6 Map Set

数据结构:栈(括号操作,先进后出)队列(先进先出)数组也是一种数据结构,(有序的地址存储)对象的结构(key:value)数组去重:arr =[1,'1',1,{}];(怎么实现去重,普通的去重方法不在适用)es6新的数据结构:Map 和 SetMap 是字典 加强的对象 ,若干键值对的集合map的便利性(字符串1就是字符串 没有类型转换)map.set('1','by...

2018-10-21 23:48:51 37

原创 非父子组件之间的传值,发布订阅模式/观察者模式/总线机制/Bus

一个网页可以拆分成很多组件 :可以构成父子组件和兄弟组件。如果我想实现1~3之间的数据传递,不得不经过2。那有没有直接让1~3进行数据传递了(给他们开出新通道)。又比如3~3之间传递数据。第一种:在Vue中有一个数据框架VueX第二种:发布订阅模式/观察者模式/总线机制主要来说第二种方式:总线机制。<div id="app"> <foo co...

2018-10-21 23:47:30 46

原创 组件细节

is:解决HTMLbug (tr这个标签是row标签)data问题:必须是一个函数。返回一个对象(子组件会被多次调用。不像主组件调用一次,)。每一个子组件都拥有独立的数据存储Vue操作dom:给标签添加ref=‘’ 属性...

2018-10-21 23:45:13 38

原创 vue性能优化之keep-alive

路由被切换的时候会重新发送ajax请求。mounted钩子函数会被重新执行vue自带标签 kepp-alvie  keep-alvie  :路由内容加载一次后,就把路由内容放在内存中(相当于cookie),下次加载的时候就不用发送ajax请求了当我们需要重新发送ajax请求时 当我们使用keep-alvie 时候 组件会多一个钩子函数  activaedactivaed()...

2018-10-21 23:44:06 513

原创 冒泡和捕获小结

通常我们只考虑一个dom绑定一种事件类型。(碰到一个问题。一个dom分别绑定了冒泡和捕获类型的事件)在一个dom元素同时绑定冒泡和捕获的该怎么处理。我们来看一下的问题。下面事件的触发顺序是如何的<body> <div class="warpper"> <div class="context">点我</div> ...

2018-10-20 12:33:29 70

转载 vue之组件名的几个用处

做自身递归对某个页面取消缓存。浏览器中的vue开发工具(会显示组件名字)细节文章:https://blog.csdn.net/Uookic/article/details/80420472  

2018-10-20 12:16:02 382

原创 移动端padding和margin的百分比设置实现占位

资源请求和加载都是需要时间的。对于图片一些内容的展示,当图片没有加载出来时。容器高为零,那么下面的dom元素会上移。当图片加载后,会容器撑开。这样会造成页面的重排。为了解决以上问题我们可以使用padding的百分比占位实现(或者margin)。让我们把padding这是为百分比时。他百分比对应的是父级的宽的比(W3C规定)我们就实现了占位。我们需要占位的空间添加内容,这时我们就需要定位...

2018-10-16 21:20:50 417

原创 企业级代码分支开发

进入码云, 自己的项目中.创建分支 创建分支的目的是代码模块化创建的分支本地没有 需要下载到本地 可以通过git来实现:cd xxx 进入项目文件 git pull 拉取远程仓库的分支到本地   checkout index-swiper  让本地分支变成index-swiper这个分支status查看未完待续。。。。。。拉取远程仓库分支cd xxx...

2018-10-10 16:22:49 85

原创 vue之vuex(数据层)入门了解

在一般的开发中vue一般承担视图层的开发内容。当我们遇到大量数据之间传递的时候,往往我们需要一个数据框架进行辅助这个就是vuex了(官网文档学习)设计理念:状态管理库(创建一个公共的响应式数据存储仓库)一张图带你学习vuex数据的获取数据都存放在state中。组件可以直接调用state中的数据数据的改变:(数据不能通过组件去直接改变,需要走一个流程(单项数据流))分...

2018-10-10 16:22:08 413

原创 数组之一维数组升多维

应用:数组升维能够实现某一些操作简单化。比如手机一屏展示的app数目。多了就会到下一屏。。。以一维数组升维为三维数组为例:把数组arr的第一位变成一个空数组(目的是能使用数组的属性)const arr=[];arr[0]=[];arr[1]=[];arr[0].push(0,1,2)arr[1].push(3,4,5)以上就实现了数组的升为。以下来封装arr数组升维的方法...

2018-10-08 14:36:02 451

原创 在Vue中使用插槽(slot)

什么是插槽:顾名思义,一个萝卜一个坑。子组件创建的标签插入的内容不会在浏览器显示。这时需要用到Vue新的语法slot。Vue为什么要用插槽:组件标签是组件定义好的内容,当我们想在组件标签内放一些东西的时候。是不具有作用的。他不会显示。<foo> <div>hello</div></foo>浏览器中不会显示hello。d...

2018-10-06 10:42:25 158

原创 项目环境搭建

第一步 下载node.js第二步 下载 git 第三步 远程仓库的选择(码云 or github) vuecil脚手架的安装(https://github.com/vuejs/vue-cli/tree/master)以下以码云为例在码云上创建了基础文件。然后使用git 克隆到本地 使用 git clone 命令 以下是复制需要克隆的项目链接在克隆项目里配置vue...

2018-10-05 16:57:17 54

原创 多页面应用和单页面应用

多页面应用:页面跳转——>返回html(发送请求)优点:首屏时间快。seo效果好(搜索引擎排名效果(html))缺点:页面切换慢 单页面应用:页面跳转——>JS渲染(不会再次去请求html文件)优点:页面切换快缺点:首屏时间稍慢(第一次请求html和js),SEO差(搜索引擎优化效果差,网页排名差)(缺点服务器端渲染技术解决)——完美 rou...

2018-10-05 16:54:34 193

原创 vue项目代码结构

最外层文件:README.md  ————> 说明文件package.json  ————>依赖文件存储地package-lock.json ————>依赖的版本LICENSE  ————>开源协议说明index.heml  ————>项目首页的默认文件(深入)postcssrc.js ————>postcss的配置项。gitigno...

2018-10-05 16:10:51 353

原创 null和undefined的纠葛

null是一个表示 “无”的对象,转化为数值为0;undefined是一个表示“无”的原始值,转化为数值时候为NaN当申明变量还未被初始化时,变量的默认值为undefinednull用来表示尚未存在的对象,常用来表示函数企图返回一个不存在的对象。undefined表示缺少值,就是应该有这个值,但是还没定义。典型用法:undefined变量被声明但是没有赋值。这时候就等于...

2018-09-25 17:28:19 37

原创 Vue之cli

使用vue-cli的目的:生成目录结构 本地开发调试 代码部署 热加载(实时更新浏览器) 单元测试搭建编程环境。安装条件:Node.js版本要大于6.0。npm大于3.0(Node.js大于6.0的版本 里面npm版本大于3.0)。还有Git详情见:https://github.com/vuejs/vue-cli/tree/master安装Node环境http://nod...

2018-09-25 15:32:26 597

原创 Vue入门篇

Vue.js 的核心是一个允许采用简洁的模板语法来声明式地将数据渲染进 DOM 的系统响应式布局基础语法 双括号和指令{{ xxx}}  ==>写在HTML标签中的变量(<div>{{foo}}</div>)双括号可以填写的内容有:变量。表达式。函数,三目运算(data中的数据,和)<div>{{foo()|| foo>0?2:3...

2018-09-25 14:06:22 71

原创 es6之为什么要用Promise (承诺) 有更新,更加简单明了

为什么要用Promise (承诺)  多层回调代码降维 ,异步编程来看一下以下代码:ajax的多次请求(形成V型代码结构),产生了回调地狱,不论是浏览器中最为常见的ajax、事件监听,还是node中文件读取、网络编程、数据库等操作,都离不开异步编程。在异步编程中,许多操作都会放在回调函数(callback)中。同步与异步的混杂、过多的回调嵌套都会使得代码变得难以理解与维护,这也是常受人诟病...

2018-09-25 14:03:03 135

原创 git与时间简史

Git是什么?好吃吗?Git是目前世界上最先进的分布式版本控制系统(没有之一)。和电脑一个味道Git和GitHub是什么关系?(快递和顺丰)Git是协议。Github是实现Git和SVN的区别分布式控制系统和集中式控制系统,详情百度怎么能学好Git?1,保持好奇2,学会提问3,了解背景时空轮对应Git操作主机  路径  文件名(三维空间)—— 文件在哪...

2018-09-20 23:15:25 131 1

原创 Vue入门之框架对比

为什么要使用前端框架:(响应式开发)保UI和状态同步原生JS对于UI代码实现复杂,容易出错。逻辑层次三大框架对比:Angular优点: MVVM模式(UI和状态同步)  双向数据绑定(数据变化,视图跟着变化)  依赖注入(组件耦合性降低)缺点:语法复杂,angular5使用TypeScript(js超集)     没有向后兼容React:本质是前端组件化框架,由后端组件...

2018-09-20 11:17:24 100

原创 你不知道的JS之数据扁平化处理

什么是扁平化:扁平化概念的核心意义是:去除冗余、厚重和繁杂的装饰效果。具体表现在去掉了多余的透视、纹理、渐变以及能做出3D效果的元素,这样可以让“信息”本身重新作为核心被凸显出来。同时在设计元素上,则强调了抽象、极简和符号化 ————以上是设计的扁平化。不难想象,我们为什么要让数据也扁平化。那是为了更加能够让信息更加的凸显出来对于多维数组,扁平化的目的就是让他降维。以此为知识点...

2018-09-18 17:24:41 2873

原创 你不知道的js之组合函数

组合函数:自己喜欢把他理解成复合函数,多个功能的调用。(对一个数据多次回调处理)不废话,上代码function compose(f, g) { return function (x) { return f(g(x)) }}function toUp(str) { return str.toUpperCase()}function add(...

2018-09-15 16:40:31 708

原创 js线程

浏览器常驻线程:js引擎线程(解释执行代码,用户输入,网络请求)GUI线程(绘制用户页面,与js主线程是互斥的(页面也有加载完不能进行操作))异步线程:http网络请求线程:处理用户的get,post等请求,等返回结果后将回调函数推入任务列队中浏览器事件处理线程(将click,mouse等交互事件发生后将这些事放入任务队列中) js执行机制:单线程单线程:同一时间只...

2018-09-15 12:57:00 113

原创 你不知道的js封装call和apply

call和apply的实质在于去借用别人的方法和属性(本身没有)。回顾call:   foo.call(obj)  可以理解为 obj借用了foo这个函数。var name = 'window'var obj = { name: 'obj'}function foo() { console.log(this.name)}foo() //空执行。相当于window...

2018-09-14 13:54:40 481

原创 链表初探

链表是一种物理存储单元上非连续、非顺序的存储结构,数据元素的逻辑顺序是通过链表中的指针链接次序实现的。链表由一系列结点(链表中每一个元素称为结点)组成,结点可以在运行时动态生成。每个结点包括两个部分:一个是存储数据元素的数据域,另一个是存储下一个结点地址的指针域。 相比于线性表顺序结构,操作复杂。由于不必须按顺序存储,链表在插入的时候可以达到O(1)的复杂度,比另一种线性表顺序表快得多,但是查找一...

2018-09-14 12:49:23 46

空空如也

空空如也

空空如也
提示
确定要删除当前文章?
取消 删除