20200228 前端开发日报

javascript 代码是如何被压缩的；究竟啥是javascript中的装箱操作与拆箱操作；NodeJS、Npm和 npm 命令介绍；GitHub：除非真正需要，否则我们不会删除您的任何内容；聊一聊看似简单的Promise.prototype.then()方法；微前端：优势，缺点和痛点；Json与Ajax(注册实例）；基于 HTML5 WebGL 的 3D 机房数据中心可视化展示

1. javascript 代码是如何被压缩的这是山月关于高级前端进阶暨前端工程系列文章的第 M 篇文章 (M 随便打的，毕竟也不知道能写多少篇)，关于前 M-1 篇文章，可以从我的 github repo shfshanyue/blog 中找到，如果点进去的话可以捎带~点个赞~，如果…
2. 究竟啥是javascript中的装箱操作与拆箱操作 复习知识点时又一次的一脸懵逼 最近在复习javascript知识点时，又又又忘记了遗忘了一个知识点，还是留下文章来做纪念的好。 当我们转换数据类型时，他们的执行过程因为不同的数据类型，而拥有不同的执行过程，也就是所谓的装箱操作和拆箱操作。一般的解释为，把基本数据类型转换为引用数据类型时，会触发装箱操作。把…
3. NodeJS、Npm和 npm 命令介绍 一、NodeJS Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。 Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型。 Node 是一个让 JavaScript 运行在服务端的开发平台的脚本语言。发布于2009年5月，由Ryan Dahl开发，实质是对Chrome V8引擎进行了封装。 Node对一些特殊用例进行优化，提供替代的API，…
4. GitHub：除非真正需要，否则我们不会删除您的任何内容《GitHub: We won’t take down any of your content unless we really have to》 原文作者：Daphne Leprince – Ringuet 原文链接：[链接]编译：思否@徐九
5. 聊一聊看似简单的Promise.prototype.then()方法 Proise实例的then方法是定义在原型对象Promise.prototype上的，它的作用是为Promise实例添加状态改变时的回调函数。 该方法可以接收两个回调函数作为参数，其中第二个回调函数是可选的。第一个回调函数是 Promise 对象的状态变为 Resolved 时调用，第二个回调函数是 Promise 对象的状态变为 Rejected 时调用。 下…
6. 微前端：优势，缺点和痛点 原文连接 Microfrontends: the good, the bad, and the ugly by KBall 上周前端开发在twitter上讨论关于 微前端 的话题，双方进行了热烈的争论和发表了各自的意见。 这次争论让我想到了过去关于“CSS in JS”的争论。由于我对过去 “CSS in JS”的争论 一直心怀歉意，这次我会更加的客观去看待这个问题。…
7. Json与Ajax(注册实例） 需要在服务器上进行哈 jquery的ajax方法： // jquery请求 $.ajax({ url: "./server/slider.json", type: "post", dataType: "json", async: true, success: function(datas) { renderData(datas.slider); } …
8. 基于 HTML5 WebGL 的 3D 机房数据中心可视化展示在 3D 机房数据中心可视化应用中，随着视频监控联网系统的不断普及和发展, 网络摄像机更多的应用于监控系统中，尤其是高清时代的来临，更加快了网络摄像机的发展和应用。
9. 为物联网项目选择JavaScript的5大理由 在一个以数字化为主导的世界中，物联网(IoT)在改变我们的生活和开展业务方式方面发挥着至关重要的作用。从智能生活到工作场所协作，以及与现场员工的联系，物联网将一如既往地节省时间和提高生产力。 根据一份微软物联网研究报告，大约85%的受访者表示他们目前正在采用物联网，四分之三的人处于项目计划阶段 。此…
10. 如何在Git提交大小写敏感的文件下午在搞代码部署的时候， 遇到一个文件大小写的问题， 问题比较简单， 但是也简单整理下， 分享给大家。
11. 浅谈JavaScript的防抖与节流在前端开发的过程中，我们经常会需要绑定一些持续触发的事件，如 resize、scroll、mousemove 等等，但有些时候我们并不希望在事件持续触发的过程中那么频繁地去执行函数。这时候就用到防抖与节流。
12. 一些 JS 数组精简技巧，要记好笔记了点赞再看，养成习惯本文 GitHub [链接] 上已经收录，更多往期高赞文章的分类，也整理了很多我的文档，和教程资料。欢迎Star和完善，大家面试可以参照考点复习，希望我们一起有点东西。
13. vue必须掌握之组件通信（7种方法） 方法一：$emit / props 父组件通过props的方式向子组件传递,子组件通过$emit触发父组件中v-on绑定的自定义事件 <!–父组件–> <template> <div> <Child :message="message" @customEvent="customEvent"/> </div> </template> <script&gt…
14. 前端常见面试-css篇随着疫情的不断好转，各地都开始逐步的复工，当然对我们来说，也马上迎来所谓的金三银四跳槽季。在此，分享自己在前端领域中积累的一些经验，供自己温故知新。 对于前端来说，涉及的知识面广，内容繁多，但是万变…
15. webpack学习之路 — webpack 入门基本配置 新建一个目录，初始化npm npm init webpack是运行在node环境中的,我们需要安装以下两个npm包 npm i -D webpack webpack-cli 新建一个文件夹 src ，然后新建一个文件 main.js ，写一点代码测试一下 console.log(‘第一次打包’) 配置package.json命令 …
16. JavaScript DOM–元素操作 获取元素 根据 ID 获取元素 语法: document.getElementById(id) <div id=’time’>2020-01-09</div> <script> var timer = document.getElementById(‘time’); console.log(timer); // 根据 ID 获取 // 查看里面的属性和方法 console.dir(timer) </script> …
17. webpack中的Code Splitting以及配置参数 在最开始的时候，webpack都是将所有的代码打包到一个文件中，但是当项目过大的时候，页面所需要加载的时间就会变长，这个时候我们就需要 Code Splitting 对文件进行分块，实现代码的按需加载。 接下来我们来看看下面两种方式： 当用第一种方式的时候， 我们需要等打包文件加载完成之后，才会去实现文件里面的逻辑…
18. 松软科技课堂:jQuery 语法 jQuery 语法 jQuery 语法是为 HTML 元素的选取编制的，可以对元素执行某些操作。 基础语法是：$(selector).action() 美元符号定义 jQuery 选择符（selector）“查询”和“查找” HTML 元素 jQuery 的 action() 执行对元素的操作 示例 $(this).hide() – 隐藏当前元素 $("p").hide() – 隐藏所有段落 …
19. 吊打 JavaScript 之从原型到原型链 （给前端大全加星标，提升前端技能） 作者： 达达前端 公号 / Jeskson （本文来自作者投稿） 目录 说一说原型模式 每个函数都有一个 prototype 原型属性，这个属性它是一个指针，指向一个对象，而这个对象的…
20. jQuery-File-Upload 使用，jQuery-File-Upload上传插件 ================================ ©Copyright 蕃薯耀 2020-01-10 https://www.cnblogs.com/fanshuyao/ 一、官网地址： https://github.com/blueimp/jQuery-File-Upload 二、使用文档（参数说明） https://github.com/blueimp/jQuery-File-Upload/wiki/Options 三、浏览器支持（官网说明） …
21. Promise面试题整理Promise 面试题来源网络 面试题一 {代码…} 运行结果： {代码…} 解释：Promise 构造函数是同步执行的，promise.then 中的函数是异步执行的。 面试题二 {代码…} 运行结果： {代码…} 解释：promise 有 3 种…
22. 记一天两次前端面试的经历（一） Today如果用一个字来形容就是——累，两个字就是很累，三个字真的累… 下午面完试本来觉得今天终于可以放松了，结果到了傍晚又来了一个电话约面试，疲惫的我赶紧推了个时间再约。 本以为会度过一个平静的夜晚，然后突然一个电话又到来，又是一次技术面，而且和下午的是同一个公司的不同部门…此时我是崩溃的。 现…
23. 3D LUT 滤镜颜色映射原理剖析与JS实现 byzhangxinxu from https://www.zhangxinxu.com/wordpress/?p=9275 本文欢迎分享与聚合，全文转载就不必了，尊重版权，圈子就这么大，若急用可以联系授权。 一、原理剖析 关于3D LUT滤镜及其相关知识可以参考我之前“ 用3D LUT滤镜电影级别调色工具 ”一文，重复内容不再赘述。 3D LUT实际上就是一个立体的颜色…
24. vue插槽（slot）的模板与JSX写法 vue官网API: 插槽： https://cn.vuejs.org/v2/guide/components-slots.html JSX： https://cn.vuejs.org/v2/guide/render-function.html 说明：vue版本2.6.0以上语法 一、插槽模板传值 子组件：child.vue <template> <div> <!– 默认插槽 –> <slot :info…
25. js中保存成图片并下载 1、保存canvas中绘制的内容为图片 HTML代码： <canvas id="canvas" width="400" height="400"></canvas> <div> <button id="save">保存</button> </div> js代码： var arr = , , ],c…
26. Vue – 自定义组件双向绑定 前言 无论在任何的语言或框架中，我们都提倡代码的复用性。对于Vue来说也是如此，相同的代码逻辑会被封装成组件，除了复用之外，更重要的是统一管理提高开发效率。我真就接手过一个项目，多个页面都会用到的列表，没有去封装列表组件，只要有一点改动，每个页面都得加上。很肯定的说，没有用组件化开发的Vue项目是没有…
27. JS—案例：旋转木马 案例：旋转木马 页面加载时候出现的效果，script标签写在head里面，body上面 显示一个图片散开的动画，遍历之后，把每个图片用封装的动画函数移动到指定目标（同时改变多属性：宽，透明度，层级，top, left） 在做左右按钮点击事件。 右边按钮，用数组里面的push和shift，数组第一个去除加到最后一个位置 左边按钮…
28. jQuery 源码解析(二十九) 样式操作模块 尺寸详解 样式操作模块可用于管理DOM元素的样式、坐标和尺寸，本节讲解一下尺寸这一块 jQuery通过样式操作模块里的尺寸相关的API可以很方便的获取一个元素的宽度、高度，而且可以很方便的区分padding、border、 margin等，主要有六个API，如下: heihgt(size)、width(size)  ;获取第一个匹配元素的高度、宽度，或者通…
29. 松软科技课堂:jQuery 效果 – 淡入淡出 jQuery Fading 方法 通过 jQuery，您可以实现元素的淡入淡出效果。 jQuery 拥有下面四种 fade 方法： fadeIn() fadeOut() fadeToggle() fadeTo() jQuery fadeIn() 方法 jQuery fadeIn() 用于淡入已隐藏的元素。 语法： $(selector).fadeIn(speed,callback); 可选的 speed 参数规定效果的时…
30. Javascript 实践中的命令模式这一系列是对平时工作与学习中应用到的设计模式的梳理与总结。由于关于设计模式的定义以及相关介绍的文章已经很多，所以不会过多的涉及。该系列主要内容是来源于实际场景的示例。本篇文章为该系列的第一篇，下一…
31. 原生JS实现旋转木马轮播图特效 大概是这个样子： 首先来简单布局一下（emm…随便弄一下吧，反正主要是用js来整的） 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-sc…
32. jQuery—内容复习 1.1 css操作       设置单个样式       设置多个样式       获取样式 css(name, value) :设置单个样式 css(obj):设置多个样式 css(name):获取样式 1.2 class操作       addClass(name):添加类     &n…
33. CSS选择器及优先级选择器分类 id选择器 {代码…} 类选择器 {代码…} 标签选择器 {代码…} 属性选择器 {代码…} 伪类选择器 a元素的伪类：link、visited、active、hover。 其他(1) li:first-child{} (修饰第一个li)(2) li:last-…

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

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