20190419 前端开发日报

深入理解javascript事件机制;Vue学习笔记(一)——脚手架vue cli;高仿网易云音乐 Vue前端项目;Vue中的scoped及穿透方法;11个教程中不常被提及的JavaScript小技巧;前端面试必问题答疑(1);记一次 Vue 移动端活动倒计时优化;从JSCore了解Hybrid开发

  1. 深入理解javascript事件机制 Created By JishuBao on 2019-04-17 12:38:22 Recently revised in 2019-04-17 17:38:22 欢迎大家来到技术宝的掘金世界,您的star是我写文章最大的动力! GitHub地址 不知道各位小伙伴在平时撸码中会不会经常看到诸如 event.preventDefault()、event.stopPropagation() ...
  2. Vue学习笔记(一)------脚手架vue cli cli(@vue/cli) cli服务(@vue/cli-service) cli插件 CLI ( @vue/cli ) 是一个全局安装的 npm 包,提供了终端里的 vue 命令,这些命令都是在全局安装之后才可以使用的,例如:使用 vue serve 启动项目需要在npm install -g @vue/cli-service-global之后才可以。 vue create 创建一个vue项目 vue...
  3. 高仿网易云音乐 Vue前端项目 歌曲播放界面支持播放进度同步、收藏或取消收藏当前歌曲 banner、排行榜左边的三个按钮点击没有效果( ´▽`) ,没时间写那些啦... 实现了登录功能 登录后展示头像和昵称,且可进入个人中心即“我的”页面,可查看...
  4. Vue中的scoped及穿透方法 css一直有个令人困扰的作用域问题:即使是模块化编程下,在对应的模块的js中import css进来,这个css仍然是全局的。为了避免css样式之间的污染,vue中引入了scoped这个概念。 在vue文件中的style标签上,有一个特殊的属性:scoped。当一个style标签拥有scoped属性时,它的CSS样式就只能作用于当前的组件。通过设置该属...
  5. 11个教程中不常被提及的JavaScript小技巧这次我们主要来分享11个在日常教程中不常被提及的JavaScript小技巧,他们往往在我们的日常工作中经常出现,但是我们又很容易忽略。
  6. 前端面试必问题答疑(1)一,前端性能优化有哪些? {代码...} {代码...} 二,关于原型链
  7. 记一次 Vue 移动端活动倒计时优化 通常写倒计时效果,用的是 setInterval,但这会引发一些问题,最常见的问题就是定时器不准。 如果只是普通的动画效果,倒也无所谓,但倒计时这种需要精确到毫秒级别的,就不行了,否则活动都结束了,用户的界面上倒计时还在走,但是又参加不了活动,会被投诉的╮(╯▽╰)╭ 一、 知识铺垫 1. setInterval 定时器 先说...
  8. 从JSCore了解Hybrid开发 最近因为工作的原因,越来越多的动态化开发模式开始在项目中实施。为了对Hybrid的开发有一个深入的了解,查阅了相关的博客和官方文档之后,决定把学到的东西在这里做一个总结,方便日后查阅。好了,废话不多说,要研究Hybrid开发,其中必不可少的是要去了解 JavaScriptCore (以下简称 JSCore )。那么我们就先从 JSCore ...
  9. JS中的原型与原型链 JS中的原型可以类比于Java中的父类。 在Java中实现继承有接口继承与实现继承两种方式,接口继承只继承方法签名,而实现继承则继承实际的方法。 由于JS中的函数没有签名,在 ECMAScript 无法实现接口继承, ECMAScript 只支持实现继承,而其实现继承的主要依靠原型与原型链来实现的。 原型模式 我们创建的每个...
  10. Vue自定义全局Toast和Loading如果我们的Vue项目中没有用到任何UI框架的话,为了更好的用户体验,肯定会用到loading和toast。那么我们就自定义这两个组件吧。
  11. Vue SSR 踩坑之旅 前言 本文并不是 Vue SSR 的入门指南,没有一步步介绍 Vue SSR 入门,如果你想要 Vue SSR 入门教程,建议阅读 Vue 官网的《 Vue SSR 指南》,那应该是最详细的 Vue SSR 入门教程了。这篇文章的意义是,主要介绍如何在 SSR 服务端渲染中使用最受欢迎的 vue ui 库 element-ui...
  12. 【核心模块】node.js node环境中,全局对象为global;浏览器环境中,全局对象时window 所有全局变量均挂载在全局对象上,作为全局对象的属性,其中包含: 显式定义全局对象的属性 隐式定义的变量(没有定义直接赋值的变量) 这里建议使用 var、let、const 定义变量以避免引入全局变量,因为全局变量会污染 命名空间,...
  13. 关于程序员写好 ppt 的几点总结 - 前端张大胖近一年我做了几次 ppt,刚开始写 ppt 简直不要太痛苦,真的不如写代码来的简单,每晚熬到深夜但也是收效甚微。
  14. 你真的理解JS的继承了吗? 噫吁嚱,js之难,难于上青天 在原型链和继承上花了不知道多少时间,当每次自以为已经吃透的时候,总是会出现各种难以理解的幺蛾子。也许就像kyle大佬说的那样,js的继承模式真的是‘蠢弟弟’设计吧。 请先看下图,如果各位觉得soeasy,那各位也许不需要往下看了。(图片忘了从那篇文章摘下来的,请多见谅) ...
  15. webpack配置笔记 npm install -g webpack@3.5.3 // my-demo npm init npm install --save-dev webpack@3.5.3 复制代码 在根目录下创建两个文件夹 public app 创建三个文件 index.html --放在public文件夹中 Greeter.js-- 放在app文件夹中 main.js-- 放在app文件夹中 在index.html文件中写入最基础...
  16. Javascript的对象拷贝在开始之前,我先普及一些基础知识。Javascript 的对象只是指向内存中某个位置的指针。这些指针是可变的,也就是说,它们可以重新被赋值。所以仅仅复制这个指针,其结果是有两个指针指向内存中的同一个地址。
  17. JavaScript 是如何工作的:JavaScript 的共享传递和按值传递这是专门探索 JavaScript 及其所构建的组件的系列文章的第 22 篇。 如果你错过了前面的章节,可以在这里找到它们: JavaScript 是如何工作的:引擎,运行时和调用堆栈的概述! JavaScript 是如何工作的:深入V8引...
  18. Node.js对MongoDB进行增删改查操作 MongoDB简介 MongoDB 是一个开源的、文档型的NoSQL数据库程序。MongoDB将数据存储在类似JSON的文档中,操作起来更灵活方便。NoSQL数据库中的文档(documents)对应于SQL数据库中的一行。将一组文档组合在一起称为集合(collections),它大致相当于关系数据库中的表。 除了作为一个NoSQL数据库,MongoDB还有一些自己的...
  19. Web应用性能优化随笔思路就是,当我们去访问一个web应用的时候,都做了哪些操作?对应这些操作的,就是我们所能进行的优化的模块!
  20. js中arraybuffer与blob的区别 当接触过前端中二进制后,arraybuffer和blob是经常会遇到的,而且经常会搞混,那么这两者之间有啥区别,又有啥联系呢? ArrayBuffer ArrayBuffer对象用来表示通用的、固定长度的原始二进制数据缓冲区。ArrayBuffer是不可以直接操作的,而是要通过类型数组对象或 DataView 对象来操作,它们会将缓冲区中的...
  21. Node.js - 阿里Egg的多进程模型和进程间通讯最近用Egg作为底层框架开发项目,好奇其多进程模型的管理实现,于是学习了解了一些东西,顺便记录下来。文章如有错误, 请轻喷
  22. git与github汇总关于git与github首先要明白git和github其实就是足球与球场的关系,git粗爆的可以理解为代码管理工具;其次明白git工作流是怎样运行(如下图)
  23. 把你的devtools从webpack里删除 通过判断是否为 dev 环境,加载 vConsole 并实例化使用: // 开发时引入 vConsole if (process.env.NODE_ENV === 'development') { // 吐槽一波:不支持 import 方式 const VConsole = require('vconsole'); new VConsole(); } 复制代码 生产环境是没有 vConsole 了吧!想象很丰满,打包很骨感。 ...
  24. 开发Vue组件系列之模态框 项目基础工程文件是使用 vue-cli3.0 搭建的,这里不过多介绍。开发Vue组件系列之模态框,主要有标题、内容、定时器、按钮文案、按钮事件回调、遮罩层这些可配置项。本次开发得组件是本系列的第一个组件,后期也会有更多系列教程推出。 使用命令行 $ Vue create echi-modal $ cd echi-modal $ npm install $ npm ru...
  25. keep-alive + vuex 让缓存的页面灵活起来 在使用vue + vue-router开发SPA的时候,有没有遇到过这样的情况:当我们在列表页和详情页之间切换的时候,如果列表页不做缓存,会导致每次从详情页返回时,列表页都会重新加载。如下图: 细心的朋友已经发现了,当从详情页返回列表页的时候,列表页重载了,这样的体验显然不好,这时我们可以对列表页进行缓...
  26. 【React深入】深入分析虚拟DOM的渲染原理和特性React的虚拟DOM和Diff算法是React的非常重要的核心特性,这部分源码也非常复杂,理解这部分知识的原理对更深入的掌握React是非常必要的。
  27. 基于JQuery做的一个简单的点击显示和隐藏的小Demo 最近新加入了一个公司,并接手到了一个新项目,是基于 Spring + Spring MVC + MyBatis 架构来搭建的,在公司领导的需求下修改功能,需要修改些修改些前端页面,原本很简单的就是一个JQuery的基于事件的显示和隐藏节点,却花费了几个小时才弄清楚大概,效率实在低下。记录下吧! 1. 简单Demo源代码 具体效果可以直接...
  28. 关于JS更新input元素的value属性引发的狗血讨论 来个面试题: 在浏览器中,对于input节点的用户输入,何时触发"change"事件呢? 在浏览器中,JS更新input的value属性,会触发"change"事件吗? 如果不会触发,请问为什么?有什么办法解决吗? 根据对上面问题的理解,我分为以下三个认知阶段: 第一阶段:读者只需要答案...
  29. 在 Go 中使用 Websockets 和 Socket.IO 注 - 本教程是使用 Go 1.9 版和 googollee/go-socket.io 编写的 Websockets 我觉得非常有趣,在应用程序之间通信中使用标准 RESTful API 方案之外,它为我们提供了一个替代选项。使用套接字,我们可以做到成千上万个不同客户端之间的实时通信,而不必让每分钟数十万个 RESTful API 调用来轰炸我们的服务器。 视...
  30. 2019 React Redux 完全指南》在本篇 Redux 教程中,我会渐进地解释如何将 Redux 与 React 搭配使用 —— 从简单的 React 开始 —— 以及一个非常简单的 React + Redux 案例。 (by 希里花斯)

    2019 React Redux 完全指南

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

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

原文:20190419 前端开发日报 ,未经许可,禁止转载。
来源:前端开发博客 (http://caibaojian.com/fe-daily-20190419.html)