资讯专栏INFORMATION COLUMN

撩课-Web大前端每天5道面试题-Day1

番茄西红柿 / 2277人阅读

摘要:的变量提升的底层原理是什么引擎的工作方式是先解析代码,获取所有被声明的变量然后在运行。引用计数这种方式常常会引起内存泄漏,低版本的使用这种方式。

1. var的变量提升的底层原理是什么?

JS引擎的工作方式是:
1) 先解析代码,获取所有被声明的变量;
2)然后在运行。也就是说分为预处理和执行两个阶段。
变量提升:所有变量的声明语句都会被提升到代码头部。
但是变量提升只对var命令声明的变量有效,如果一个变量不是用var命令声明的,就不会发生变量提升。

2. JS如何计算浏览器的渲染时间?

 

撩课小编:  浏览器的渲染过程主要包括以下几步:
1) 解析HTML生成DOM树。
2) 解析CSS生成CSSOM规则树。
3) 将DOM树与CSSOM规则树合并在一起生成渲染树。
4) 遍历渲染树开始布局,计算每个节点的位置大小信息。
5) 将渲染树每个节点绘制到屏幕。
优化考虑:
CSS 优先:引入顺序上,CSS 资源先于 JavaScript 资源。
JS置后:通常把JS代码放到页面底部,且JavaScript 应尽量少影响 DOM 的构建。

 

 

 

3. JS的回收机制?

撩课小编: 垃圾回收机制是为了以防内存泄漏,(内存泄漏: 当已经不需要某块内存时这块内存还存在着),  垃圾回收机制就是间歇的不定期的寻找到不再使用的变量,并释放掉它们所指向的内存。

JS有两种变量: 全局变量和在函数中产生的局部变量。局部变量的生命周期在函数执行过后就结束了,此时便可将它引用的内存释放(即垃圾回收),但全局变量生命周期会持续到浏览器关闭页面。

JS执行环境中的垃圾回收器有两种方式:标记清除(mark and sweep)、引用计数(reference counting)。

标记清除:  垃圾收集器给内存中的所有变量都加上标记,然后去掉环境中的变量以及被环境中的变量引用的变量的标记。
在此之后再被加上的标记的变量即为需要回收的变量,因为环境中的变量已经无法访问到这些变量。

引用计数(reference counting):  这种方式常常会引起内存泄漏,低版本的IE使用这种方式。
机制就是跟踪一个值的引用次数,当声明一个变量并将一个引用类型赋值给该变量时该值引用次数加1,
当这个变量指向其他一个时该值的引用次数便减一。
当该值引用次数为0时就会被回收。

 


4. 垂直水平居中的方式?

撩课小编: 
方式一:  定位
父元素设置为:position: relative; 
子元素设置为:position: absolute; 
距上50%,据左50%,然后减去元素自身宽度的距离就可以实现 

width: 100px;
height: 100px;
position: absolute;
left: 50%;
top: 50%;
margin: -50px 0 0 -50px;

方式二:  flex布局

display: flex; //flex布局
justify-content: center; //使子项目水平居中
align-items: center; //使子项目垂直居中

方式三:  table-cell  (不推荐)

display: table-cell;
vertical-align: middle;//使子元素垂直居中
text-align: center;//使子元素水平居中

  

5. 实现一个三栏布局,中间版块自适应方法有哪些?

撩课小编:  浮动和定位
浮动方式:

<div class="content">
   <div class="left">leftdiv>
   <div class="right">rightdiv>
   <div class="center">centerdiv>
div>

.left{
    float: left;
    width: 100px;
    height: 200px; 
}

.right{
    float: right;
    padding: 0;
    width: 100px;
    height: 200px;
}

.center{
    margin: 0 100px 0 200px;
}


方式二:  将父容器的position设置为relative,两个边栏的position设置成absolute。

 

 

 

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/1508.html

相关文章

  • 前端最强面经汇总

    摘要:获取的对象范围方法获取的是最终应用在元素上的所有属性对象即使没有代码,也会把默认的祖宗八代都显示出来而只能获取元素属性中的样式。因此对于一个光秃秃的元素,方法返回对象中属性值如果有就是据我测试不同环境结果可能有差异而就是。 花了很长时间整理的前端面试资源,喜欢请大家不要吝啬star~ 别只收藏,点个赞,点个star再走哈~ 持续更新中……,可以关注下github 项目地址 https:...

    wangjuntytl 评论0 收藏0
  • 我的春招求职经验分享(已拿阿里京东网易等 5 个 offer)

    摘要:面经因为我完全没有面试经验,从来没有经历过面试,于是想着在去这类大公司面试之前先找成都的小公司练练手,积累点面试经验。于是三月份开始就有成都的小公司开始约我面试。 前序 从我高考成绩出来那一刻开始,从我在高考志愿上填上计算机科学与技术这几个当时在心中堪称神圣的几个字开始,我就已经把进入中国互联网最高殿堂BAT作为我整个大学奋斗的目标,哪怕我就读的是一所位于内陆的双非一本大学我也认为我能...

    Winer 评论0 收藏1
  • LeetCode 攻略 - 2019 年 8 月上半月汇总(109 攻略)

    摘要:每天会折腾一道及以上题目,并将其解题思路记录成文章,发布到和微信公众号上。三汇总返回目录在月日月日这半个月中,做了汇总了数组知识点。或者拉到本文最下面,添加的微信等会根据题解以及留言内容,进行补充,并添加上提供题解的小伙伴的昵称和地址。 LeetCode 汇总 - 2019/08/15 Create by jsliang on 2019-08-12 19:39:34 Recently...

    tracy 评论0 收藏0
  • 每天10Java面试,跟我走,offer有!

    摘要:虚拟机在执行字节码时,把字节码解释成具体平台上的机器指令执行。总体来说就是,我们利用调用开发了属于我们自己的程序后,通过中的编译程序将我们的文本文件编译成字节码,在上运行这些字节码,解析这些字节码,映射到指令集或的系统调用。 1.简述JDK、JRE、JVM? 一、JDK JDK(Java Development Kit) 是整个JAVA的核心, 包括了Java运行环境(Java Ru...

    zsy888 评论0 收藏0
  • 每天10Java面试,跟我走,offer有!

    摘要:虚拟机在执行字节码时,把字节码解释成具体平台上的机器指令执行。总体来说就是,我们利用调用开发了属于我们自己的程序后,通过中的编译程序将我们的文本文件编译成字节码,在上运行这些字节码,解析这些字节码,映射到指令集或的系统调用。 1.简述JDK、JRE、JVM? 一、JDK JDK(Java Development Kit) 是整个JAVA的核心, 包括了Java运行环境(Java Ru...

    cyrils 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<