很小白的小白-CSDN博客

原创 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 1224 1

原创 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 1741

转载 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 723

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

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

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

原创 Vue之computed 和 wacth

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

2018-12-14 14:20:39 311

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

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

2018-12-14 14:12:36 211

原创 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 615

转载常用状态码大全

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

2018-12-05 18:48:38 419

原创 webpack4.0从无到有

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

2018-11-15 17:59:53 342

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

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

2018-11-07 14:24:32 257

原创 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 165

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

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

2018-10-25 22:04:44 96

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

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

2018-10-24 14:51:13 181

原创 Vue之父子组件传值

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

2018-10-24 14:39:26 188

原创数据结构之二叉树

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

2018-10-23 13:57:43 200

原创 ES6 Map Set

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

2018-10-21 23:48:51 137

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

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

2018-10-21 23:47:30 121

原创组件细节

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

2018-10-21 23:45:13 92

原创 vue性能优化之keep-alive

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

2018-10-21 23:44:06 1205

原创冒泡和捕获小结

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

2018-10-20 12:33:29 149

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

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

2018-10-20 12:16:02 655

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

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

2018-10-16 21:20:50 906

原创企业级代码分支开发

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

2018-10-10 16:22:49 226

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

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

2018-10-10 16:22:08 762

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

应用：数组升维能够实现某一些操作简单化。比如手机一屏展示的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 1456

原创在Vue中使用插槽（slot）

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

2018-10-06 10:42:25 334

原创项目环境搭建

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

2018-10-05 16:57:17 141

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

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

2018-10-05 16:54:34 312

原创 vue项目代码结构

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

2018-10-05 16:10:51 1085

原创 null和undefined的纠葛

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

2018-09-25 17:28:19 188

原创 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 650

原创 Vue入门篇

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

2018-09-25 14:06:22 182

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

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

2018-09-25 14:03:03 578

原创 git与时间简史

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

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

原创 Vue入门之框架对比

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

2018-09-20 11:17:24 301

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

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

2018-09-18 17:24:41 6057

原创你不知道的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 1564

原创 js线程

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

2018-09-15 12:57:00 542

原创你不知道的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 670

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

2018-09-14 12:49:23 97

空空如也

空空如也