当前位置:首页 » 网页前端 » web前端实习面试
扩展阅读
webinf下怎么引入js 2023-08-31 21:54:13
堡垒机怎么打开web 2023-08-31 21:54:11

web前端实习面试

发布时间: 2023-07-13 15:20:05

Ⅰ 第一次实习面试web前端要注意些什么

我觉得去面试web前端应该会一些专业技术,要自我介绍的有特点,让面试官知道你是干什么的,都会那些东西,不要紧张,要注意礼貌,个人卫生一定要搞好,只要你有web的实力,相信面试官会让你通过的。

Ⅱ 常见的web前端面试题及答案分享

1、 说下行内元素和块级元素的区别?行内块元素的兼容性使用?(IE8 以下)


答:行内元素:会在水平方向排列,不能包含块级元素,设置width无效,height无效(可以设置line-height),margin上下无效,padding上下无效。块级元素:各占据一行,垂直方向排列。从新行开始结束接着一个断行。兼容性:display:inline-block;*display:inline;*zoom:1。



2、box-sizing常用的属性有哪些?分别有什么作用?


答:box-sizing: content-box|border-box|inherit。content-box:宽度和高度分别应用到元素的内容框。在宽度和高度之外绘制元素的内边距和边框(元素默认效果)。


border-box:元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。通过从已设定的宽度和高度分别减去边框和内边距才能得到内容的宽度和高度。


3、Doctype作用?标准模式与兼容模式各有什么区别?


答:告知浏览器的解析器用什么文档标准解析这个文档。DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现。


标准模式的排版和JS运作模式都是以该浏览器支持的最高标准运行。在兼容模式中,页面以宽松的向后兼容的方式显示,模拟老式浏览器的行为以防止站点无法工作。


4、html5有哪些新特性?如何处理HTML5新标签的浏览器兼容问题?如何区分 HTML 和 HTML5?


答:HTML5 现在已经不是 SGML 的子集,主要是关于图像,位置,存储,多任务等功能的增加。


(1)绘画 canvas;


(2)用于媒介回放的 video 和 audio 元素;


(3)本地离线存储 localStorage 长期存储数据,浏览器关闭后数据不丢失;


(4)sessionStorage 的数据在浏览器关闭后自动删除;


(5)语意化更好的内容元素,比如 article、footer、header、nav、section;


(6)表单控件,calendar、date、time、email、url、search;


(7)新的技术webworker, websocket, Geolocation;


IE8/IE7/IE6支持通过document.createElement方法产生的标签,可以利用这一特性让这些浏览器支持HTML5新标签,浏览器支持新标签后,还需要添加标签默认的样式。当然也可以直接使用成熟的框架、比如html5shim。


以上就是环球青藤小编关于web前端面试题的相关分享,希望对大家有所帮助,想要了解更多相关内容,请及时关注本平台并进行查看!

Ⅲ web前端面试经常问到的面试题有哪些

  • 1、 列举web性能优化?

  • 1)
    减少http请求次数。合并文件、利用css sprite把零散的图片整合到一张图上。

  • 2)
    减少DNS查找。

  • 3)
    减少从定向。

  • 4)
    响应时间。使用AJAX进行缓存,减少http请求。

  • 5)
    延迟载入组件.

  • 6)
    预载入组件。

  • 7)
    减少节点的数量。

  • 8)
    切分组件到多个域。

  • 9)
    最小化iframe。

  • 10)
    杜绝http404错误。

  • 2、 介绍一下XMLHttpRequest对象的常用方式和属性?

  • open(“method”,”URL”) 建立对服务器的调用,第一个参数是HTTP请求方式

  • 可以为GET,POST或任何服务器所支持的您想调用的方式。

  • 第二个参数是请求页面的URL。

  • send()方法,发送具体请求

  • abort()方法,停止当前请求

  • readyState属性 请求的状态 有5个可取值 0=未初始化 ,1=正在加载

  • 2=以加载,3=交互中,4=完成

  • responseText 属性 服务器的响应,表示为一个串

  • reponseXML 属性 服务器的响应,表示为XML

  • status 服务器的HTTP状态码,200对应ok 400对应not found

Ⅳ web前端开发面试流程是怎样的

