2020阿里巴巴前端开发工程师经典面试题

可莉
• 阅读 270

2020阿里巴巴前端开发工程师经典面试题

**后台回复【福利*】领取JavaScript零基础入门课程*********

今天老李找了一下阿里巴巴的架构师聊了一下关于前端开发工程师的一些基本的技术需求,整理了一堆面试题,很经典,也很实用。

如果你也想进入一个不错的公司,拿到一个不错的薪资,这13道面试题你必不可少!

1、请列举7种以上常用的HTML标签,说明其语义。

  1. div标签,是一个块元素,就像一个大盒子,可以放各式各样的东西;

  2. p标签,也是一个块元素,它通常用来放一段话的….;

  3. h1,h2,h3,…h6标签,也是块元素,常用来放标题;

  4. span标签,是一个行内元素,常用来处理一段话中的某几个字符;

  5. img标签,用来加载图片的标签;

  6. table标签,用来创建表格的标签;

  7. br标签,用来换行的标签;

  8. hr标签,用来表示分行线的标签;

  9. a 一个点击跳转的标签;

  10. ul 一个用来做列表的标签。

2、请说明下面各种情况的执行结果,并注明产生对应结果的理由。

2020阿里巴巴前端开发工程师经典面试题

  • 1)弹出element object,通过函数赋值方式,this直接指向element对象;

  • 2)弹出window object,this是写在doSomething这个函数里面的,而这种方式的事件绑定写法并没有将element对象传递给this,而在默认情况下this 指向window;

  • 3)弹出window object,没有绑定对象的情况下this默认指向window。

3、请用JavaScript语言实现 sort 排序函数,

要求:

2020阿里巴巴前端开发工程师经典面试题

如果你有多种解法,请阐述各种解法的思路及优缺点。(仅需用代码实现一种解法,其它解法用文字阐述思路即可)

2020阿里巴巴前端开发工程师经典面试题

4、请根据下面的HTML和CSS代码,画出布局示意图

2020阿里巴巴前端开发工程师经典面试题

2020阿里巴巴前端开发工程师经典面试题

5、阅读以下JavaScript代码:

2020阿里巴巴前端开发工程师经典面试题

请阐述

  • a) 代码的功能;

  • b) 代码的优点和缺点;

  • c) listener.apply(el) 在此处的作用;

  • d) 如果有可改进之处,请给出改进后的代码,并说明理由。


  • a) 功能:事件注册

  • b) 优点:跨浏览器,特性探测,性能优化。缺点:document.all

  • c) 作用:使得IE中listener的this 为 el,与其它浏览器一致 d) 改进:document.all改成window.attachEvent; useCapture的默认

6、请编写一个JavaScript 函数toRGB,它的作用是转换CSS中常用的颜色编码。

要求:

2020阿里巴巴前端开发工程师经典面试题

2020阿里巴巴前端开发工程师经典面试题

7、尝试实现注释部分的Javascript代码,可在其他任何地方添加更多代码

(如不能实现,说明一下不能实现的原因):

2020阿里巴巴前端开发工程师经典面试题

8、请编写一个JavaScript函数,它的作用是校验输入的字符串是否是一个有效的电子邮件地址。

要求:

  • a) 使用正则表达式。

  • b) 如果有效返回true ,反之为false。

2020阿里巴巴前端开发工程师经典面试题

9、请分别列出HTML、JavaScript、CSS、Java、PHP、Python的注释代码形式。

2020阿里巴巴前端开发工程师经典面试题

10、根据下图,编写HTML结构。要求:遵循xHTML 1.0规范且符合Web语义。

2020阿里巴巴前端开发工程师经典面试题

2020阿里巴巴前端开发工程师经典面试题

11、请编写一段JavaScript脚本生成下面这段DOM结构。要求:使用标准的DOM方法或属性。

2020阿里巴巴前端开发工程师经典面试题

2020阿里巴巴前端开发工程师经典面试题

