关注IMWeb前端社区公众号

  • 第一时间获得最新、最火的技术干货
  • 定期推送您所关注的专题文章
  • 和大牛们一起讨论前端技术
  • 获取IMWeb社区、前端相关的最新活动
热文 更多

  • transform 的副作用

    transform 想必大家都很熟悉,可以通过其转换(translate)、旋转(rotate)、缩放(scale)、倾斜(skew)等属性来对元素进行变换,不过这篇文章想探讨的不是这些内容,而是 transform 对元素布局、页面渲染方面的影响。例如,你知道它会影响 fixed 元素的位置吗?你有想过它会改变元素的层叠顺序吗? TRANFORM 改变 FIXED 子元素的定位对象 例子探究 首先我们来看一个例子( 代码在这里 [https://jsfiddle.net/elvinn/p38t336r/1/] ):下面示例中的 fixed 元素设置的是 top: -50px ,按理说我们应该是看不见它的,因为它会相对根元素定位到页面上方的外部。然而事实狠狠打了我们的脸,它是可见的!这是为什么呢? 示例 1 [http://ww1.sinaimg.cn/large/005XbUDxgy1fm3tfcopoij30c302uglf.jpg]

  • VS Code进阶

    虽然关于VS Code的介绍文章已经不少了,但面对如此用心的IDE,还是忍不住要再“赞美”一番,希望可以拉更多开发小伙伴入坑,如果能真正提高大家的开发体验当然是最好不过的事情~~ [http://7tszky.com1.z0.glb.clouddn.com/FnriS3yGSmEfc3263n8GJYTsAUHA] 认识VS CODE Visual Studio Code [https://code.visualstudio.com/] (简称VS Code/VSC)是微软在Build 2015大会(本次大会同时还发布了Windows10、Edge等重量级产品)上推出的一款 免费开源 [https://github.com/Microsoft/vscode] 的现代化代码编辑器,支持几乎所有主流的开发语言的语法高亮、智能代码补全、自定义热键、代码折叠、代码片段、内置版本管理等特性,支持插件扩展,并拥有十分活跃的 插件社区 [https://marketplace.visualstudio.com/VSCode] 。

  • ES6解构嵌套对象

    让我们先回忆一下ES6的对象解构,本文介绍各种ES6的对象解构用法,你用过哪一种? 最基本的解构 在对象中提取某个字段 const user = { id: 123, name: 'hehe' }; const {name} = user; console.log(name); //prints: hehe 解构并使用别名 有时接口定义的字段往往带有下划线,但我们的前端更便好于驼峰式命名,那么可以使用别名(rename): const user = { id: 123, nick_name: 'hehe' }; const {nick_name: nickName} = user; console.log(nickName); //prints: hehe 解构嵌套对象 有时我们会遇到嵌套对象,如果我们了解未足够多时,会写出这种解构: const user = { id: 123, name: 'hehe', education: { degree: 'Masters' } };

  • JavaScript任务队列的执行

    1.事件循环(EVENT LOOP)机制 众所周知,JavaScript的一大特点就是是单线程,所有任务都需要在主线程里排队等待执行。 而JavaScript里的任务又分为同步任务和异步任务两种,基于事件循环(Event Loop)机制执行任务。 同步任务作为首要任务会在主线程里执行,异步任务则被“发配”到由另一个线程管理的任务队列中等待处理。异步任务符合条件(比如ajax请求到数据,setTimeout延时到期)后,会在任务队列中添加可执行“事件”,等待主线程中的同步任务执行完毕到任务队列里读取当前可执行的任务,将其加入主线程中执行,以此循环。 根据 HTML Standard [https://html.spec.whatwg.org/multipage/webappapis.html#event-loop-processing-model] 中的描述,一个事件循环中的执行流程大致如下。 1.选择最早的任务 2.设置事件循环中当前任务为上一步中选择的任务 3.执行该任务 4.将事件循环中的当前任务重新设置为空 5.将主线程中执行的任务移除 6.执行Microtask中的任务

  • 尾递归的后续探究

    0 前言 去年大致也是这个事件,曾经探索过尾调用(PTC)相关的内容,并总结了一片文章—— 朋友你听说过尾递归吗 [http://imweb.io/topic/584d33049be501ba17b10aaf] 。同时在文章的最后也留下了一个坑: 尾递归写法的函数在Chrome浏览器的控制台下依旧出现了调用栈溢出的异常。[http://7tszky.com1.z0.glb.clouddn.com/FkFr-FqI3IU8Sv3KCcL_yjTGmX6_] 机缘巧合下又回想起了这个问题,今天就决定把这个坑给填上。 1 ECMASCRIPT兼容性 先带大家看一眼 ES6在各大平台上的兼容性 [http://kangax.github.io/compat-table/es6/] :[http://7tszky.com1.z0.glb.clouddn.com/FlFCnRmqGusq9fv3NwtLyXWsxBcV] 大家可以发现其实每次进入ES6兼容表的时候,功能行的第一行就是我们的尾递归调用(proper tail calls),而它的兼容性也可以看出是满片飘红啊。

热问 更多

  • 赵鹏帆 22 天前

    如题:参考https://twitter.com/necolas/status/829128165314306048?utm_source=feweekly&utm_campaign=issue42&utm_medium=web PWA(做离线化的)目前有这么成熟吗? 这个是否也说明以Javascript为基础的全栈体系正在逐渐落地?

  • 大漠刀客 2017-07-16 13:45

    js高级程序设计里说 this 引用的是函数执行的环境对象, 下面foo()在window下执行,环境对象就是window? * function foo(){ * alert(this); * } * foo(); * 那么函数嵌套为什么也是[object Window]?比如下面的 * function foo(){ * function foo2(){ * alert(this); * } * foo2(); * } * foo(); 输出的还是window * function SpecialArray(){ * alert(this); * } * alert(this); * SpecialArray(); * var colors = new SpecialArray(); 弹出的依次是[object Window],[object Window],[object Object]?这里的Object又是什么情况

  • 络黎 2017-10-19 17:31

    请指出JavaScript宿主对象和原生对象的区别?