20180311前端开发周报

px单位html5响应式方案;2018春招前端面试: 闯关记;前端面试手册;前端在人工智能时代能做些什么?;基于 HTML5 Canvas 的交互式地铁线路图;JS中浮点数精度问题;《你不知道的 JavaScript 上卷》 学习笔记;2018 年,我们该如何使用 JavaScript?

  1. 3、前端面试手册

    这是什么? 与典型的软件工程师面试不同,前端面试对算法的重视比较低。面试会更多考查错综复杂的前端知识,像HTML、CSS、JavaScript等等。 虽然现在有一些资料,可以帮助前端开发者准备面试,但是远不如软件工程师那么丰富。目前为止,最有用的前端面试资料是前端开发者面试问题集。但是,有相当一部分问题…

  2. 4、前端在人工智能时代能做些什么?

    之前很长的一段时间内,一直在做阿里云人工智能产品 ET,作为一名前端工程师,参与了当中的一些工程工作,分享出来,希望对大家有所帮助。 前端工程在人工智能的团队到底能做什么,体现怎么的价值?对此,可以先下图的一个总结,然后我会逐条分析 从我们的实践看,要完成一个完整的人工智…

  3. 2、2018春招前端面试: 闯关记

    正月十三出门…..正式回归大深圳… emmmm….开始踏上漫漫的找工作之路; “拉勾上吊一百年不匹配!!!”,”BOSS直聘日夜没反应!!!” 题目范围涵盖我最近遇到的笔试题和面谈的….这里不列举哪些公司了 问题汇总,想到就写…. Q: CSS 有哪些样式可以给子元素继承! 可继承的: font-size …

  4. 5、基于 HTML5 Canvas 的交互式地铁线路图

    基于HTML5 Canvas 的交互式地铁线路图 前言 前两天在 echarts 上寻找灵感的时候,看到了很多有关地图类似的例子,地图定位等等,但是好像就是没有地铁线…

  5. 6、JS中浮点数精度问题

    最近在做项目的时候,涉及到商品价格的计算,经常会出现计算出现精度问题。刚开始草草了事,直接用toFixed就解决了问题,并没有好好的思考一下这个问题。后来慢慢的,问题越来越多,连toFixed也出现了(允悲),后来经过搜索网上的各种博客和论坛,整理总结了一下。 问题的发现 总结了一下,一共有以下两种问题 …

  6. 8、2018 年,我们该如何使用 JavaScript?

    从命令行工具和 webpack 到 TypeScript,Flow 等其他工具,我们不妨来讨论一下在 2018 年该如何使用 JavaScript。 去年,包括我在内的很多人都在 谈论 JavaScript 的乏力 。事实上编写 JavaScript 应用程序的方式并没有真正减少,另外有很多命令行工具完成了大量繁重的工作,转译(transpiling)变得不那么重要,并且 …

  7. 9、JavaScript 即将迎来 Optional Chaining

    Optional Chaining 现在处于 Stage 1。 它是什么? Optional Chaining 使我们能检查一个对象上面是否存在某属性。其它一些语言有类似的特性。C# 例如,有 Null Conditional 操作符很像提案中的 Optional Chaining。 我们为何需要它? 你是否曾经在使用对象或数组的属性之前,检查它…

  8. 我对知乎前端相关问题的十问十答 – 张鑫旭 来来来,干了这碗鸡汤~ 前端老鸟张同学发表对一些前端人生问题的思考,够浓,不过可以品出不少味道:http://www.zhangxinxu.com/wordpress/2017/06/ten-question-about-frontend-zhihu/
  9. 11、记录面试中一些回答不够好的题(Vue 居多)

    这个问题比较简单,用 flex 与 grid 实现如下即可: 实现方式如下: <html> <head> <style> /* flex */ .box { display: flex; flex-wrap: wrap; width: 100%; } .box div { width: calc(100% / 3); height: 1…

  10. 12、随想录(利用websocket监控服务器)

    声明:版权所有,欢迎转载,请勿用于商业用途。 联系信箱:feixiaoxing @163.com websocket是实现浏览器和web服务器沟通的一个好方法。一个比较好的使用方法就是在web网页上使用websocket,然后再起一个webdocketd服务器。具体的地址参考github上的这个 网址 。阮一峰的文章建议也可以参考一下,地址在 这…

  11. 13、随想录(three.js脚本)

    声明:版权所有,欢迎转载,请勿用于商业用途。 联系信箱:feixiaoxing @163.com openGL作为事实上的3d标准,可以在不同的os平台上使用。但是openGL一般需要用c进行开发,有所不便。然而,随着WebGL的推出,人们开始发现可以使用js编写3d程序,利用浏览器将3d效果渲染出来。这其中,three.js作为支持WebGL的一个…

  12. 14、杂谈区块链生态里的前端黑

    我这里给大家开个头,今年我带领的一支团队(慢雾安全团队)会对外做个大分享,和区块链生态安全有关的分享。这个生态安全很大,内容很多,你看我写“黑客与区块链”系列就知道,这个系列很有得写… 今天我就专门提下前端安全领域在区块链生态里为什么会这么的重要。 这个重要性首先和区块链生态里币的…

  13. 15、了解JavaScript的递归

    简介 使用递归可以更自然地解决一些问题。例如,像斐波那契数列:数列中的每个数字都是数列中前两个数字的和。凡是需要您构建或遍历树状数据结构的问题基本都可以通过递归来解决,锻炼自己强大的递归思维,你会发现解决这类问题十分容易。 在本文中,我将列举两个案例,让你们了解递归函数是如何工作的。 纲…

  14. 16、2018年蚂蚁金服前端一面总结(面向2019届学生)

    先简短的介绍一下我自己吧,我是一个前端学习者,虽然我基础知识也学了比较好,但是许久不用的知识就像流失的水,很容易就忘。在这次蚂蚁金服的电话面试里面认识到了自己很多不足的地方吧。虽然在阿里内推后的人…

  15. 17、前端小生面试之看不懂的 []+{}

    有一天,去面试,遇到这样的题: {}+{} 1+[] ???WTF,谁会没事这么写代码,好吧,我错了,大佬别打我。懵逼之后要干嘛?当然是要学习一波,于是我满世界找资料,有好东西当然是要分享一波,好了,接下来我们就一起走进 JavaScript 隐式转换的世界吧。 加法运算 在 JavaScript 中加法运算规则很简单,它只…

  16. 18、Promise 使用技巧九则

    本文译自 9 Promising Promise Tips。 工程师们,你们总说Pormise好用!但有时候用起来是不是还很懵逼。本文传授给你九条实用的 Promise 使用技巧,帮助你和它建立起良好的关系! 1. 你可以在.then回调里返回 Promise 我必须大声喊出来: 是的!你可以.then回调里返回 Promise! …

  17. 19、Ajax详解

    4.2 – 详解Ajax引擎的状态属性 readyState(0 1 2 3 4)*0.请求未初始化 *1.服务器连接已建立 *2.请求已接收 *3.请求处理中 *4.请求已完成,并且响应已…

  18. 20、JavaScript中的图片处理与合成(一)

    图片处理现在已经成为了我们生活中的刚需,想必大家也经常有这方面的需求。实际前端业务中,也经常会有很多的项目需要用到图片加工和处理。由于过去一段时间公司的业务需求,让我在这方面积累了一些干货,趁着年后这段时间总结成一系列文章与大家分享,希望能对各位努力中的前端童鞋带来启发和帮助~~~:smiley: 本系列…

  19. 21、今日头条爬虫之:解析JS得到signature

    只要你开始写爬虫了,或早或晚的你都会去接触到JavaScript。然后等你爬虫做久了,你就会成为你个资深的前端开发工程师。 在之前的文章中提过,在定向爬虫中极其不推荐使用selenium,速度太慢。那对于JavaScript总要有个解决方案,速度相对快的解决方案有两个: 将js代码翻译成python。严肃别笑,这是可行的,在j…

  20. 22、webpack从入门到放弃

    从启动webpack构建到输出结果经历了一系列过程: 解析webpack配置参数,合并从shell传入和webpack.config.js文件里配置的参数,生产最后的配置结果。 注册所有配置的插件,好让插件监听webpack构建生命周期的事件节点,以做出对应的反应。 从配置的entry入口文件开始解析文件构建AST语法树,找出每个文件…

  21. 23、Egg 2.4.1 和 1.13.1 发布,阿里企业级 Node.js 框架

    Egg 2.4.1 和 1.13.1 已发布,Egg 是阿里开源的企业级 Node.js 框架,为企业级框架和应用而生。团队的架构师和技术负责人可以非常容易地基于自身的技术架构在其基础上扩展出适合自身业务场景的框架。 Egg 2.4.1 中值得关注的更新 fix 默认情况下不允许 x-forwarded-host 标头 ctx….

  22. 24、[翻译]CSS变量让你轻松制作响应式网页

    原文地址:https://medium.freecodecamp.org/how-to-make-responsiveness-super-simple-with-css-variables-8c90ebf80d7f 作者:Per Harald Borgen 摘要:这是一篇2018年制作响应性网页的快速教程。 如果你之前没…

  23. 25、Node.js v8.10.0 (LTS) 发布,带来许多重大变更

    Node.js v8.10.0 (LTS) 已发布,这个版本带来了很多重大变化。V8, libuv 和 ICU 都有更新,npm 包含一个错误修复,并支持使用 OpenSSL 1.1.0 构建。 值得关注的变更: deps: 升级 V8 至 6.2.414.46 (Michaël Zasso) #16413 恢复 V8 6.2 中的 ABI 重大更改(Anna Henningsen) #16413 …

  24. 26、Vue 2.0学习笔记:实现组件数据的双向绑定

    通过上一节的学习,我们了解到了在Vue的组件中数据传递: prop 向下传递,事件向上传递 。意思是父组件通过 prop 给子组件下发数据,子组件通过事件给父组件发送消息。但Vue中, props 是单向数据绑定,虽然在Vue 1.0版本中,通过 .sync 能实现双向数据绑定。但 .sync 在几个版本中被移除,尽管在2.3版本重新引入 .syn…

  25. 27、前端技术周刊 2018-03-02

    前端快爆 webpack 4 正式发布,代号为「Legato」。新版本构建性能大幅提升,同时带来了多项重要更新:零配置启动、支持 ESM 和 JSON 形式的模块类型、支持 WebAssembly、移除 CommonsChunkPlugin 取而代之的是 op…

  26. 28、深入理解JQuery插件开发

    如果你看到这篇文章,我确信你毫无疑问会认为jQuery是一个使用简便的库。jQuery可能使用起来很简单,但是它仍然有一些奇怪的地方,对它基本功能和概念不熟悉的人可能会难以掌握。但是不用担心,我下面已经把代码划分成小部分,做了一个简单的指导。那些语法看起来可能过于复杂,但是如果进入到它的思想和模式中,它是非…

  27. 29、闲里偷忙,来点Vue

    最近对vue学习一段时间之后,于是自己打算通过学习实现了一个项目,在这里想与看到的您分享实战中踩过的雷和关于一些细节的处理技巧,最主要的还是原生组件的实现。由于主要是前端界面的实现,所以在后台使用的是express来模拟数据,当然你还可以选择json-server和easy-mock这些都能进行数据的模拟。不过自己在使用过程…

  28. 30、Vue 服务端渲染(SSR)

    什么是服务端渲染,简单理解是将组件或页面通过服务器生成html字符串,再发送到浏览器,最后将静态标记”混合”为客户端上完全交互的应用程序。 于传统的SPA(单页应用)相比,服务端渲染能更好的有利于SEO,减少页面首屏加载时间,当然对开发来讲我们就不得不多学一些知识来支持服务端渲染。同时服务端渲染对服…

  29. 31、前端每周清单第 53 期:Go 与 WebAssembly, React Suspense 演练, CSS 技巧

    前端每周清单专注前端领域内容,以对外文资料的搜集为主,帮助开发者了解一周前端热点;分为新闻热点、开发教程、工程实践、深度阅读、开源项目、巅峰人生等栏目。欢迎关注前端之巅微信公众号(ID: frontshow…

  30. 32、webpack打包之后的文件过大的解决方法

    以前一直使用 create-react-app 这个脚手架进行 react 开发,后面因为一些自定义的配置,转而使用 webpack 搭建一套自己的脚手架。但是在使用 webpack 打包之后发现,纳尼?怎么文件这么大??? 于是研究了一下如何处理 webpack 打包之后文件太大的情况,简单记录下来。 首先配置全局变量 首先,通过指定环境,告…

  31. 写了个移动端可滑动(惯性滑动&回弹)Vue导航栏组件 ly-tab 前段时间写了一个移动端的自适应滑动Vue导航栏组件,觉得有一定实用性,大家可能会用得到(当然有些大佬自己写得更好的话就没必要啦),于是前两天整理了一下,目前已经发布到npm和GitHub上了,点我到npm, 点我到GitHub项目 ,有需要的同学可以在项目中 npm install ly-tab -S 或者 yarn add ly-tab 使用,具体用法下面…
  32. 35、CSS3进阶:酷炫的3D旋转透视

    我们做前端的,本能就是炫酷:之前学习 react+webpack ,偶然路过 webpack 官网 ,看到顶部的 LOGO ,就很感兴趣。最近觉得自己 CSS3 过于薄弱,想着深入学习一番,遂以这个 LOGO 为切入口,好好研究学习了一下相关的 CSS3 属性。

  33. 36、简单理解JSONP的定义及其实现

    同源策略规定只在协议相同、域名相同、端口相同的情况下,也就是两个网页同源时,才能读写对方的资源。这是为了保证用户的信息安全做出的限制,然而同源策略有时也会对合理的用途造成影响,那么就需要想办法规避同源策略带来的影响。 用script标签发请求 浏览器解析html页面时,如果看到有如link、img、script等标签…

  34. 37、极致 Web 性能:SPA 性能指南

    前言 前端框架时代,为开发体验、效率与页面性能带来,非常大的革命。大家纷纷拿起一系列打包工具(webpack/parcel etc.),配合一系列加载器快速搭建起一个 SPA 页面。 SPA 应用带来的好处非常明显; 提升页面切换体验 降低切换时间 易于部署&前后端分离 但是也带…

  35. 38、理解JavaScript中的去抖函数

    何为去抖函数?在学习JavaScript去抖函数之前我们需要先弄明白这个概念。很多人都会把去抖跟节流两个概念弄混,但是这两个概念其实是很好理解的。 去抖函数(Debounce Function),是一个可以限制指定函数触发频率的函数。我们可以理解为 连续调用 同一个函数多次,只得到执行该函数一次的结果;但是隔一段时间再次…

  36. 39、Babel工作原理及Babel插件开发探索

    首先我们这里需要了解一些基本的概念, 这篇文章介绍的很详细 ,我这边只提一下。 Babel Babel 是 JavaScript 编译器,更确切地说是源码到源码的编译器,通常也叫做“转换编译器(transpiler)”。 意思是说你为 Babel 提供一些 JavaScript 代码,Babel 更改这些代码,然后返回给你新生成的代码。 AST 抽象语…

  37. 40、Javascript 中实现对象原型继承的三种方式

    Javacript 中有一个思想:万物皆对象,几个基础类型(String, Number, Boolean, Null, Undefined, Symbol),几个引用类型(Array, Date, Function, Object, Regexp)本质上都是对象。 那么对象之间如何实现关联(也就是OO里面的继承)呢?js中通过prototype(原型)来实现。每个对象都有一个__proto__指针,指向上一个…

喜欢这篇文章的朋友,欢迎收藏、分享、评论,帮我上热门,你的支持,是我每日更新的动力!

喜欢前端的朋友可以点击关注一下我微博,每日分享精彩的前端文章!


关注我

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

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

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