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

vue中async-await的使用误区；快速利用 vue 或者 react 开发 chrome 插件；了解JavaScript中的Memoization以提高性能,再看React的应用；通用、封装、简化 webpack 配置；快速理解D3js 数据绑定之 enter 与 exit 与 update；彻底理解JavaScript函数的调用方式和传参方式——结合经典面试题；Vue中的基础过渡动画原理解析；初识区块链 – 用JS构建你自己的区块链

vue中async-await的使用误区曾经见过为了让钩子函数的异步代码可以同步执行，而对钩子函数使用async/await，就好像下面的代码： // exp-01 export default { async created() { const timeKey = ‘cost’; console.time(timeKey); console.log(‘start created’); this.list = await this.getList(); console.log(this.list…
快速利用 vue 或者 react 开发 chrome 插件原文链接： github.com/lzwaiwai/bl… 最近写了一个可以利用 vue 或者 react 快速开发 chrome 插件的 boilerplate，只需要使用我之前写的 bigroom-cli 工具，就可快速简单地进行启动、打包、编译等，同时也支持保存代码后，插件自动更新，页面自动刷新。 boilerplate 生成：首先我们安装 bigroom…
了解JavaScript中的Memoization以提高性能,再看React的应用英文: Understanding Memoization in JavaScript to Improve Performance 中文: 了解JavaScript中的Memoization以提高性能–react的应用(欢迎star) 我们渴望提高应用程序的性能， Memoization 是 JavaScript 中的一种技术，通过缓存结果并在下一个操作中重新使用缓存来加速查找费时的操作。 …
通用、封装、简化 webpack 配置现在，基本上前端的项目打包都会用上 webpack，因为 webpack 提供了无与伦比强大的功能和生态。但在创建一个项目的时候，总是免不了要配置 webpack，很是麻烦。
快速理解D3js 数据绑定之 enter 与 exit 与 update D3.js is a JavaScript library for manipulating documents based on data. 就像我之前文章提到的，D3js 给自己的定位并不是图表，如官网所言，他是数据驱动dom。能理解这一点，就能将之灵活运用到各自场景。比如，给普通table的 <td/> 加上数据背景色变成数据透视表；给文本font-size绑定数据，变成简易词云…
彻底理解JavaScript函数的调用方式和传参方式——结合经典面试题了解函数的调用过程有助于深入学习与分析JavaScript代码。在JavaScript中，函数是一等公民，函数在JavaScript中是一个数据类型，而非像C#或其他描述性语言那样仅仅作为一个模块来使用。函数有四种调用模式，分别是：函数调用形式、方法调用形式、构造器形式以及apply和call调用形式。这里所有模式中，最主要的区别在…
Vue中的基础过渡动画原理解析在日常开发中动画是必不可少的一部分不仅能让元素直接的切换显得更加自然同时也能极大的增强用户体验因此在Vue之中也提供了非常强大的关于动画这方面的支持 Vue不仅支持用CSS来写一些过渡效果同时也是支持JS的不过在这个文章中讲述的都是如何利用CSS来实现过渡动画、keyframes动画以及实现的原理过渡动画实现…
初识区块链 – 用JS构建你自己的区块链
前端面试常考知识点—CSSCSS3边框与圆角 CSS3圆角border-radius:属性值由两个参数值构成: value1 / value2，值之间用/分隔，value1代表圆角的水平半径，value2代表圆角的垂直半径盒阴影box-shadow:语法：box-shadow: 水平方向的偏移量垂…
前端进阶（第一期）-调用堆栈笔记 var a = 20; var b = ‘abc’; var c = true; var d = { m: 20 } 复制代码值类型数据和引用数据类型的复制值类型数据是值的复制，开辟新的存储空间来存储值，复制前后的数据之间无联系。引用类型数据仅仅是地址的复制，开辟新的存储空间来存储地址指针，复制前后的地址指针指向堆中同一个值。 …
前站 – 前端导航，搜索社区，阅读文章，提升技术推荐一个前端导航网站，记录了各种关于前端的网址，可以直接在对应社区查找问题，还可以查看github热门项目
http中web前后端的跨域本文详见 github: [链接] server文件夹 server.js 提供主server api服务 node server/server.js 开启服务 staticServer.js 提供一个静态html容器 node server/staticServer.js 开启服务 www文件夹 cross-domain.h…
看完React文档后，重写了下CnodeJS社区，感觉看上去还不错Github DEMO 欢迎Star 一个 React 的初/中级练习项目：重构 CnodeJS 社区这里简述下我学习 React 的方式：看了一边文档，把‘主要概念’全部看完，‘高级指引’里的根据个人兴趣挑了一些看了看。紧接着就动手写此…
javascript忍者秘籍-第五章闭包和作用域闭包允许函数访问并操作函数外部的变量,只要变量或函数存在于声明函数时的作用域内,闭包就可以访问这些变量和函数 //全局闭包不明显 var outerValue = "ninja"; function outerFunction(){ outerValue === "ninja"; //true } outerFunction(); 复制代码 //闭包例子 var outerValue = &quo…
NodeJS应用程序身份验证绕过漏洞分析本文主要针对的是我参加一个漏洞赏金计划的过程中发现的NodeJS应用程序身份验证绕过漏洞进行分析。我们将重点讲述我所使用的方法，以便在遇到类似的Web界面（仅提供单一登录表单）时可以利用这种方法来寻找漏洞。方法论如果大家曾经对大型网站（例如GM、Sony、Oath或Twitter）进行过漏洞挖掘，那么进行的第一项工…
webpack 打包多页面一开始接触 webpack 是因为使用 Vue 的关系，因为 Vue 的脚手架就是使用webpack构建的。刚开始的时候觉得 webpack 就是为了打包单页面而生的，后来想想，这么好的打包方案，只在单页面上使用是否太浪费资源了呢？如果能在传统多页面上使用 webpack ，开始效率是否会事半功倍呢？好在众多优秀的前端开发者已经写了许多dem…
JavaScript中的函数继承几乎每个开发人员都有面向对象语言（比如C++、C#、Java）的开发经验。在传统面向对象的语言中，有两个非常重要的概念——类和实例。类定义了一些事物公共的行为和方法；而实例则是类的一个具体实现。我们还知道，面向对象编程有三个重要的概念——封装、继承和多态。但是在Javascript的世界中，所有的这一切特性似乎都不存…
教你如何编写Babel插件前置知识：了解babel的使用，了解JavaScript语法树安装 babel-cli, babel-core 我们的打包文件 import antd, { Table } from ‘antd’; let arrow = () => {}; const component = <Table />; 复制代码 .babelrc 配置 { "presets": , "plugins": [ […
ECMAScript 2015（ES6）有用的提示与技巧EcmaScript 2015（ES6）已经出来好几年了，可以巧妙地使用各种新功能。列出并讨论其中一些，你会发现它们很有用。如果你知道其他好方法，请在评论中回复，共同学习。
【微软终于在浏览器上认输了？】全文=> 　　微软终于在浏览器上认输了？在用 Edge 取代多年的 IE 之后，如今 Edge 也低下了头颅，承认了 Chrome 的胜利。　　Microsoft Edge 浏览器在 2015 年 1 月 21 日公布，并在3 月 30 日发布了第一个预览版，并在之后成为 Windows 10 的默认浏览器，采用 EdgeHTML 渲染引擎并在体验上相比 IE 有着多项改进。但现在&n…
【20181205 前端开发日报】JavaScript之跨域解决方式；Web 后端开发者也需要了解的跨域问题；前端er，你真的会用 async 吗？；Webhook到底是个啥？；前端技术周刊 2018-12-03：DOM；你想知道关于pa…详情→
js错误处理权威指北原文接着我上一篇文章，我想谈谈异常。我肯定你之前也听过——异常是个好东西。一开始，我们害怕异常，毕竟写bug容易被人喷。其实通过修bug，我们实际上学会了下次开发怎么避免这个bug并且可以做得更好。在生活中，我们常说吃一堑长一智。但对于打代码来说，有些不一样。我们的编译器和一些工具现在都很智能，不…
【谷歌的JavaScript编写风格中 13点值得我们注意的！】全文=> 　　对于那些还不熟悉JavaScript的编写风格的人，谷歌提供了编写JavaScript的编写风格指南，谷歌风格指南其中列出了编写干净、可理解代码的最佳风格实践。　　对于编写有效的JavaScript来说，这些并不是硬性的、快速的规则，而只是在源文件中维护一致的、吸引人的样式选择的规则。这对于JavaScript来说尤其有…
《常见 React 面试题》本文涵盖了大部分前端工程师需要掌握关于React的核心知识。（by 小胡）
【Web登录其实没那么简单】标准的HTML语法中，支持在form表单中使用<input></input>标签来创建一个HTTP提交的属性，现代的WEB登录中，常见的是下面这样的表单。详见（来自：letcafe）
javascript 资料型態/结构验证库 : Skeletons 当初专案需要将资料以JSON格式储存在本地端，万一资料结构出了问题或是不符合预其，后面程式都会出问题，因此想写一个简单直觉的纯JS资料验证方法，并开源到npm上。希望对大家有帮助。喜欢可以给个星:) 有任何讨论都欢迎。源码 github npm Javascript 型态先来介绍一…
【Flutter 1.0 重磅发布，除了移动它还想做桌面和 Web 开发】今天，在 Flutter Live 上，Google 宣布 Flutter 1.0 正式发布。此外，谷歌还宣布和 Square 等公司合作开发一系列新的第三方集成工具和一些新功能，目的是使 Flutter 与现有应用程序的集成变得更加容易，详细来看[doge]  全文