20180808 前端开发日报-前端开发博客

JavaScript数组的十八般武艺；webpack4介绍与总结；实战Vue简易项目（5）模拟数据；动手理解导航守卫（Vue）；使用webpack4搭建一个基于Vue的组件库；js 面向对象总结；扔掉Nginx，扔掉SwitchHosts，做纯粹的前端开发；JS中常用设计模式总结（带案列）

JavaScript数组的十八般武艺数组是值的有序集合，每个值叫做一个元素，而每个元素在数组中有一个位置，以数字表示，称为索引。 JavaScript数组的索引是基于零的32位数值，第一个元素索引为0，数组最大能容纳4294967295（即2^32-1）个元素。 JavaScript数组是动态的，根据需要它们会增长或缩减，并且在创建数组时无需声明一个固定的大小或…
webpack4介绍与总结由于web应用扩展地得极其迅猛，前端技术也是日新月异，前端的苦不是有多难学，而是我刚学完，这东西就被淘汰了（手动哭脸）。框架方面我们有vue、react、angular，我们需要写vue单文件，也需要写jsx语法；js方面我们有Typescript、es6(7、8、9)，现在是每年一个小版本的迭代，语法也是在不断更新和淘汰；模块方面我们有e…
实战Vue简易项目（5）模拟数据我们先将项目中src/components/HelloWorld.vue删除，将src/router/index.js作如下修改：
动手理解导航守卫（Vue）最近不是很忙，把自己不会的技术点看了一遍文档，然后动手敲了一下代码，加深自己理解。通过实战Demo，调试，结果分析，理解了官网的知识点。记录下来，第一是方便自己加深理解，第二是后续可以回顾，第三可以帮助像我这种小白的人一起学习。导航就是我们说的路由，当路由发生变化的时候，我们想要做的事情，这就是导…
使用webpack4搭建一个基于Vue的组件库组内负责的几个项目都有一些一样的公共组件，所以就着手搭建了个公共组件开发脚手架，第一次开发 library，所以是参考着 iview 的配置来搭建的。记录如何使用webpack4搭建一个library的脚手架前言使用 webpack4，需要安装 webpa
js 面向对象总结最近感觉，不知道该学点什么，老是觉的自己什么都不会，又感觉是会点什么，说是也知道面向对象，但是让系统的说一下这里面的东西，感觉连不上线，成不了太系统的了解，所以就看了一下这的知识点，当自己的搬运工，假装是发了一篇文章，等自己查看方便；创建对象工厂模式：用函数来封装，以特定接口创建对象…
扔掉Nginx，扔掉SwitchHosts，做纯粹的前端开发什么是纯粹的前端开发首先我这里所说的纯粹的前端，指的是完全独立于服务端的开发，本地不需要有服务端的环境、不需要运行服务端的代码，单纯通过发送和接受请求来完成所有的交互。由于前后端分离的架构愈发流行，纯粹的前端开发也变的越来越多，那么本文就简单讲讲我
JS中常用设计模式总结（带案列）写在前面设计模式，是一套经过前人总结、业务验证并适合于特定业务开发的代码组织方式，可能会有一些同学会认为设计模式没有用，我这里需要指出设计模式并不是万能的只适合于特定业务场景的开发（对我们的业务开发起到一定的指导作用，所有设计模式的目的都是让开发者编
当 Vue 处理数组与处理纯对象的方式一样处理数组方法的弊端 Vue 在响应式的处理中，对数组与对象采用了不同的方式，如下源码所示： if (Array.isArray(value)) { const augment = hasProto ? protoAugment : copy
JavaScript核心概念(1):类型转换本文首发于个人博客看到这个是不是有一种想打人的感觉，垃圾 JavaScript，这特么都什么鬼，相信很多人不管是笔试还是面试，都被 JS 的类型转换难道过，相信认真看完我这篇文章，妈妈再也不用担心类型转换的问题了。原始值到原始值的转换原始值转化为布尔值所有的假值(undefined、null、0、-0…
ES6深入浅出 ClassesJS 是基于原型的语言，那么ES6里的classes是什么东西？classes 是原型继承的语法糖——主要是用来勾引不太理解 JS 原型链语法的其他语言使用者。ES6有好多新的特性本质上就是语法糖，classes也不例外。我会向你…
JS的Event Loop 和 microTask 面试和笔试题目中，经常会出现'promise','setTimeout'等函数混合出现时候的运行顺序问题。我们都知道这些异步的方法会在当前任务执行结束之后调用，但为什么'promise'会在'setTimeout'之前执行？具体的实现原理是什么？有和我
从源码解析vue的响应式原理前言 vue官方对响应式原理的解释：深入响应式原理总结下官方的描述,大概分为一下几点：组件实例有自己的watcher对象，用于记录数据依赖组件中的data的每个属性都有自己的getter、setter方法，用于收集依赖和触发依赖组件渲染过程中，调用
JavaScript Note.我想插入一个动态的脚本还是安静的当个笔记本吧…… 最近两次跌到在同一个坑里，问题其实非常简单，也非常基础，就是——我需要动态加载并执行脚本。一般来说，我喜欢用 innerHTML 这种简单明快的方式添加内容，但是却发现， innerHTML 竟然无法执行我添加的 <script> 脚本，很明显，这不符合我的预期—— 先来说说解决方案…
「Vue.js」Vue-Router + Webpack 路由懒加载实现当打包构建应用时，Javascript 包会变得非常大，影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件，这样就更加高效了。结合 Vue 的异步组件和 Webpack 的…
测试 Node.js，2018
培训机构让Github的含金量降低了？Github ，在程序员这个行业，即使自己不活跃，都会有听说过的一个开源社区。近年来，越来越多的人拥抱开源，使得 Github 又火了一把。也有很多人把自己的得意之作放到上面去，毕竟自己有作品放在上面，相当于告…
【SVG 图像入门教程】全文=> 　一、概述　　SVG 是一种基于 XML 语法的图像格式，全称是可缩放矢量图（Scalable Vector Graphics）。其他图像格式都是基于像素处理的，SVG 则是属于对图像的形状描述，所以它本质上是文本文件，体积较小，且不管放大多少倍都不会失真。　　SVG 文件可以直接插入网页，成为 DOM 的一部分，然后用 JavaS…
【汇编程序开发环境搭配】全文=> 　引子　　由于这些日子一直都在研究底层的技术，从 Windows 驱动程序，到 Windows 内核等等技术的学习，让我对底层的技术越发有兴趣了，而刚好，在研究 WRK 时，对内存管理，寄存器，地址总线，数据总线，控制总线等的理解不够透彻，所以越发的想学习汇编程序设计来提升功力，而由于近来在公司里一直都有项目压着…
Node.js：浅析高并发与分布式集群 Node特性：高并发在解释node为什么能够做到高并发之前，不妨先了解一下node的其他几个特性：单线程我们先来明确一个概念，即：node是单线程的，这一点与JavaScript在浏览器中的特性相同，并且在node中JavaScript主线程与其他线程（例如I/O线程）是无法共享状态的。 …
react-native自动打包部署方案详解你是否想写完代码后，无需打开xcode和android studio，只要执行一个shell脚本，就能把android和ios都打包出来？而且自动帮你传到蒲公英和App Store，接着产品自动去下载测试。而你，直接去喝咖啡了。Of course，…
扒一扒PROMISE的原理，大家不要怕在前端的日常工作中，回调函数（callback）应该是见怪不怪了，但是当回调函数遇上了异步（async），这就令人发指了。那么异步是什么意思呢，简单地说就是不等你执行完，就先执行下方的代码了。举个：我们最常用的异步操作应该是ajax了（想当初我第一次用
《Webkit技术内幕》之页面渲染过程最近拜读了传说中的《Webkit技术内幕》一书，有很大收获，尤其是对页面渲染有了较深的认识。由于功力有限，而且书中设计到较多的底层也无法理解，所以本文主要整理和分享一下自己理解的基于Webkit内核浏览器的页…
记一个JavaScript图片轮播思路与代码说在前头       喜欢并学习前端，一路摸爬滚打过来，现在算算也快满一年的，每天或多或少都会来“拜读”大家的写的文章，学习与感悟了不少，作为一名要变的更强的前端小哥哥，在这个节点上，也想写点东西，算
js Event Loop 运行机制 Event Loop，事件环，线程进程。这些概念对初识前端的同学来说可能会一头雾水。而且运行js代码的运行环境除了浏览器还有node。因此不同环境处理Event Loop又变得不同，十分容易混淆。如果你有这样的疑问。下文将给你一个清晰的解释。概念梳理首先我
Vue 系列之 Vuex 数据流向摘要来自摩拜前端团队的 bing 本文主要了解 Vuex 的整个数据流向及各模块之间的触发使用。欢迎留言并分享 Vuex 使用中遇到的坑，欢迎批评指正。其他前端干货敬请关注我司微信公众号 – 《前端新视野》。日常开发中一般我们都会接触到组件化的概念，将一些通用的模块封装成组件去…
初识React：仿网易公开课（react+antd）前言最近开始学习React，于是便仿了一下网易公开课，来加强自己对React的理解，在这里和大家分享一下我这几天coding的React项目和自己踩的一些坑使用到的技术栈数据请求：axios 后台搭建：koa 跨域解决：koa-cors css预编
使用 ndb 调试你的 Node.js 项目代码调试按照调试方式大致分为日志（Log）和断点（Breakpoint）两种办法。其中日志就是手动的在代码中增加日志打印获取过程信息来判断问题。这种方法的好处是调试简单，一个对业务熟练的工程师通过线上良好的日志记录可以非常快的发现业务问题。但是它的缺点也非常明显，获取的内容比较单一，动态调试需要不断的在业务中…