首先投简历,等待hr通知面试,一般情况下先填资料,做测试题,接着开始第一面(一般问经你的个人情况,工作经历等),资料已经交给技术,等一面通过之后接着二面,二面一般是技术面试,问你开发相关的技术问题(例如布局问题,js,框架之类的),有些公司还需要上机操作(写一两个页面或者开发一个js方法等),有些公司是通过之后直接进行3面有些是改天再进行3面,3面一般就是项目经理或总经理问你一些各种各样的问题(随机应变就行,也有一些公司没有这个环节),如果3面都过了,基本上就是面试成功了,接下来就是4面,也就是人事主管和你谈工资待遇等问题了,这个谈好之后就会告诉你什么时候过来上班,要准备什么东西,当然一般还会有正式的工作邀请函发到你的邮箱。如果没有3面的公司,那人事这个环节就直接是3面了。
还有一些公司是一面之后等通知,通过的就通知你二面,然后再等通知,然后通过再三面(这样的公司我一般不会等,太浪费时间)

Ⅳ Web前端5道面试题

1.请说明ECMAScript,JavaScript,Jscript之间的关系?

ECMAScript提供脚本语言必须遵守的规则、

细节和准则,是脚本语言的规范。

比如:ES5,ES6就是具体的一js版本。

JavaScript是ECMAScript的一个分支版本,

JavaScript实现了多数ECMA-262中

描述的ECMAScript规范,但存在少数差异。

JScript是微软公司对ECMA-262语言规范的

一种实现,除了少数例外(这是为了保持向后兼容),

微软公司宣称JScript完全实现了ECMA标准.

关系:

JavaScript和JScript都是ECMAScript的版本分支,

二者在语法上没有多大的区别;

只不过一个是NetScape公司的,一个是微软的;

IE系列默认是JScript,其它的则反之用JavaScript。


2.页面加载过程中可能触发哪些事件?它们的顺序是?

页面加载时,大致可以分为以下几个步骤:1)开始解析HTML文档结构2)加载外部样式表及JavaScript脚本3)解析执行JavaScript脚本4)DOM树渲染完成5)加载未完成的外部资源6)页面加载成功

执行顺序:1)documentreadystatechange事件2)documentDOMContentLoaded事件3)windowload事件


3.函数中在声明变量a前使用a会产生错误吗?为什么?

不会,JS中能够进行变量作用域提升,

把所有变量、函数的声明提升到当前

作用域的最前面,但不进行赋值操作;

所以可能造成获取的值是undefined。


4.什么是hash,以及hashchange事件?

先了解下什么是hash:hash即URL中"#"字符后面的部分。

a)使用浏览器访问网页时,

如果网页URL中带有hash,

页面就会定位到id(或name)

与hash值一样的元素的位置;

b)hash还有另一个特点,

它的改变不会导致页面重新加载如橡尺;

c)hash值浏如清览器是不会随请求发送到服务器端的;

d)通过window.location.hash属性获取和设置hash值。

window.location.hash值的变化会直渣高接

反应到浏览器地址栏(#后面的部分会发生变化),同时,浏览器地址栏hash值的变化也会触发

window.location.hash值的变化,

从而触发onhashchange事件。

再来了解下什么是hashchange事件:

a)当URL的片段标识符更改时,

将触发hashchange事件(跟在#符号后面的URL部分,包括#符号)b)

hashchange事件触发时,

事件对象会有hash改变前的URL(oldURL)和hash改变后的URL(newURL)两个属性。


5.什么是CDN,CDN对于网站有什么意义,它有什么样的缺点?

CDN又称为内容分发网络;本意在于

尽可能避开互联网上有可能影响数据

传输速度和稳定性的瓶颈和环节,

使内容传输的更快、更稳定。

主要目的:

解决因分布、带宽、服务器性能带来的访问延迟问题,

适用于站点加速、点播、直播等场景。

使用户可就近取得所需内容,解决Internet网络拥挤的状况,

提高用户访问网站的响应速度和成功率。

缺点:

a)实施复杂,投资大;

b)目前大部分的CDN还只是对静态内容加速,

对动态加速效果不好;

而双线对动态加速的效果跟静态是一样的。

Ⅵ Web 前端面试

