20190531 前端开发日报

javaScript 常用 API 实例讲解;Vuex概念浓缩版记录;9102了,快来了解webpack4;React 项目结构和组件命名规范;【前端面试分享】- 寒冬求职下篇;JavaScript(ES6)知识点备忘;什么是 `this`?JavaScript 对象的内部工作原理;浅解Promise

  1. javaScript 常用 API 实例讲解 new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例 this this 用法实例讲解 当构造函数没有返回值时: function Animal (name, age) { this.name = name; this.age = age; this.speak = ‘汪汪’ } Animal.prototype.color = ‘red’; Animal.prototype.say = function …
  2. Vuex概念浓缩版记录 读取store的字段值,通过this.$store.state访问 const Counter = { template: `<div>{{ count }}</div>`, computed: { count () { return this.$store.state.count } } } 复制代码 mapState 辅助函数 当一个组件需要获取多个状态时候,将这些状态都声明为计算属性会有些重复和冗…
  3. 9102了,快来了解webpack4 在当今的前端开发中,我们使用的打包工具可能会有很多种,当然webpack就是其中一种,那么webpack中的配置实际上是很多的,所以今天来整理下常用的配置以及它的作用。 如何开始 我们创建一个空的文件夹,然后使用 npm init webpack-demo ,下面一路回车,然后他会在我们的文件夹下创建一个 package.json 这样的…
  4. React 项目结构和组件命名规范React 作为一个库,它没有规定项目的整体结构。这很好,因为它给了我们自由去尝试不同的方法,并适应更适合我们的方式。另一方面,这可能会给React领域的开发人员带来一些困惑。
  5. 【前端面试分享】- 寒冬求职下篇 越来越多的公司都在面试前加入了笔试环节。 有的甚至会根据你的笔试答题情况来决定是否进入面试环节。 当然,进入面试环节,也会时不时的出几道算法或者其他类型的相关的题目让你写出来。 所以不仅要会说,还要会写。 关于手写面试题的文章也有好多,实现 call,apply,bind 之类的,也都最好要掌握。 总结了一…
  6. JavaScript(ES6)知识点备忘 JavaScript的知识点备忘 Object.values/Object.keys/Object.entries() Object.keys:对Object中的索引进行循环 Object.values:对Object中的值进行循环 Object.entries:对Object中的每个项进行循环 Array map() map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。 const n…
  7. 什么是 `this`?JavaScript 对象的内部工作原理 JavaScript 是一种支持面向对象编程和动态绑定的多范型语言。动态绑定是一个强大的概念,它允许 JavaScript 代码的结构在运行时改变,但是这种额外的功能和灵活性是以一些混乱为代价的,并且很多混乱主要集中在 JavaScript 的行为方式上。 动态绑定 动态绑定指的是在运行时而不是编译时,确定要调用的方法的过程。J…
  8. 浅解Promise 对于异步的解决方案 Promise Promise是ES6新增的内置对象,通常使用Promise构造函数创建,Promise实例,解决异步问题。 1.Promise构造函数 必须 接收一个函数作为参数,我将其称为 executor 函数,executor函数也可以接收两个参数,resolve和reject, 它们是两个函数 , 由ECMAScript运…
  9. HTML5的5种存储方式详解 引言 本篇文章主要介绍了前端HTML5几种存储方式的总结 ,主要包括本地存储localstorage,本地存储sessionstorage,离线缓存(application cache),Web SQL,IndexedDB。有兴趣的可以了解一下。 正文开始~ 总体情况 h5之前,存储主要是用cookies。cookies缺点有在请求头上带着数据,大小是4k之内。主Domain污…
  10. Web Template Studio 发布在 VS Code 中轻松创建 Web 应用 作为一个 Web 应用开发者,Scaffolding Tool(脚手架工具)一定是在创建项目时的重要工具。许多开发者会习惯于使用基于 CLI 的脚手架工具来创建 Web 应用,也有许多开发者喜欢使用类似于 VS IDE 的基于 UI 的 Wizard 向导。 近期(2019 年 5 月 15 日),微软发布了 Web Template Studio for VS Code,使得开发者…
  11. React Hooks 教程 原文地址: https://medium.com/@dtkatz/react-hooks-tutorial-learn-by-building-b90ec4db2b8e 原文作者: David Katz Hooks Hooks 是 React 即将推出的一个新功能。这一更新在 React 社区引起了巨大的反响。 简而言之,现在可以在 React 函数组件中使用 state 和其他 React 特性。因此没…
  12. 【第一篇】基于 @vue/cli3 与 koa 创建 ssr 工程 首先,我们需要先明白什么是 spa (single page application),以及基于 vue 的 spa 是如何工作的,这里不展开,请参考:单页应用、 vue 实例 基于同构代码的 SSR 指的是同一份代码(spa代码),既能在客户端运行,并渲染出页面,也可以在服务器端渲染为 html 字符串,并响应给客户端。 它与传统的服务器直出不同…
  13. Express.js 解析 Post 数据类型的正确姿势 一、概念介绍 1、POST请求:HTTP/1.1 协议规定的 HTTP 请求方法有 OPTIONS、GET、HEAD、POST、PUT、DELETE、TRACE、CONNECT 这几种。其中 POST 一般用来向服务端提交数据。 2、 Content-Type : 是指 http/https 发送信息至服务器时的内容编码类型, Content-Type 用于表明发送数据流的类型,服务器根据编码类…
  14. 从原型聊到原型继承,深入理解 JavaScript 面向对象精髓 开头说点题外话,什么时候开始,我发现在 JavaScript 中,大家都喜欢用 foo 和 bar 来用作示例变量名,为此专门查了一下这家伙的来源: “The etymology of foo is obscure. Its use in connection with bar is generally traced to the World War II military slang FUBAR, later bowdlerised to foobar. … The use…
  15. 使用 TypeScript 和依赖注入实现一个聊天机器人类型和可测试代码是避免错误的两种最有效方法,尤其是代码随会时间而变化。我们可以分别通过利用 TypeScript 和依赖注入(DI)将这两种技术应用于JavaScript开发。
  16. nodejs + websocket (socket.io)初次接触 WebSocket 的人,都会问同样的问题:我们已经有了 HTTP 协议,为什么还需要另一个协议?它能带来什么好处?答案很简单,因为 HTTP 协议有一个缺陷:通信只能由客户端发起。 举例来说:我们想了解今天的…
  17. JS设计模式学习_基础篇当然我们可以用一个通俗的说法:设计模式是解决某个特定场景下对某种问题的解决方案。因此,当我们遇到合适的场景时,我们可能会条件反射一样自然而然想到符合这种场景的设计模式。
  18. 环境变量的使用于 npm script 说到变量本章主要涉及 预定义变量和自定义变量 ,那么使用变量有哪些好处对于我们编程?这也是本章所要重点表达的,使用变量可直接把积累起来的 npm script 使用到其他项目中,无需任何修改。是不是想到了 DRY(Dot’t Repeat)编程原则了。 预定义变量 npm run env npm run env | grep npm_package | sort 完整…
  19. 深入剖析Vue源码 – 组件基础 组件是Vue的一个重要核心,我们在进行项目工程化时,会将页面的结构组件化,组件化意味着独立和共享。编写Vue组件是掌握Vue开发的核心基础,Vue官网也花了大篇幅介绍了组件的知识,并且也深入讲解了Vue的使用。这一节内容,我们将深入Vue组件部分的源码,了解组件注册的实现思路和组件渲染挂载的基本流程。这将让我们今…
  20. 面试必备webpack 中那些最易混淆的 5 个知识点前两天为了优化公司的代码打包项目,恶补了很多 webpack4 的知识。要是放在几年前让我学习 webpack 我肯定是拒绝的,之前看过 webpack 的旧文档,比我们内部项目的文档还要简陋。
  21. 从今天开始,学习Webpack,减少对脚手架的依赖(下) 问:这篇文章适合哪些人? 答:适合没接触过Webpack或者了解不全面的人。 问:这篇文章的目录怎么安排的? 答:先介绍背景,由背景引入Webpack的概念,进一步介绍Webpack基础、核心和一些常用配置案例、优化手段,Webpack的plugin和loader确实非常多,短短2w多字还只是覆盖其中一小部分。 问:这篇文章的出处? …
  22. 基于 TypeScript 开发 NPM 模块 初始化 NPM 项目 mkdir project-name cd project-name npm init 添加开发基础包 添加 TypeScript yarn add typescript -D 添加 Jest 测试工具 yarn add jest ts-jest @types/jest -D 添加 @types/node yarn add @types/node -D 初始化 TypeScript 配置 ./node_modules/.bin/tsc –init 这…
  23. 编写优雅的JavaScript代码 – 最佳实践
  24. 技术地图 – vue-cli 这是一个新开的’实验性’文章系列,如其名‘技术地图’,这个系列计划剖析一些前端开源项目,可能会探讨这些项目的 设计和组织 、整理他们使用到 技术栈 。 首先拿 vue-cli 小试牛刀,再决定后续要不要继续这个系列. 我一直在思考我们编程主要在做什么?我们有一大部分工作就是选择各种工具/库/框架,来黏合业务. 工具…
  25. 使用 apiDoc 为你的Node.js API 自动生成文档[每日前端夜话0x78] 每日前端夜话 0x78 每日前端夜话,陪你聊前端。 每天晚上18:00准时推送。 正文共:1511 字 预计阅读时间: 5 分钟 翻译:疯狂的技术宅 来源: jonathas 当你为其他开发人员(前端,桌面,移动等)开发 API 时,需要生成一份风格良好的文档,以便他们知道可以使用的内容和方式,这…
  26. 从今天开始,拿起 TypeScript 做一个轮子的制造者 前言 前端这些年发展非常迅速,社区里涌现了一堆优秀的轮子,比如Vue、React、Angular、jQuery、axios 等,它们解决着不同领域下的问题。使用这些轮子能极大地帮助我们提升生产力,有些人甚至基于这些轮子二次开发了一些轮子,比如 element-ui、ant-design 等组件库。我们在享受这些轮子给我们带来的便利的时候,…

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

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


关注我

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

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

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