20181103 前端开发周报

Vue.js 父子组件通信的十种方式;前端 AI 实战:告诉世界前端也能做 AI;你可能不知道的14个JavaScript调试技巧;css grid布局入门;JavaScript实现函数重载;一些使 JavaScript 更加简洁的小技巧;Vue 2.0学习笔记:如何创建Vue插件;『前端干货篇』: 你不知道的Event Loop

  1. Vue.js 父子组件通信的十种方式 面试官:Vue 中父子组件通信有哪些方式? 自己先想一分钟。 无可否认,现在无论大厂还是小厂都已经用上了 Vue.js 框架,简单易上手不说,教程详尽,社区活跃,第三方套件还多。真的是前端开发人员必备技能。而且在面试当中也往往会问到关于 Vue 方面的各种问
  2. 前端 AI 实战:告诉世界前端也能做 AI 本文作者:IMWeb jerryOnlyZRJ 原文出处:IMWeb社区 未经同意,禁止转载 我想大多数人和我一样,第一次听见“人工智能”这个词的时候都会觉得是一个很高大上、遥不可及的概念,特别像我这样一个平凡的前端,和大部分人一样,都觉得人工智能其实离我们很遥远,我们对它的印象总是停留在各种各样神奇而又…
  3. 你可能不知道的14个JavaScript调试技巧了解你的工具可以在完成任务的过程中发挥重大作用。尽管传言 JavaScript 难以调试,但是如果你掌握了一些调试技巧,那么你将会花费更少的时间来解决这些错误。
  4. css grid布局入门CSS网格布局(又称“网格”),是一种二维网格布局系统。CSS在处理网页布局方面一直做的不是很好。一开始我们用的是table(表格)布局,然后用float(浮动),position(定位)和inline-block(行内块)布局,但是这…
  5. JavaScript实现函数重载 重载是指函数或者方法有相同的名称,但是参数个数或类型不相同的情形,这样的同名不同参的函数或者方法之间,互相称之为重载函数或方法。 我们知道,JavaScript函数可以随意传递任意数量、任意类型的参数,那么它有没有重载呢? 答案是有的,下面我们通过3种方法来实现JavaScript的函数重载。 实现 0. 目标 …
  6. 一些使 JavaScript 更加简洁的小技巧 小编推荐:掘金是一个面向程序员的高质量技术社区,从 一线大厂经验分享到前端开发最佳实践,无论是入门还是进阶,来掘金你不会错过前端开发的任何一个技术干货。 推荐9个使 JavaScript 代码变得更加简洁的小技巧,大概5分钟就能掌握。
  7. Vue 2.0学习笔记:如何创建Vue插件 Vue插件是向应用程序添加全局特性的一种强大而又简单的方法。它有多种用途,从分发应用程序范围的组件到向应用程序添加路由和不可变数据存储等附加功能。从概念上讲,Vue插件是非常简单。它实际上只是一个带有 install 函数的对象,它接受两个参数: 全局的 Vue 对象 和 一个包含用户定义选项的对象 。然而,一个像这…
  8. 『前端干货篇』: 你不知道的Event Loop 一星期的满课,身心疲惫(×_×)…周末闲下来,仔细研究了下JS的事件轮询机制,看了看阮一峰大大的相关文章,真的收货挺多。 从一道面试题说起 setTimeout(function() { console.log(111); }, 0); // 这里
  9. 前端必会的 Nginx入门视频教程(共11集) 由于前端技术的蓬勃发展和你自身的不断努力,很多小伙伴已经打通了任督二脉,做到了前后端通吃。你们就是自己程序世界里的神,在这里你们无所不能,创造世界,制定规则和逻辑。当一个属于你的世界做好后,你需要展示给朋友,发布于众人,让爱你的人欣赏。这时候我们需要一个强有力
  10. 作为前端,你需要了解的开源协议知识 作者 百度外卖—王琬璐 @meiyu 百度外卖—游茹玉 @ryyou 转载请标明出处 作为前端工程师,开发中在所难免会用到一些开源框架,而每个框架都有自己的开源协议,每个开源协议之间有什么差别呢? 如果你要开源一个项目,又应该选择哪种开源协议呢?
  11. 手把手教你使用nodejs编写cli(命令行) 前端日常开发中,会遇见各种各样的cli,比如一行命令帮你打包的webpack,一行命令帮你生成vue项目模板的vue-cli,还有创建react项目的create-react-app等等等等。这些工具极大地方便了我们的日常工作,让计算机自己去干繁琐的工作,而我
  12. 【ES6】迭代器与可迭代对象ES6 新的数组方法、集合、for-of 循环、展开运算符(…)甚至异步编程都依赖于迭代器(Iterator )实现。本文会详解 ES6 的迭代器与生成器,并进一步挖掘可迭代对象的内部原理与使用方法
  13. webpack4.x最详细入门讲解 前言 本文主要从webpack4.x入手,会对平时常用的Webpack配置一一讲解,各个功能点都有对应的详细例子,所以本文也比较长,但如果你能动手跟着本文中的例子完整写一次,相信你会觉得Webpack也不过如此。   一、什么是webpack,为什么
  14. 「前端那些事儿」③ CSS 布局方案 我们在日常开发中经常遇到布局问题,下面罗列几种常用的css布局方案 话不多说,上代码! 居中布局 以下居中布局均以不定宽为前提,定宽情况包含其中 1、水平居中 a) inline-block + text-align .parent{ text
  15. 在 React 和 Vue 中尝鲜 Hooks 在美国当地时间 10 月 26 日举办的 React Conf 2018 上,React 官方宣布 React v16.7.0-alpha 将引入名为 Hooks 的新特性,在开发社区引发震动。 而就在同月 28 日左右,作为 “摸着鹰酱过河” 优秀而典型代表的 Vue.js 社区,其创始人 Evan You 就在自己的 github 上发布了 vue-hooks 工具库,其简介…
  16. 利用webpack4搭建vue服务器端渲染SSR(一) 为什么使用服务器渲染? :point_right:官方解释 应该对VueSSR指南简单了解:point_right:官方文档 应该对webpack简单了解:point_right:官方文档 Node.js框架Koa简单了解:point_right:官方文档 正文 构建服务器端渲染(SSR)我们可以利用 vue-server-renderer 插件更简单的构建SSR。官方的一段代码:…
  17. 工作流程以及webpack配置一些优化前端工程化这些事情现在已经算是深入人心了,即便不清楚具体含义vue-cli creat-react-app之类的脚手架也帮助大家快速开发了不少项目。
  18. 高级 Vue 组件模式 (8)在第七篇文章中,我们对 toggle 组件进行了重构,使父组件能够传入开关状态的初始值,同时还可以传入自定义的状态重置逻辑。虽然父组件拥有了改变 toggle 组件内部状态的途径,但是如果进一步思考的话,父组件并…
  19. 高级 Vue 组件模式 (9)到此为止,我们的 toggle 组件已经足够强大以及好用了,因此这篇文章不会再为它增加新的特性。如果你是从第一篇文章一直读到这里的读者,你一定会发现,整篇文章中,我几乎没有对 toggle-on 和 toggle-off 做出任…
  20. 我理解的HTTP】作为一个前端,如果对一个网页从发起请求到返回数据这期间具体发生了什么都不知道的话,那不是一个好前端。详见 (来自:柠檬) ​​​​

    我理解的HTTP
  21. 如何创建高质量的TypeScript声明文件(二) 继续上篇文章 模块化库 有些库只能在模块加载器环境中工作。 例如,因为express仅适用于Node.js,必须使用CommonJS require函数加载。 ECMAScript 2015(也称为ES2015,ECMAScript 6和ES6),CommonJS和RequireJS具有类似的导入模块的概念。 例如,在JavaScript C…
  22. Vue 页面状态保持页面间数据传输的一种方法 如果大家觉得有用,更多的模块请点击查看 vue router给我们提供了两种页面间传递参数的方式: 动态路由匹配 编程式的导航 // 命名的路由 router.push({ name: 'user', params: { userId: 123 }})
  23. 原生JavaScript之完美运动框架 在这里呢,我们先来说下关于完美运动框架的封装思路。 想让一个物体运动呢,我们必须给那个物体加上定位属性;其次想让一个物体自动运动的话必须用到定时器;知道了这个后,基本上就差不多做完了(哈哈,给你个小安慰)! 首先在封装框架之前我们得封装一下获取非行间样
  24. 通过 Lighthouse 了解 JavaScript 性能 不确定JavaScript 的开销对于您那的用户体验来讲是不是太高了? Lighthouse 有 JavaScript 执行时间审计 ,用来衡量 JavaScript 对于页面加载性能的影响。 让我们一起试试吧?现在它已经在 Chrome DevToolsAudits面板里边了。同样可以通过访问WebPageTest 来使用。 对于上面的内容站点,移动设…
  25. JavaScript万物产生顺序 我们在很多地方可能都有听说过一种说法——JavaScript 万物皆对象。虽然这种说法不是特别准确,因为我们知道 undefined 就不是个对象,但不可否认的是 JavaScript 中大部分数据都是对象,那么问题来了,对象产生的先后顺序是什么呢?对于 Ob
  26. css外边距折叠(margin collapsing)看这个例子中的两个p标签,根据样式定义:第一个p的margin-bottom和第二个p的margin-top 都是10px,那实际距离应该等于20px才对,但是用浏览器查看一下可以发现,最终的边距是10px。 这个例子就是外边距折叠:块…
  27. Vue with TypeScript 最近尝试了一下 TypeScript,试着把一个 Vue 项目改成了 TypeScript 的,感觉还不错。 目前 Vue 和 TypeScript 的配合还不算很完美,Vuex 和 TypeScript 的配合挺糟糕的,尝试需要谨慎,如果想体验一下的话,强烈
  28. React 将引入 Hooks,你怎么看? 译者|姚佳灵、无明整理|覃云 今天,在 2018 ReactConf 大会上,React 官方宣布 React v16.7.0-alpha 将引入 Hooks,乍一看,你可能在想 Hooks 是什么?有什么用?且看下文分析。 Hooks 是什么? Hooks 是一种函数,该函数允许你“勾住(hook into)”React 状态和来自函数组件的生命周期功能。Hook 在…
  29. JavaScript之例题中彻底理解this 本文共 2025 字,看完只需 8 分钟 概述 前面的文章讲解了 JavaScript 中的执行上下文,作用域,变量对象,this 的相关原理,但是我后来在网上看到一些例题的时候,依然没能全做对,说明自己有些细节还没能掌握,本文就结合例题进行深入实践,讨

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

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


关注我

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

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

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