- 博客(27)
- 收藏
- 关注
RSS订阅原创 如何优化我们的代码（vue项目）
前言作为一个前端，可能绝大多数的时间都是在写的业务代码，时间一长，大家会觉得乏味、没意思等等，但是其实就算只是写业务代码，我们也依然能够找到有兴趣的点，说的简单一点就是代码优化，不仅仅局限在业务逻辑这块，像是代码复用、效率等等都是我们可以加以改进的地方，学会在业务代码中找到不足，总结经验，这样日积月累，量变产生质变，必然我们的技术也是不断再上升的。今天其实就是说下我在vue项目中进行的一些总结...
2019-04-30 14:07:18
3456
原创 vue基础之v-bind属性、class和style用法分析
一、属性属性:v-bind:src=""width/height/title…简写::src="" 推荐 效果能出来，但是会报一个404错误 效果可以出来，不会发404请求window.onload=function(){ new Vue({ el:'#box', data:{ url:'https:...
2019-04-29 16:04:23
1262
原创 Vue渲染过程浅析
Vue 推荐在绝大多数情况下使用 template 来创建你的 HTML。但是模板毕竟是模板，不是真实的dom节点。从模板到真实dom节点还需要经过一些步骤把模板编译为render函数实例进行挂载, 根据根节点render函数的调用，递归的生成虚拟dom对比虚拟dom，渲染到真实dom组件内部data发生变化，组件和子组件引用data作为props重新调用render函数，生成虚拟dom...
2019-04-28 14:16:36
8842
1
原创 VUE—数据响应原理真的是双向绑定吗？
很多朋友在理解 Vue 的时候都把 Vue 的数据响应原理理解为双向绑定，但实际上这是不准确的，我们之前提到的数据响应，都是通过数据的改变去驱动 DOM 视图的变化，而双向绑定除了数据驱动 DOM 外， DOM 的变化反过来影响数据，是一个双向关系，在 Vue 中，我们可以通过 v-model 来实现双向绑定。在Vue中体现出双向绑定作用的方式有两种，在分析之前我们先介绍这两种使用方式有什么区...
2019-04-27 14:17:18
737
原创 javascript引擎工作原理
1. 什么是JavaScript解析引擎？简单地说，JavaScript解析引擎就是能够“读懂”JavaScript代码，并准确地给出代码运行结果的一段程序。比方说，当你写了 var a = 1 + 1; 这样一段代码，JavaScript引擎做的事情就是看懂（解析）你这段代码，并且将a的值变为2。学过编译原理的人都知道，对于静态语言来说（如Java、C++、C），处理上...
2019-04-26 14:25:24
729
原创 JS传参技巧总结
1.隐式创建 html 标签<input type="hidden" name="tc_id" value="{{tc_id}}">这种方法一般配合ajax，上面的value使用了模板引擎2.window[‘data’]window['name'] = "the window object";3.使用localStorage，cookie等存储window.localS...
2019-04-23 14:37:43
675
原创 从前端到未来，前端发展闲聊
1. 前情提要毋庸讳言，在我刚工作的时候，前端是还是一个不受重视的岗位。切图狗，写网页的这种侮辱性绰号绑在前端开发身上。我自己体验到的一个很明显的标志是：招聘网站上，前端开发的工资是其他开发工资的90%甚至更低。在知乎一个2011年的前端地位问题（《如何改善国内前端开发行业的尴尬地位？》）中，包括贺师俊老师都承认这种尴尬确实存在。但是，30年河东30年河西，到了2018年，前端已经成了炽手可热...
2019-04-20 17:13:25
8388
7
原创 正则全攻略使用手册,你确定不进来看看吗
前言正则表达式是软件领域为数不多的伟大创作。与之相提并论是分组交换网络、Web、Lisp、哈希算法、UNIX、编译技术、关系模型、面向对象等。正则自身简单、优美、功能强大、妙用无穷。学习正则表达式，语法并不难，稍微看些例子，多可照葫芦画瓢。但三两篇快餐文章，鲜能理解深刻。再遇又需一番查找，竹篮打水一场空。不止正则，其他技术点同样，需要系统的学习。多读经典书籍，站在巨人肩膀前行。这里涉及的东西...
2019-04-20 15:19:04
489
原创 Koa日志中间件封装开发详解
对于一个服务器应用来说，日志的记录是必不可少的，我们需要使用其记录项目程序每天都做了什么，什么时候发生过错误，发生过什么错误等等，便于日后回顾、实时掌握服务器的运行状态，还原问题场景。日志的作用记录服务器程序运行状态；帮助开发者快速捕获错误，定位以及决解故障。日志中间件开发工具log4js在node当中没有自带的日志模块，所以需要使用第三方模块使用模块：log4js安装：&nb...
2019-04-18 15:41:23
550
原创 如何在Vue.js中实现标签页组件详解
###前言标签页组件，即实现选项卡切换，常用于平级内容的收纳与展示。因为每个标签页的内容是由使用组件的父级控制的，即这部分内容为一个 slot。所以一般的设计方案是，在 slot 中定义多个 div，然后在接到切换消息时，再显示或隐藏相关的 div。这里面就把相关的交互逻辑也编写进来了，我们希望在组件中处理这些交互逻辑，slot 只单纯处理业务逻辑。这可以通过再定义一个 pane 组件来实现，...
2019-04-16 19:52:59
3028
原创 为什么要学习vue
Vue是什么？来看看官方的介绍。Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。Vue和Jquery有什么区别？...
2019-04-16 15:04:05
604
原创 写一个Vue Popup组件
组件长这样主要有标题、内容、按钮个数、按钮颜色、按钮文案这些可配置项期望的调用方式一不需要等待用户二次确认import Modal from 'common/components/modal' handleModal() { Modal({ title: '赚取收益？', content: '根据您的授权金额和计息天数计算得出(还未到账)。实际以到账金额为准。', c...
2019-04-15 15:41:38
3150
1
原创 JavaScript函数的4种调用方法实例分析
本文实例讲述了JavaScript函数的4种调用方法。分享给大家供大家参考，具体如下：JavaScript 函数有 4 种调用方式：作为一个函数调用函数作为方法调用使用构造函数调用函数作为函数方法调用函数分述如下：每种方式的不同方式在于 this 的初始化。作为一个函数调用function myFunction(a, b) { return a * b;}myFunc...
2019-04-14 14:41:09
844
原创 Vue动画事件详解及过渡动画实例
为了应用过渡效果，需要在目标元素上使用 transition 特性：<div v-if="show" transition="my-transition"></div>transition 特性可以与下面资源一起用：v-ifv-showv-for （只在插入和删除时触发，使用 vue-animated-list 插件）动态组件在组件的根节点上，并且被 Vu...
2019-04-11 15:29:37
1857
1
原创 总结4个方面优化Vue项目
运行时优化1、使用v-if代替v-show两者的区别是：v-if不渲染DOM，v-show会预渲染DOM除以下情况使用v-show，其他情况尽量使用v-if有预渲染需求需要频繁切换显示状态2、v-for必须加上key，并避免同时使用v-if一般我们在两种常见的情况下会倾向于这样做:为了过滤一个列表中的项目比如 v-for=“user in users” v-if=“user.is...
2019-04-10 20:10:35
1221
原创 15个最好用的JavaScript代码压缩工具
JavaScript 代码压缩是指去除源代码里的所有不必要的字符，而不改变其功能的过程。这些不必要的字符通常包括空格字符，换行字符，注释以及块分隔符等用来增加可读性的代码，但并不需要它来执行。在这篇文章中，我们选择了15个最好用的 JavaScript 压缩工具，有简单的在线转换器，GUI工具和命令行界面等。1. JavaScript Minifier它是一个很好的工具，带有API来缩小j...
2019-04-10 17:12:31
6703
原创 简单实现vue中的依赖收集与响应的方法
开始声明一个对象man，可以视为vue中的datalet man = { height: 180, weight: 70, wealth: 100000000}添加Observer作用在于将参数对象的属性变为响应式，只要对象的属性被读取或者被修改都能观察到。然后新建一个Observer实例，将man作为参数扔进去。这里的proxyData是将man的属性代理到以man为参数的Ob...
2019-04-10 14:23:34
499
原创 JS module的导出和导入的实现代码
最近看了些Vue框架写的程序，发现自己的前端知识还停留在几年以前，发现现在Javascript程序里有各种各样的对module的导入和到处，导入乍一看跟python的语法挺像的无非就是把from和import这两个关键词的使用颠倒了一下顺序。仔细看下来还是和python挺不一样的import模块的前提是模块有导出，并且还分默认导出和命名导出，有些麻烦。所以今天这篇文章就把所有的export形式和相...
2019-04-09 15:12:34
439
原创 浅谈vue中的MVVM实现原理
现成MVVM菜单教程<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>Vue 测试实例 - 菜鸟教程(runoob.com)</title> <script src="https://unpkg.com/vue/dist/vue.j...
2019-04-03 19:49:54
643
1
原创 Vue指令指令大全
1. v-textv-text主要用来更新textContent，可以等同于JS的text属性。<span v-text="msg"></span>这两者等价：<span>{{msg}}</span>2. v-html双大括号的方式会将数据解释为纯文本，而非HTML。为了输出真正的HTML，可以用v-html指令。它等同于JS的inn...
2019-04-03 15:57:17
536
原创 Vue指令指令大全
1. v-textv-text主要用来更新textContent，可以等同于JS的text属性。<span v-text="msg"></span>这两者等价：<span>{{msg}}</span>2. v-html双大括号的方式会将数据解释为纯文本，而非HTML。为了输出真正的HTML，可以用v-html指令。它等同于JS的inn...
2019-04-03 15:26:23
3507
原创 Vue指令指令大全
1. v-textv-text主要用来更新textContent，可以等同于JS的text属性。<span v-text="msg"></span>这两者等价：<span>{{msg}}</span>2. v-html双大括号的方式会将数据解释为纯文本，而非HTML。为了输出真正的HTML，可以用v-html指令。它等同于JS的inn...
2019-04-03 15:26:23
490
原创 从0到1构建vueSSR项目之node以及vue-cli3的配置
前言上一次做了路由的相关配置，原本计划今天要做vuex部分，但是想了想，发现vuex单独的客户端部分穿插解释起来很麻烦，所以今天改做服务端部分。服务端部分做完，再去做vuex的部分，这样就会很清晰。vue ssr是分两个端，一个是客户端，一个是服务端。所以要做两个cli3的配置。那么下面就直接开始做吧。修改package.json的命令//package.json :client代表...
2019-04-02 21:07:59
1837
1
原创 那些大佬公司的前端面试都喜欢问些什么？
英文原文：http://davidshariff.com/blog/preparing-for-a-front-end-web-development-interview-in-2017/在过去的几年里，我在亚马逊和雅虎面试过很多专注于前端开发的 Web 开发者和软件工程师，在这篇文章中，我想分享一些面试技巧，帮助候选人为面试做好准备。免责声明——本文并非旨在列出在前端面试中可能会被问到...
2019-04-02 16:44:10
1483
原创 阿里P7解析“前端开发的难点到底在哪里？”
不同级别的前端面临的难点各不相同，不可一概而论；业务开发的前端难点在于对业务的理解和把控能力；平台开发的前端难点在于产品化的把控和推进能力。观点1：不同级别的前端面临的难点各不相同，不可一概而论。其他回答有说 CSS 难，有说 CSS 不难的，每个人水平不同，这样争论毫无意义。我刚学前端时觉得 JS/CSS/浏览器兼容问题都很难，现在觉得也就那样，因为前端路子广，办法总比问题多。后来...
2019-04-01 21:40:59
8367
2
原创 Node.js Event Loop各阶段讲解
Event Loop阶段描述图timerstimer阶段处理setTimeout于setInterval回调，开始处理的时机与poll阶段有关联。pending callbacks该阶段执行某些系统操作的回调，比如TCP套接字在连接时收到ECONNREFUSED。网上有一些将该阶段称为I/O callbacks的文章都是过时错误的，具体可以移步Node.js官方库下面的这个issue:...
2019-04-01 16:41:38
507
原创 Vue实现一个图片懒加载插件
前言图片懒加载是一个很常用的功能，特别是一些电商平台，这对性能优化至关重要。今天就用vue来实现一个图片懒加载的插件。 这篇博客采用“三步走”战略——Vue.use()、Vue.direction、Vue图片懒加载插件实现，逐步实现一个Vue的图片懒加载插件。Vue.use()就像开发jQuery插件要用$.fn.extent()一样，开发Vue插件我们要用Vue.use()。其实就是官方内...
2019-04-01 14:21:43
954
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人