ES6
面向对象的夜猫子
抽象,继承,封装,多态。
展开
-
ES6:JavaScript中的类Class
ES5中的近类结构ES5以及之前的版本,没有类的概念,但是聪明的JavaScript开发者,为了实现面向对象,创建了特殊的近类结构。ES5中创建类的方法:新建一个构造函数,定义一个方法并且赋值给构造函数的原型。ES6 class类ES6实现类非常简单,只需要类声明。推荐 babel在线测试ES6 测试下面的代码。类声明如果你学过java,那么一定会非转载 2017-09-18 09:02:06 · 494 阅读 · 0 评论 -
说说JavaScript的原型链
在JS中,原型链有时候让人觉得很胡里花哨,又是prototype、__proto__又是各种指向什么的,让人觉得很头疼。如果你也有这种感觉,或许这篇文章可以帮助到你一、认识原型1、先来一串代码var Person = function(msg){ this.msg = msg;}var person1 = new Person("wanger")person1.cons转载 2017-10-12 10:55:42 · 384 阅读 · 0 评论 -
ES6系列文章 异步神器async-await
关于异步处理,ES5的回调使我们陷入地狱,ES6的Promise使我们脱离魔障,终于、ES7的async-await带我们走向光明。今天就来学习一下 async-await。async-await和Promise的关系经常会看到有了 async-await、promise 还有必要学习吗、async await优于promise的几个特点,接收了这些信息后,就蒙圈了。现在才知道,asy转载 2017-10-13 08:41:51 · 420 阅读 · 0 评论 -
前端需要了解的 SSO 与 CAS 知识
不管是什么公司,只要产品数量大于一个,那么单点登录势必是绕不过去的一个问题。作为前端程序员,我们对其虽然接触不多,但适当的了解还是必要的。本文就来谈谈单点登录相关的问题。前置知识了解 SSO,最好具备以下知识。当然,如果不是特别熟,也不影响阅读。cookie及session浏览器同源策略及跨域了解登录系统的构成什么是 SSO 与 CAS?SSOS转载 2017-11-08 15:35:51 · 413 阅读 · 0 评论 -
移动端页面平滑翻页的解决方案
随着近几年移动营销页的火爆,催生了一个中国式的名词「H5」。而 H5 最常见的形态就是类似幻灯片翻页效果。我们需要制作 H5 的时候,最快的办法就是使用一些滑动插件库,如 iDangero.us 出品的 Swiper,百度 BE-FE 出品的 iSlider。通过这些翻页库提供的强大的配置功能,我们就能实现很酷炫的翻页效果。当然,这些库还支持自动播放,点击切换和当前页面指示等配置,所以还能转载 2017-10-31 13:45:01 · 1470 阅读 · 0 评论 -
js创建一条通用链表
js创建一条通用链表by leeenx on 2017-10-13什么是「链表科普」?链表是一种物理存储单元上非连续、非顺序的存储结构,数据元素的逻辑顺序是通过链表中的指针链接次序实现的。什么是「顺序存储结构科普」?在计算机中用一组地址连续的存储单元依次存储线性表的各个数据元素,称作线性表的顺序存储结构。多数高级语言的「数组」转载 2017-10-24 09:01:33 · 271 阅读 · 0 评论 -
解决前端跨域的正确姿势
一、 跨域请求的含义浏览器的同源策略,出于防范跨站脚本的攻击,禁止客户端脚本(如 JavaScript)对不同域的服务进行跨站调用。一般的,只要网站的 协议名protocol、 主机host、 端口号port 这三个中的任意一个不同,网站间的数据请求与传输便构成了跨域调用。这也是我们下面实践的理论基础。我们利用 NodeJs 创建了两个服务器,分别监听 30转载 2017-10-24 09:03:16 · 1037 阅读 · 1 评论 -
JavaScript Event Loop 机制详解与 Vue.js 中实践应用
JavaScript Event Loop 机制详解与 Vue.js 中实践应用归纳于笔者的现代 JavaScript 开发:语法基础与实践技巧系列文章。本文依次介绍了函数调用栈、MacroTask 与 MicroTask 执行顺序、浅析 Vue.js 中 nextTick 实现等内容;本文中引用的参考资料统一声明在 JavaScript 学习与实践资料索引。1. 事件循环机制详解转载 2017-10-24 12:35:01 · 394 阅读 · 0 评论 -
ES6 变量声明与赋值:值传递、浅拷贝与深拷贝详解
ES6 变量声明与赋值:值传递、浅拷贝与深拷贝详解归纳于笔者的现代 JavaScript 开发:语法基础与实践技巧系列文章。本文首先介绍 ES6 中常用的三种变量声明方式,然后讨论了 JavaScript 按值传递的特性,最后介绍了复合类型拷贝的技巧;有兴趣的可以阅读下一章节 ES6 变量作用域与提升:变量的生命周期详解。变量声明与赋值ES6 为我们引入了 let 与 co转载 2017-10-24 12:33:28 · 1476 阅读 · 0 评论 -
8大前端安全问题
当我们说“前端安全问题”的时候,我们在说什么“安全”是个很大的话题,各种安全问题的类型也是种类繁多。如果我们把安全问题按照所发生的区域来进行分类的话,那么所有发生在后端服务器、应用、服务当中的安全问题就是“后端安全问题”,所有发生在浏览器、单页面应用、Web页面当中的安全问题则算是“前端安全问题”。比如说,SQL注入漏洞发生在后端应用中,是后端安全问题,跨站脚本攻击(XSS)则是前端安全问题,转载 2017-11-02 09:07:43 · 727 阅读 · 0 评论 -
教你从零开始搭建一款前端脚手架工具
前言在实际的开发过程中,从零开始建立项目的结构是一件让人头疼的事情,所以各种各样的脚手架工具应运而生。笔者使用较多的yoeman,express-generator和vue-cli便是当中之一。它们功能丰富,但最核心的功能都是能够快速搭建一个完整的项目的结构,开发者只需要在生成的项目结构的基础上进行开发即可,非常简单高效。作为一个不折腾会死星人,在熟悉了使用方法以后就开始琢磨起它们转载 2017-10-20 15:28:36 · 609 阅读 · 0 评论 -
ES6 Promise:模式与反模式
当几年前,第一次使用 NodeJS 的时候,对现在被称为“ 回调地狱 ”的写法感到很困扰。幸运的是,现在是 2017 年了,NodeJS 已经采用大量 JavaScript 的最新特性,从 v4 开始已经支持 Promise。尽管 Promise 可以让代码更加简洁易读,但对于只熟悉回调函数的人来说,可能对此还是会有所怀疑。在这里,将列出我在使用Promise 时学到的一些基本模式,以转载 2017-10-10 11:07:39 · 352 阅读 · 0 评论 -
Promise 异步流程控制
最近部门在招前端,作为部门唯一的前端,面试了不少应聘的同学,面试中有一个涉及 Promise 的一个问题是:网页中预加载20张图片资源,分步加载,一次加载10张,两次完成,怎么控制图片请求的并发,怎样感知当前异步请求是否已完成?然而能全部答上的很少,能够给出一个回调 + 计数版本的,我都觉得合格了。那么接下来就一起来学习总结一下基于 Promise 来处理异步的三种方法。本文的转载 2017-10-10 11:16:29 · 403 阅读 · 0 评论 -
JS中的算法与数据结构——栈(Stack)
栈(Stack)上一篇我们说到了列表,它是一种最自然的数据组织方式,如果对数据的存储顺序要求不重要,那么列表就是一种非常适合的数据结构,但对于计算机其他的一些应用(比如后缀表达式),那么列表就显得有些无能为力, 所以,我们需要一种和列表功能相似但更复杂的数据结构。栈,又叫堆栈,是和列表类似的一种数据结构,但是却更高效,因为栈内的元素只能通过列表的一端访问,称为栈顶,数据只能在栈顶添加或转载 2017-09-26 09:06:57 · 483 阅读 · 0 评论 -
移动端页面适配———多方案解析
在移动互联网快速发展的今天,手机的种类和尺寸越来越多,作为前端的小伙伴们可能会越来越头疼,但又不得不去适配一款又一款的新机型。对于移动端适配,不同的公司、不同的团队有不同的解决方案。我在项目中也用了一部分解决方案,也看到了一些解决方案,对比下,总结一些自己的理解,希望对各位有帮助,找到最适合你们项目的适配方案。转载 2017-09-26 09:13:06 · 2088 阅读 · 0 评论 -
webpack:从入门到真实项目配置
该文使用的 Webpack 版本为 3.6.0,本文分两部分。第一步是简单的使用 webpack,第二部分通过一个真实项目来配置 webpack,没有使用任何的 CLI,都是一步步配置直到完成生产代码的打包。这是本项目对应的仓库,每个小节基本都对应了一次转载 2017-09-19 08:51:09 · 443 阅读 · 0 评论 -
《深入理解ES6》阅读笔记 --- 用模块封装代码
不知不觉《深入理解ES6》阅读笔记就写到了最后一篇,完结之后可能会开启另外的一个系列,分享自己的知识点,让阅读到的人有一点点的收获,以及自己的成长。最后一篇主要是来写一写用模块封装代码的事情,回顾历史,从最早的立即执行函数,再到require.js,以及commonjs,今天我们面对的是语言标准给我们带来的模块化方案。如果说模块,我们应该可以从字面的意思上来看,这是一种可以自动运行在严格模式下并且转载 2017-10-10 09:47:57 · 324 阅读 · 0 评论 -
localstorage的那些事
HTML5中 Web Storage 的出现,主要是为了弥补使用 Cookie 作为本地存储的不足。Cookie 存储的数据量非常小,而且数据会自动携带到请求头里,但服务器端可能并不关心这些数据,所以会造成带宽的浪费。Web Storage 提供了两个存储对象:localStorage 和 sessionStorage。sessionStorage 存储的数据仅在本次会话有用,会话结束后会转载 2017-10-10 09:54:19 · 236 阅读 · 0 评论 -
《深入理解ES6》阅读笔记 --- Promise与异步编程
在异步编程概念已经普及的今天,我们依然要谈一谈它,对于我们做前端代码的意义。当你通过Ajax请求数据使用回调函数来获取数据时,这就是一种异步编程。转载 2017-10-10 10:33:21 · 500 阅读 · 0 评论 -
JS中的算法与数据结构——集合(Set)
愉快的假期告一段落,继续我们的学习~集合(Set)同数学中所学的一样,集合(Set)是由一组无序但彼此之间又有一定关系性的成员构成,每个成员在集合中只能出现一次,不同于我们之前说的字典,链表之类的,它是一种包含了不同元素的数据结构(集合中的元素称为成员),从其定义中我们可以看出它具有两个很重要的特征:首先,集合中的成员是无序的,其次,集合中的成员是不相同的,即集合中不存在相同的成员。实转载 2017-10-10 10:41:22 · 298 阅读 · 0 评论 -
ES6必知必会 —— Symbol、Set和Map
Symbol1.Symbol 是 ES6 引入了一种新的原始数据类型,表示独一无二的值。它是 JavaScript 语言的第七种数据类型,前六种分别是:undefined、null、布尔值(Boolean)、字符串(String)、数值(Number)、对象(Object);2.Symbol 值通过Symbol函数生成,可以作为对象的属性名使用,保证不会与其他属性名产生冲突;let s转载 2017-10-10 10:44:33 · 343 阅读 · 0 评论 -
webpack的优化方案
前言在前端应用的优化中,对加载资源的大小控制极其的重要,大多数时候我们能做的是在打包编译的过程对资源进行大小控制、拆分与复用。本片文章中主要是基于 webpack 打包,以 React、vue 等生态开发的单页面应用来举例说明如何从 webpack 打包的层面去处理资源以及缓存,其中主要我们需要做的是对 webpack 进行配置的优化,同时涉及少量的业务代码的更改。同时对打包资源的分析转载 2017-10-19 08:52:31 · 960 阅读 · 0 评论 -
详解 CORS 跨域资源共享
CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origin resource sharing)。它允许浏览器向跨源服务器,发出XMLHttpRequest请求,从而克服了AJAX只能同源使用的限制。本文详细介绍CORS的内部机制。一、简介CORS需要浏览器和服务器同时支持。目前,所有浏览器都支持该功能,IE浏览器不能低于IE10。整个CORS转载 2017-10-11 09:14:06 · 235 阅读 · 0 评论 -
IE input file隐藏不能上传文件解决方法
又是IE的一个问题,近来是跟IE浏览器磕上了,这个问题发现不少人也遇到过,实在蛋疼。但今天这个不能算是一个bug,因为IE可能是从安全角度上考虑结果导致的。一步步来解读。普通上传例子首先普通的文件上传呢,很简单,前端代码:12345678910111213转载 2017-10-17 08:58:20 · 718 阅读 · 0 评论