20190710 前端开发日报

JavaScript 中的对象(二)- 继承与多态;2019 年的 JavaScript 性能;深入浅出Vue响应式原理;微前端详解;Vue 实现前端权限控制;前端视频控件使用文档;学会 NodeJS 服务器性能优化;JavaScript 编程精解 中文第三版 二十、Node.js

  1. JavaScript 中的对象(二)- 继承与多态 原型链 你如果熟悉一般静态语言的继承模式,比如 Java、C++,你会发现这些语言的继承其实在代码实现上面都是通过类来进行的,但是问题就是 JavaScript,具体说是在 ES5 以及之前的版本是没有类这个概念的,那么继承如何进行呢?在 JavaScript 的对象创建中,我们知道每个对象都有一个 prototype,也就是它的原型,原…
  2. 2019 年的 JavaScript 性能 本文翻译自 V8 官方博客的这篇《The Cost Of JavaScript in 2019》,原文作者:Addy Osmani (@addyosmani )。 建议阅读本文前先读完这篇文章: 使用Script-Streaming提升页面加载性能 首发于猫眼前端团队公众号:MY-FEE 过去几年中,JavaScript 性能的大幅改进很大程度上依赖于浏览器解析和编译 JavaScript 的速…
  3. 深入浅出Vue响应式原理Vue 最独特的特性之一,是其非侵入性的响应式系统。数据模型仅仅是普通的 JavaScript 对象。而当你修改它们时,视图会进行更新。这使得状态管理非常简单直接,不过理解其工作原理同样重要,这样你可以避开一些常…
  4. 微前端详解 最近接触了一些DevOps、微服务等概念,想要找一篇文章大致了解一下,看到个微前端标题比较新颖于是选择翻译这篇文章。原文https://martinfowler.com/articles/micro-frontends.html 近年来,微服务已经爆红,许多组织使用这种架构来避免大型、单一后端的限制。虽然已经有很多关于这种构建服务器端软件的风格的文章,但…
  5. Vue 实现前端权限控制 登录访问权限控制是对用户的校验。在用户登录成功之后,后台将返回一个token,之后前端每次进行接口请求的时候,都要带上这个token。后台拿到这个token后进行判断,如果此token确实存在并且没有过期,则可以通过访问。如果token不存在或后台判断已过期,则会跳转到登录页面,要求用户重新登录获取token。 做法一 …
  6. 前端视频控件使用文档该项视频控件是npm库中的一个控件,该控件的源地址为:[链接] 。由于此款控件使用起来较为简单,且没有过多复杂按钮,只能实时播放摄像头画面,适合项目要求,因此选定该款控件作为视频播放控件。
  7. 学会 NodeJS 服务器性能优化 ‍‍‍‍点击上方“独立开发者周刊” ‍喜欢本文,请置顶或星标 ‍‍‍ ‍ ‍ 前言 ‍‍‍‍‍‍‍‍‍如果你是一个NodeJS服务器开发工程师,肯定面临过一个问题:如何优化NodeJS服务器的性能。这个问题其实涉及到的内容是非常广的,优化方法也是多种多样的,如果初涉这个领域很有可…
  8. JavaScript 编程精解 中文第三版 二十、Node.js 来源: ApacheCN『JavaScript 编程精解 中文第三版』翻译项目 原文:Node.js 译者: 飞龙 协议:CC BY-NC-SA 4.0 自豪地采用谷歌翻译 部分参考了 《JavaScript 编程精解(第 2 版)》 A student asked ‘The programmers of old used only simple machines and no programming languages, yet the…
  9. JavaScript 编程精解 中文第三版 十九、项目:像素艺术编辑器 我看着眼前的许多颜色。 我看着我的空白画布。 然后,我尝试使用颜色,就像形成诗歌的词语,就像塑造音乐的音符。 Joan Miro 前面几章的内容为你提供了构建基本的 Web 应用所需的所有元素。 在本章中,我们将实现一个。 我们的应用将是像素绘图程序,你可以通过操纵放大视图(正方形彩色网格),来逐像…
  10. 【JavaScript系列】javascript正则表达式学习(二)– 位置匹配 ^(脱字符)匹配开头,在多行匹配中匹配行开头。 $(美元符)匹配结尾,在多行匹配中匹配行结尾。 比如:我们把字符串的开头和结尾用#替换(位置可以替换成字符的): var result = "hello".replace(/^|$/g, ‘#’); console.log(result); // "#hello#" 复制代码 多行匹配模式(有修饰符m)时,…
  11. nodejs使用aes-128-ecb加密如何在c#中解密却发现C#端怎么也解密不了,一直报错,改了一整天,后来终于发现,nodejs端加密用的key其实在使用之前已经使用md5加密了一次,服务端如果需要使用这个key解密,则需要也同样使用MD5加密
  12. 【javascript系列】Object.assign实现浅拷贝的原理以及实现 之前在前面一篇学习了赋值,浅拷贝和深拷贝。介绍了这三者的相关知识和区别。 传送门: www.mwcxs.top/page/592.ht… 本文会介绍浅拷贝Object.assign()的实现原理,然后咱们试着实现一个浅拷贝。 二、浅拷贝Object.assign() 什么是浅拷贝?浅拷贝就是创建一个新对象,这个对象有着原始对象属性值的一份精确拷贝。…
  13. 基于Media Recorder实现js获取摄像头录像数据 通过js截取摄像头图片的功能已经实现了,那么如果我要实时获取录像流或者录像的功能呢? 此篇是基于MediaRecorder API去获取录音数据的,紧接着 js实现网页摄像头截图功能 。 MediaRecorder 用法 var mediaRecorder = new MediaRecorder(stream ); 参数 stream getUserMedia()回调参数或aud…
  14. JavaScript基础专题之创建对象几种方式及优缺点(九) 根据《JavaScript高级程序设计》(红宝书)来总结一下创建对象的几种方式及优缺点 1. 工厂模式 function createPerson(name) { var o = new Object(); o.name = name; o.getName = function () { console.log(this.name); }; return o; } var person1 = createPerson(‘chris’); 复制…
  15. 基于Vue实现后台系统权限控制需求分析 基础需求 项目的基础需求是: 系统管理员拥有最大权限,管理所有企业; 企业管理员拥有该企业所有权限,可下放权限给子账户; 子账户拥有限制权限,且可被随时更改。 根据权限列表展示隐藏相对应菜单栏…
  16. JavaScript中的颜色空间转换我在做 webapp 的顶部导航栏时,碰到了一个挑战,导航栏的字体与图标要根据背景的颜色深浅来显示不同白色和黑色,但是导航栏的颜色是支持多种配色的,我不可能根据每一个配色去定义这个颜色的深浅,于是我开始研…
  17. Vue 项目功能实现:router 传递参数并解决刷新页面参数丢失问题url:[链接]:8081/#/paramsPassingByRouter/paramsMode 页面显示:{“id”:”20180101″,”name”:”张三”,”aka”:”z3″,”age”:”18″}
  18. 深入理解 Kubernetes Admission Webhook 准入控制器 admission webhook 是什么? 创建配置一个 Admission Webhook 先决条件 编写 webhook 构建 部署服务 配置 webhook 测试 …
  19. 进阶篇(一)JS如何实现函数缓存 1.先来了解一下什么是缓存? 所谓函数缓存,就是将函数运算过的结果缓存起来,这种做法是典型的用内存去换取性能的手段,常用于缓存数据计算结果和缓存对象。缓存只是一个临时的数据存储,它保存数据,以便将来对该数据的请求能够更快地得到处理 2.为什么需要做函数缓存? 在前端页面中,有些数据(比如数据字典中的…
  20. 使用 VuePress 生成静态文档 VuePress 由两部分组成:一部分是支持用 Vue 开发主题的极简静态网站生成器,另一个部分是为书写技术文档而优化的默认主题。它的诞生初衷是为了支持 Vue 及其子项目的文档需求。 每一个由 VuePress 生成的页面都带有预渲染好的 HTML,也因此具有非常好的加载性能和搜索引擎优化(SEO)。同时,一旦页面被加载,Vue 将接…
  21. JavaScript 编程精解 中文第三版 二十一、项目:技能分享网站 If you have knowledge, let others light their candles at it. Margaret Fuller 技能分享会是一个活动,其中兴趣相同的人聚在一起,针对他们所知的事情进行小型非正式的展示。在园艺技能分享会上,可以解释如何耕作芹菜。如果在编程技能分享小组中,你可以顺便给每个人讲讲 Node.js。 在计算机领域中,…
  22. 用Vue写几个小游戏玩玩 前言 作为一名Vue的初级爱好者,表示Vue在手,天下我有(手动滑稽)。 介绍 Github: github.com/ordinaryA/A… 在线Demo 扫雷 :在线试玩 管道小鸟 :在线试玩 贪吃蛇 :在线试玩 扫雷 思路 棋盘的每个格子分为三种类型的其中一种: 雷:emmm 就是一颗雷 数字:…
  23. HTML5 之跨域通讯(postMessage) 很多情况下,我们受到浏览器的安全策略限制。如何能规避此限制,并且能安全的使用跨域通讯,这就不得不介绍一下 postMessage 了。 一、关于 postMessage window.postMessage() 方法可以安全地实现跨源通信。 通常,对于两个不同页面的脚本,只有当执行它们的页面位于具有相同的协议(通常为 https ),端口号(…
  24. 深入剖析Vue源码 – 响应式系统构建(中) 为了深入介绍响应式系统的内部实现原理,我们花了一整节的篇幅介绍了数据(包括 data, computed,props )如何初始化成为响应式对象的过程。有了响应式数据对象的知识,上一节的后半部分在保留源码结构的基础上还构建了一个以 data 为数据的响应式系统,为这一节的深入响应式系统细节分析埋下伏笔。由于内容过多,将分为…

关注github前端日报 订阅精彩文章

前端日报栏目数据来自码农头条,每日分享互联网上热门的前端开发、移动开发、设计、资源和资讯等,为开发者提供动力,如果觉得内容对你有用,记得分享给你的小伙伴。进入码农头条查看更多


关注我

我的微信公众号:前端开发博客,在后台回复以下关键字可以获取资源。

  • 回复「小抄」,领取Vue、JavaScript 和 WebComponent 小抄 PDF
  • 回复「Vue脑图」获取 Vue 相关脑图
  • 回复「思维图」获取 JavaScript 相关思维图
  • 回复「简历」获取简历制作建议
  • 回复「简历模板」获取精选的简历模板
  • 回复「加群」进入500人前端精英群
  • 回复「电子书」下载我整理的大量前端资源,含面试、Vue实战项目、CSS和JavaScript电子书等。
  • 回复「知识点」下载高清JavaScript知识点图谱

每日分享有用的前端开发知识,加我微信:caibaojian89 交流