博客园整理了一下,有好的面试题欢迎大家发在评论区哟
1. 闭包
2. 数组去重
3. 原型和原型链
4. call,apply,bind三者的区别?
5. 请介绍常见的 HTTP 状态码(至少五个)
6. 深浅拷贝
7. 实现(5).add(3).minus(2)输出6
8. null和undefined区别
9. MVC和MVVC?
10. Vue生命周期
11. Vue数据双向绑定原理
12. Vue组件传参
13. 说说各浏览器存在的兼容问题
14. router和route
15. active-class属于Vue哪一个moles,有什么作用
16. v-if和v-show
17. computed和watch有什么区别
18.Vue 组件中 data 为什么必须是函数
19. vue中子组件调用父组件的方法
20. vue中 keep-alive 组件的作用
21. vue中如何编写可复用的组件?
22. Vue 如何去除url中的 #
23. Vue 中 key 的作用
24. Vue 中怎么自定义指令
25. Vue 中怎么自定义过滤器
26. NextTick 是做什么的
27. Vue 组件 data 为什么必须是函数
28. 计算属性computed 和事件 methods 有什么区别
29. scoped(死够扑的)
30. vue如何获取dom?
31. promise
32. vue常用指令有哪些
33.vue-loader是什么?使用和用途?
34.css样式局部化,如何让css只在当前组件起作用?scss和stytus样式穿透

闭包指有权访问另一个函数中变量的函数,
MDN: https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Closures
B站视频: https://www.bilibili.com/video/BV1YJ411R7ap?from=search&seid=18157596230752413126

https://www.jianshu.com/p/9c3547450a52

https://search.bilibili.com/all?keyword=%E5%8E%9F%E5%9E%8B%E9%93%BE%20%E9%BB%91%E9%A9%AC

都是用来改变this指向的

call和apply都是function原型上的方法,每一个函数作为function的实例都可以调用这两个方法,而这两个方法都是用来改变this指向的

一般情况下this指向其调用者()

fun.call(thisArg,arg1,ary2,...)
主要作用可以实现继承
调用函数,改变this指向

继承

fun.apply(thisArg,[argsArray])

作用:调用函数,改变函数内部this指向
参数必须是数组
apply主要应用于借助数学对象等

bind()方法不会调用函数,但可以改变函数内部this指向
fun.bind(thisArg,arg1,arg2,...)
thisArg:在fun函数运行时指定的this值
arg1,arg2:传递的其他参数
返回由指定的this值和初始化参数改造的原函数拷贝

call的性能要比apply好一些,尤其当传递参数超过3个,后期开发可多用call

时间测试

状态码是由 3 位数组成,第一个数字定义了响应的类别,且有五种可能取值:

1xx:指示信息–表示请求已接收,继续处理。

2xx:成功–表示请求已被成功接收、理解、接受。

3xx:重定向–要完成请求必须进行更进一步的操作。

4xx:客户端错误–请求有语法错误或请求无法实现。

5xx:服务器端错误–服务器未能实现合法的请求。

阮一峰: http://www.ruanyifeng.com/blog/2014/03/undefined-vs-null.html

MVC 是后端中的概念

MVVC中 是前端概念

最终实现V和M数据的同步,因此开发者只需关注业务逻辑,不需要手动操作Dom,mvvm是vue的核心

这两个不同的结构可以看出两者的区别,他们的一些属性是不同的。

active-class 属于vue-router的样式方法
当routerlink标签被点击时将会应用这个样式

使用有两种方法
routerLink标签内使用

在使用时会有一个Bug
首页的active会一直被应用
解决办法
为了解决上面的问题,还需加入一个属性exact,类似也有两种方式:
在router-link中写入exact

在路由js文件,配置active-class

还可以不用exact这种方法去解决,例如

首页
路由中加入重定向

computed

computed是计算属性,也就是计算值,它更多用于计算值的场景
computed具有缓存性,computed的值在getter执行后是会缓存的,只有在它依赖的属性值改变之后,下一次获取computed的值时重新调用对应的getter来计算
computed适用于计算比较消耗性能的计算场景
watch

watch更多的是[观察]的作用,类似于某些数据的监听回调,用于观察props $emit或者本组件的值,当数据变化时来执行回调进行后续操作
无缓存性,页面重新渲染时值不变化也会执行
小结

当我们要进行数值计算,而且依赖于其他数据,那么把这个数据设计为computed
如果你需要在某个数据变化时做一些事情,使用watch来观察这个数据变化。

去这里看一下​blog.csdn.net

vue-router 默认使用 hash 模式,所以在路由加载的时候,项目中的 url 会自带 #。如果不想使用 #, 可以使用 vue-router 的另一种模式 history

