字节跳动校招提前批前端一面总结

面试官上来就问了一些比较简单的问题（除了自我介绍和项目经历）
1、块级元素和行内元素分别有哪些？
块级元素：address 、article、 aside、 audio、 video、 canvas、 div、 footer、 form、 h1、 h2、 h3、 h4、 h5、 h6、 header、 hr、 ul、 ol、 output、 p、 table等
行内元素：a、 img、 map、 span、 button、 input、 label、 select等
2、块级元素和行内元素的区别？
（1）行内元素会在一条直线上排列（默认宽度只与内容有关），都是同一行，水平方向排列。
块级元素各占据一行（默认宽度是他本身父容器的100%，与内容无关），垂直方向排列。块级元素从新行开始，结束接着一个断行。
（2）块级元素内可以包含行内元素，行内元素不能包含块级元素，只能包含文本或其他行内元素。
（3）块级元素和行内元素属性的不同，主要是盒模型属性上：行内元素设置width无效，height无效（可以设置line-height），margin上下无效，padding上下无效。
3、块级元素、行内元素的转换？
display：block；转换为块级
display：inline；转换为行内
4、行内元素如何设置宽高？
（1）display：block；
（2）display：inline-block；
（3）float：left；隐形的将行内元素进行了转化，相当于display：block；float：left；
5、js中如何判断数据的类型？
（1）typeof可以判断出7种：number、boolean、symbol、string、object、undefined、function等。对于null返回Null类型，function返回function类型。数组、日期、正则会返回object类型。
（2）instanceof用来判断A是否为B的实例，表达式为A instanceof B，如果A是B的实例，返回true，否则返回false。instanceof检测的是原型。只能判断两个对象是否属于实例关系，而不能判断一个对象实例具体属于那种类型。ES5提供了Array.isArray()方法来判断某个对象本身是否为Array类型。
（3）constructor（不会用）
（4）toString（）是object的原型方法，调用该方法，默认返回当前对象的[[Class]]。这是一个内部属性其格式为[object xxx]，其中xxx就是对象的类型。object对象，直接调用toString（）就能返回[object,object]。而对于其他对象，则需要通过call/apply来调用才能返回正确的类型信息。
6、盒子模型
盒子模型分为W3C标准模型和IE盒模型，他包括：边距、边框、填充和实际内容（margin、border、padding、content）。
最终元素的总宽度：
W3C标准总宽度=content+margin（左右）+padding（左右）+border（左右）
IE标准总宽度=content+margin（左右） IE模型中的content包括border和padding
7、如何实现三列布局？
三列布局，一般指两端固定宽度，中间宽度自适应的布局方式。
（1）绝对定位absolute：中间版块不给宽度，通过左右绝对定位left和right实现自适应。
（2）两侧浮动+中间自动撑开，设置完宽度之后，左边float：left；右边float：right。中间自适应可以通过display：block；实现或者给左右固定宽度。
（3）圣杯布局通过三栏float和负margin达到并列效果，给最外层左右padding等于左右板块的宽度，在通过相对定位把左右板块往两边拉如：

<div class="container"><div class="middle">middle</div><div class="left">left</div><div class="right">right</div>
</div>.middle {width: 100%;height: 100%;background: blue;float: left;
}.left {width: 100px;height: 100%;background: red;margin-left: -100%;float: left;
}.right {width: 150px;height: 100%;background:yellow;margin-left: -150px;float: left;
}

（4）比翼双飞布局通过内层加margin的方式，让内层元素刚好定位到露出位置。
（5）flex布局，父元素设置diaplay：flex；
（6）table布局，设置display：table-cell；
8、原型链
9、position的属性
10、http的七层模型
11、cookie和session，了解服务端的session吗
12、xss和跨站伪造攻击防御
13、http的请求方式：get、post、connect、put、delete、head等
14、get和post的区别
15:、http的状态码

字节跳动校招提前批前端一面总结相关推荐

字节跳动校招提前批面试
一面: 1.java写一个单例模式 ???? 2.fina.finally.finalize的区别 3.手写代码单链表的反转已知二叉树的前序和中序,输出后序 4.TCP的四次挥手,为什么四次挥 ...
【校招内推】字节跳动2022提前批开启
Hello 同学们,2022校招研发提前批正式启动,4000+研发岗位Offer来袭!邀请身边优秀的同学加入公司,和全球优秀的同学一起做有挑战成就的事情! 报名时间:2021年7月8日-8月1日招聘 ...
2021-07/08收集字节跳动---Java提前批面试题
一.字节提前批java后台开发面试一面 1. 字符编码的utf8 gbk为什么设计这么多格式. 1)ASCII 编码众所周知,计算机只能处理0和1,任何符号都转换为0和1的序列才能处理.计算机中8个 ...
内推 | 字节跳动算法提前批
点上方计算机视觉联盟获取更多干货仅作学术分享,不代表本公众号立场,侵权联系删除转载于:字节跳动 AI博士笔记系列推荐周志华<机器学习>手推笔记正式开源!可打印版本附pdf下载链接 - ...
百度校招提前批前端一面
中午刚面试完.趁热乎赶紧记下.一面是个超级温柔的小姐姐.我坐在公司楼道面试,差点没热死,关键还连接不上公司网,连自己热点. 自我介绍,问了问公司实习的项目情况. bfc 两边固定,中间自适应. 看代码 ...
【熬夜整理近百份大厂面经】2022校招提前批面经总结分享（腾讯、字节、阿里、百度、京东等招聘信息+必考点+简历书写）
整理面经镇楼随着高考的结束,2022的校招提前批已经悄悄开始了,不管你是大四还是研三,应聘将会成为大家接下来半年乃至一年的重要任务! 接下来就结合我自身的经验以及我翻阅几百份最新面经后的一点点总结经 ...
卷起来了！校招提前批爆发期！
点击下方卡片,关注"CVer"公众号 AI/CV重磅干货,第一时间送达 7月正式进入很多公司的2023届校招提前批启动阶段!据Amusi了解,目前腾讯(技术大咖).字节.百度等60 ...
8月！校招提前批的黄金期和末尾期！
点击下方卡片,关注"CVer"公众号 AI/CV重磅干货,第一时间送达 8月已进入校招提前批的黄金期和末尾期!校招时间表如下图所示(建议收藏): 目前字节.百度等100多家公司都已 ...
多益网络2022届校招提前批全面启动【免筛推荐码QEAQU】
多益网络2022届校招提前批全面启动![免筛推荐码QEAQU] 互联网百强企业:中国十大游戏研发商和运营商之一 [提前批优势]直通笔试!不影响正式批次,多一次投递机会 [岗位]策划类.程序类.美术类. ...

字节跳动校招提前批前端一面总结

字节跳动校招提前批前端一面总结相关推荐

最新文章

热门文章