12、请用CSS定义p标签,要求实现以下效果:

  1. 字体颜色在IE6下为黑色(#000000);

  2. IE7下为红色(#ff0000);

  3. 而其他浏览器下为绿色(#00ff00)。

2020阿里巴巴前端开发工程师经典面试题

13、请简化以下的CSS代码,并给出简单的说明。

2020阿里巴巴前端开发工程师经典面试题

简化

2020阿里巴巴前端开发工程师经典面试题

2020阿里巴巴前端开发工程师经典面试题

2020阿里巴巴前端开发工程师经典面试题

本文分享自微信公众号 - 前端研究所(WEBqdyjs)。
如有侵权,请联系 support@oschina.cn 删除。
本文参与“OSC源创计划”,欢迎正在阅读的你也加入,一起分享。

点赞
收藏
评论区
推荐文章
秃头王路飞 秃头王路飞
5个月前
webpack5手撸vue2脚手架
webpack5手撸vue相信工作个12年的小伙伴们在面试的时候多多少少怕被问到关于webpack方面的知识,本菜鸟最近闲来无事,就尝试了手撸了下vue2的脚手架,第一次发帖实在是没有经验,望海涵。languageJavaScript"name":"vuecliversion2","version":"1.0.0","desc
浅梦一笑 浅梦一笑
5个月前
初学 Python 需要安装哪些软件?超级实用,小白必看!
编程这个东西是真的奇妙。对于懂得的人来说,会觉得这个工具是多么的好用、有趣,而对于小白来说,就如同大山一样。其实这个都可以理解,大家都是这样过来的。那么接下来就说一下python相关的东西吧,并说一下我对编程的理解。本人也是小白一名,如有不对的地方,还请各位大神指出01名词解释:如果在编程方面接触的比较少,那么对于软件这一块,有几个名词一定要了解,比如开发环
blmius blmius
1年前
MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1
文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s
光头强的博客 光头强的博客
5个月前
Java面向对象试题
1、请创建一个Animal动物类,要求有方法eat()方法,方法输出一条语句“吃东西”。创建一个接口A,接口里有一个抽象方法fly()。创建一个Bird类继承Animal类并实现接口A里的方法输出一条有语句“鸟儿飞翔”,重写eat()方法输出一条语句“鸟儿吃虫”。在Test类中向上转型创建b对象,调用eat方法。然后向下转型调用eat()方
刚刚好 刚刚好
5个月前
css问题
1、在IOS中图片不显示(给图片加了圆角或者img没有父级)<div<imgsrc""/</divdiv{width:20px;height:20px;borderradius:20px;overflow:h
小森森 小森森
5个月前
校园表白墙微信小程序V1.0 SayLove -基于微信云开发-一键快速搭建,开箱即用
后续会继续更新,敬请期待2.0全新版本欢迎添加左边的微信一起探讨!项目地址:(https://www.aliyun.com/activity/daily/bestoffer?userCodesskuuw5n)\2.Bug修复更新日历2.情侣脸功能大家不要使用了,现在阿里云的接口已经要收费了(土豪请随意),\\和注意
晴空闲云 晴空闲云
5个月前
css中box-sizing解放盒子实际宽高计算
我们知道传统的盒子模型,如果增加内边距padding和边框border,那么会撑大整个盒子,造成盒子的宽度不好计算,在实务中特别不方便。boxsizing可以设置盒模型的方式,可以很好的设置固定宽高的盒模型。盒子宽高计算假如我们设置如下盒子:宽度和高度均为200px,那么这会这个盒子实际的宽高就都是200px。但是当我们设置这个盒子的边框和内间距的时候,那
艾木酱 艾木酱
5个月前
快速入门|使用MemFire Cloud构建React Native应用程序
MemFireCloud是一款提供云数据库,用户可以创建云数据库,并对数据库进行管理,还可以对数据库进行备份操作。它还提供后端即服务,用户可以在1分钟内新建一个应用,使用自动生成的API和SDK,访问云数据库、对象存储、用户认证与授权等功能,可专
密钥管理系统-为你的天翼云资产上把“锁
本文关键词:数据安全,密码机,密钥管理一、你的云上资产真的安全么?1.2021年1月,巴西的一个数据库30TB数据被破坏,泄露的数据包含有1.04亿辆汽车和约4000万家公司的详细信息,受影响的人员数量可能有2.2亿;2.2021年2月,广受欢迎的音频聊天室应用Clubhouse的用户数据被恶意黑客或间谍窃取。据悉,一位身份不明的用户能够将Clubho
NVIDIA安培架构下MIG技术分析
关键词:NVIDIA、MIG、安培一什么是MIG2020年5月,NVIDIA发布了最新的GPU架构:安培,以及基于安培架构的最新的GPU:A100。安培提供了许多新的特性,MIG是其中一项非常重要的新特性。MIG的全名是MultiInstanceGPU。NVIDIA安培架构中的MIG模式可以在A100GPU上并行运行七个作业。多实
helloworld_28799839 helloworld_28799839
5个月前
常用知识整理
Javascript判断对象是否为空jsObject.keys(myObject).length0经常使用的三元运算我们经常遇到处理表格列状态字段如status的时候可以用到vue