new Router({
mode: 'history',
routes: [ ]
})

需要注意的是,当我们启用 history 模式的时候,由于我们的项目是一个单页面应用,所以在路由跳转的时候,就会出现访问不到静态资源而出现 404 的情况,这时候就需要服务端增加一个覆盖所有情况的候选资源:如果 URL 匹配不到任何静态资源,则应该返回同一个 index.html 页面

具体参考 官方API

参考 官方文档-自定义指令

过滤器也同样接受全局注册和局部注册

具体可参考官方文档 深入响应式原理

我们可以将同一函数定义为一个 method 或者一个计算属性。对于最终的结果,两种方式是相同的

不同点:

让css只在当前组件中起作用

Ⅶ 面试前端实习生需要什么条件

最好的方法就是去招聘网站上看看前端实习生的要求和职责,按照企业的需求来,一般都不会错,摘录了一个前端岗的招聘需求,照这个来准备就差不错了,当然实习生可能要求没这么高,大致差不多:

工作职责:

. 根据开发进度和任务分配,完成相应页面的开发、编程任务;

. 协助团队完成相关的测试、上线运营工作;

. 优化代码并保持良好的浏览器兼容性;

. 良好的编码能力和习惯,能书写适当的注释、文档。

职位要求:

. 有静态开发加代码管理经验;

. 熟悉 HTML/CSS/JavaScript 等 Web 前端开发技术 ;

. 具有良好逻辑思考能力,良好的沟通能力和团队协作精神,有较强学习能力。

Ⅷ web前端面试怎么说

面试方法

  • 代码编写笔试

  • 问答式

  • 过程遵循 STAR 面试法 。

    校招和社招的是不一样的,校招会更加关注基础知识,而社招会更加关注之前做过的项目情况。


    项目相关

    面试其实说白了就是根据一个人之前的经历,来判断出后续这人会做得怎样,如果你之前从没做成过一件事情,凭什么让别人相信你之后能做成呢?因此无论哪里的面试都会问你之前做过的项目

    项目可以是多人协助开发一个产品,也可以是自己个人做过的业余应用,只需介绍 1、2 个就够了,需要注意的是 1 + 1 != 2,做了两个平庸的项目不如做了一个好项目。

    一般来说会问如下几方面的问题:

  • 做过最满意的项目是什么?

  • 项目背景

  • 为什么要做这件事情?

  • 最终达到什么效果?

  • 你处于什么样的角色,起到了什么方面的作用?

  • 在项目中遇到什么技术问题?具体是如何解决的?

  • 如果再做这个项目,你会在哪些方面进行改善?

  • 技术相关 - 1 面

    技术一面主要判断对基础知识的掌握

  • 描述一个你遇到过的技术问题,你是如何解决的?

  • 这个问题很常见,有没有遇到过很不常见的问题?比如在网上根本搜不到解决方法的?

  • 是否有设计过通用的组件?

  • 请设计一个 Dialog(弹出层) / Suggestion(自动完成) / Slider(图片轮播) 等组件

  • 你会提供什么接口?

  • 调用过程是怎样的?可能会遇到什么细节问题?

  • 技术二面主要判断技术深度及广度

  • 你最擅长的技术是什么?

  • 你觉得你在这个技术上的水平到什么程度了?你觉得最高级别应该是怎样的?

  • 浏览器及性能

  • 这些优化方法背后的原理是什么?

  • 除了这些常规的,你还了解什么最新的方法么?

  • (这个问既考察技术深度又考察技术广度,其实要答好是相当难的,注意越详细越好)

  • 一个页面从输入 URL 到页面加载完的过程中都发生了什么事情?越详细越好

  • 谈一下你所知道的页面性能优化方法?

  • 如何分析页面性能?

  • 其它

  • 除了前端以外还了解什么其它技术么?

  • 对计算机基础的了解情况,比如常见数据结构、编译原理等

  • 兴趣相关

  • 最近在学什么?接下来半年你打算学习什么?

  • 做什么方面的事情最让你有成就感?需求设计?规划?具体开发?

  • 后续想做什么?3 年后你希望自己是什么水平?

  • 主动性相关

  • 在之前做过的项目中,有没有什么功能或改进点是由你提出来的?

  • 是否有参与和改进其它开源项目