hello,大家好,我是拾光。
今天给大家分享一些前端工程师面试时,面试官可能会考你的问题;
给大家参考一下,如果觉得好,可以收藏下来或者关注我,以便于下次浏览;
由于面试题也很多,今天给大家整理一部分,我可能不会连载着发布文章,但是标题我已经编号了,后期我也会陆续的搜集一些面试材料,希望前端工程师们面试时能够游刃有余的解决大部分问题。
谢谢大家;
打开网易新闻 查看更多精彩图片 >
a) ul、ol、dl的区别?
b) div、section、article的区别?
a:ul是无序列表,ol是有序列表,dl是定义列表有层次关系。
b: div section article ,语义是从无到有,逐渐增强的。
div 无任何语义,仅仅用作样式化或者脚本化的钩子(hook)
section是有一定语义的div,适合有主题性的内容,表示一个专题,一般有标题,但是不可以乱用。只有内容明确需要出现在大纲中时才会使用。
artical是更特殊的section,他是一个独立完整的内容块。比如用在文章,评论等。
二、html5对input新增了哪些高级属性?(5分)number,date,color,range,datetime,email,tel,range,search等
三、每题都需回答(15分)
a) 如何用CSS控制文本单行溢出省略?并且大致说出多行省略的思路。
b) 谈谈响应式布局?
c) CSS3有哪些高级选择器?
a:css实现单行溢出省略是利用text-overflow:ellipsis,white-space:nowrap和overflow:hidden属性实现的。(新版主流浏览器测试通过)
多上省略:适用于webkit内核和移动端
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;
b:响应式布局就是一个网站能够兼容多个终端,而不是为每个终端做一个特定的版本。 这个概念是为解决移动互联网浏览而诞生的。html5也因此加入了媒体查询等一系列针对响应式布局的新元素。
c:css有属性选择器{E[att$='val'],E[att~='val'],E[att^='val']}
伪类选择器{E:not(),E:last-child,E:only-child,E:nth-child(n),E:nth-last-child(),E:empty}
伪对象选择器{E::selection}
关系选择器{E~F}
四、请逐一解释他们:Node.js、React Native、Angular.js、Grunt/Gulp、Webpack、Git、JSONP(10分)
Node.js: Node.js是一个基于Chrome JavaScript运行时建立的平台, 用于方便地搭建响应速度快、易于扩展的网络应用。Node.js 使用事件驱动, 非阻塞I/O 模型而得以轻量和高效,非常适合在分布式设备上运行的数据密集型的实时应用。
React Native: React Native 结合了 Web 应用和 Native 应用的优势,可以使用 JavaScript 来开发 iOS 和 Android 原生应用。在 JavaScript 中用 React 抽象操作系统原生的 UI 组件,代替 DOM 元素来渲染等。
Angular.js: AngularJS诞生于2009年,由Misko Hevery 等人创建,后为Google所收购。是一款优秀的前端JS框架,已经被用于Google的多款产品当中。AngularJS有着诸多特性,最为核心的是:MVVM、模块化、自动化双向数据绑定、语义化标签、依赖注入等等。
Grunt/Gulp:自动构建系统,开发者可以使用它在网站开发过程中自动执行常见任务。
Webpack: 是一个模块打包工具,你可以使用WebPack管理你的模块依赖,并编绎输出模块们所需的静态文件。
Git: Git是一款免费、开源的分布式版本控制系统,用于敏捷高效地处理任何或小或大的项目。·
JSONP: 为了便于客户端使用数据,逐渐形成了一种非正式传输协议,人们把它称作JSONP,该协议的一个要点就是允许用户传递一个callback参数给服务端,然后服务端返回数据时会将这个callback参数作为函数名来包裹住JSON数据,这样客户端就可以随意定制自己的函数来自动处理返回数据了。
五、分别说出下述输出结果(15分)a) var a, b = 0, fn = function(){
var a = b = 2;
};
fn();console.log(a, b);//(undefined,2)
b) var b = {a: 1}[0]; //b的值 undefined var b={a:1}['a']输出1
c) !function(){
this.length = 10; var fn = function(){ console.log(this.length); //输出多少? 输出2 this是arr
}, arr = [fn, 'hello layui'];
fn.length = 100;
arr[0]();
}();
六、封装一个cont方法,能实现如此调用:cout(a)(b)(c)(d)(e)… 并且返回的值为参数连剩的结果,即abcde*…。如cout(1)(3)(7) 得到21 (15分)
var init=0; //设置一个全局变量
var muti=function(m)
{
init=init*m;
return muti
}
muti.toString=function() //这是关键的一步 { return init;
} function count(m) //最终我们要调用的函数 {
init=m ;// 初始化,否则init是0,那么永远乘 都是 0,也是很关键的一步
return muti;//最终返回的是 元对象(不是实例化过后的对象哦)
}
alert(count(3)(4)(5))
再次感谢大家阅读,希望大家多多支持。
意见与建议可在下方评论~