经典面试题(servlet,js,逻辑题)

经典面试题(servlet,js,逻辑题)
经典面试题(servlet,js,逻辑题)

很显然,Servlet/JSP的WEB前端动态制作的重要性比HTML/CSS/JS 的价值高很多,但我们都知道他们都是建立在HTML服务器端的技术规范,JSP是一种动态页面生成的技术,标签库的应用很广泛,面试遇到的几率也很大,而且对于比较复杂的页面,使用JSP来编写,更容易编写和维护。

本章主要分析:简单的 JSP/Servlet 方式和内容、 Java 面试逻辑题

每天学一点,日积月累,四个月后的今天,你一定会有很大的收获!

全程将为大家剖析几大部分内容,由于学习经验有限,望大家谅解并接受宝贵的意见:

基础概念部分★★:常出现的高频率单词的区别理解(异常、静态、抽象、接口、集合等);

深入理解部分★★★★:重点掌握的面向对象的理论知识(对象、排序、字节字符流);

线程编程部分★★★★★:单独讲解线程概念、同异步实现方法及关系、线程锁等;

数据库理论归纳★★★★:总结PL/SQL语句,使用方法,归纳基本公式,深层次内容有待开发。

JDBC和XML部分★★★:重点分析XML的技术构成、应用方面的形式和区别。

Servlet 部分★★★★★:重点掌握生命周期和会话跟踪技术的知识点和一般的实现方法。

J S P 部分★★★★:对象、动作的分类和区别,跳转方法以及动静态include的区别。

JAVA笔试逻辑题★★:逻辑题目的考验,目前企业应用也比较广泛,稍微了解下。

Servlet方面:

1、说一说Servlet的生命周期? ★★★★★

答:

servlet有良好的生存期的定义,包括加载和实例化、初始化、处理请求以及服务结束。

这个生存期由javax.servlet.Servlet接口的init,service和destroy方法表达。

2、servlet的生命周期

答:

web容器加载servlet,生命周期开始。通过调用servlet的init()方法进行servlet的初始化。

通过调用service()方法实现,根据请求的不同调用不同的do***()方法。

结束服务,web容器调用servlet的destroy()方法。

3、Servlet的基本架构

public class ServletName extends HttpServlet {

public void doPost(HttpServletRequest request, HttpServletR esponse response)

throws

ServletException, IOException {

}

public void doGet(HttpServletRequest request, HttpServletRe sponse response)

throws

ServletException, IOException {

}

}

4、什么情况下调用doGet()和doPost()?

答:Jsp页面中的form标签里的method属性为get时调用doGet(),为post时调用doPost()。

5、如何现实servlet的单线程模式★★

答:<%@ page isThreadSafe="false"%>

6、页面间对象传递的方法

答:request,session,application,cookie等

7、JSP和Servlet有哪些相同点和不同点,他们之间的联系是什么?

答:JSP是Servlet技术的扩展,本质上是Servlet的简易方式,更强调应用的外表表达。JSP编译后是"类servlet"。Servlet和JSP最主要的不同点在于,Servlet的应用逻辑是在Java文件中,并且完全从表示层中的HTML里分离开来。而JSP的情况是Java和HTML 可以组合成一个扩展名为.jsp的文件。JSP侧重于视图,Servlet主要用于控制逻辑。

8、四种会话跟踪技术(重要考点)★★★★★

答:会话作用域ServletsJSP 页面描述

page是代表与一个页面相关的对象和属性。

一个页面由一个编译好的 Java servlet 类(可以带有任何

的 include 指令,但是没有 include 动作)表示。

这既包括 servlet 又包括被编译成 servlet 的 JSP 页面。

request是代表与 Web 客户机发出的一个请求相关的对象和属性。一个请求可能跨越多个页面,涉及多个 Web 组件(由于 forward 指令和 include 动作的关系)。

session是代表与用于某个 Web 客户机的一个用户体验相关的对象和属性。一个 Web 会话可以也经常会跨越多个客户机请求。application是代表与整个 Web 应用程序相关的对象和属性。这实质

上是跨越整个 Web 应用程序,包括多个页面、请求和会话的一个全局作用域。

9、Servlet执行时一般实现哪几个方法?★★★★★

答:

public void init(ServletConfig config)

public ServletConfig getServletConfig()

public String getServletInfo()

public void service(ServletRequest request,ServletResponse respo nse)

public void destroy()

JSP方面:

1、jsp是如何执行的?

答:阶段一:容器要将JSP文件转换成一个对应的servlet类

html(css,javascript)--> service方法里,用 out.write输出(write方法会将null转换为" ")。

<% Java代码 %> jsp代码片段 --> 把service方法里的内容,照搬过来。

<%= Java表达式 %>也会放到service方法里,使用out.print 输出。

<%! %>给Servlet添加新的属性或者新的方法(转成.java文件后,声明内的部分添加在service方法之外)。

这样就把一个JSP变成了一个Servlet容器

注意事项:out.writer方法只能输出简单的字符串,对象是没法输出的。优点是把null自动转换成空字符串输出。

如: <% out.println(new Date()); %> 不能用writer

阶段二:容器会将servlet编译、实例化、初始化、然后执行service方法。(实例化、初始化、就绪、销毁)

2、指令?

1)指令是什么

通知容器,在将.jsp文件转换成.java文件时,作一些额外的处理,比如导包。

2)指令的语法

<%@ 指令名称属性名=属性值 %>

3)page指令

import属性:导包。

例如:<%@page import="java.util.*"%>

如: <%@page import="java.util.*,

java.text.*" %> contentType属性:设置response.setCharacterEncoding()的内容。

pageEncoding属性:告诉容器JSP文件的编码格式。

如: <%@page contentType="text/html;charset=utf-8" pageEncoding="utf-8" %>

4)如何转发

step1:绑定数据到requset:request里有个HashMap。

request.setAttribute(String name,Object obj);//name:绑定名。obj:绑定值。

另一个方法获取绑定值:

Object request.getAttribute(String name);//如果绑定对象的值不存在,会返回null

step2:获得一个转发器:url:要转发给哪一个Web组件 RequestDispatcher rd=request.getRequsetDispatcher(Stri ng url);

step3:转发

rd.forward(request,response);//JSP和Servlet会共享相同的请求和响应对象

step4:在转发的目的地,可以使用request.getAttribute方法获得绑定的数据,然后进行处理。

3、jsp有哪些内置对象?作用分别是什么? ★★★

答:JSP共有以下9种基本内置组件(可与ASP的6种内部组件相对

应):

request 用户端请求,此请求会包含来自GET/POST请求的参数response 网页传回用户端的回应

pageContext 网页的属性是在这里管理

session 与请求有关的会话期

application servlet 正在执行的内容

out 用来传送回应的输出

config servlet的构架部件

page JSP网页本身

exception 针对错误网页,未捕捉的例外

4、jsp有哪些动作?作用分别是什么? ★★★★★

答:JSP共有以下6种基本动作

jsp:include:在页面被请求的时候引入一个文件。

jsp:useBean:寻找或者实例化一个JavaBean。

jsp:setProperty:设置JavaBean的属性。

jsp:getProperty:输出某个JavaBean的属性。

jsp:forward:把请求转到一个新的页面。

jsp:plugin:根据浏览器类型为Java插件生成OBJECT或EMBED标记

5、JSP中动态INCLUDE与静态INCLUDE的区别?

答:动态INCLUDE用jsp:include动作实现

它总是会检查所含文件中的变化,适合用于包含动态页面,并且可以带参数

静态INCLUDE用include伪码实现,定不会检查所含文件的变化,适用于包含静态页面

<%@ include file="included.htm" %>

6、两种跳转方式分别是什么?有什么区别? ★★★★★

答:有两种,分别为:

前者页面不会转向include所指的页面,只是显示该页的结果,主页面还是原来的页面。执行完后还会回来,相当于函数调用。并且可以带参数.后者完全转向新页面,不会再回来。相当于go to 语句。

Java笔试逻辑题:

1.一个11L的杯子一个7L的杯子怎么量出2L的水?

解析:

11L装满,往7L的倒,把7L倒满,剩4L,吧7L的倒空;

4L倒进7L里,11L装满再往7L倒,倒满,剩8L;

7L清空,8L倒进去,得到1L;

1L和7L得到6L;

6L和11L得到5L;

5L和7L得到2L。

反过来在 7L里装满往 11L里倒,道理是一样的!

同类题比较:

假设有一个池塘,里面有无穷多的水。现有2个空水壶,容积分别为5升和6升。

问题是如何只用这2个水壶从池塘里取得3升的水。

2.飞机问题

每架飞机只有一个油箱,一箱油可以飞地球半圈。飞机间可以相互加油,所有飞机从同一个机场起飞。

要想使一架飞机安全飞地球一圈,回到起飞的机场。需要至少出动几架飞机。

解析:

6架足矣。

3架飞机A、B、C同时起飞,同向而行。

飞至1/8航程(绕地球一周)处,正好耗去1/4燃油,其中1架飞机A将2×1/4油箱燃油分加至的飞机B、C油箱中,然后带1/4燃油正好能安全返航。

此时飞机B、C油箱是满的。

剩下2架飞机继续飞行1/8航程,也就是1/4航程处,此时飞机B、C还有3/4油箱的燃油。飞机B将1/4油箱的燃油加至飞机C,飞机B 剩下1/2油箱燃油返航,

飞机C为满油箱,继续做环球飞行,能飞至3/4航程处。

飞机C飞至1/2航程处,由同一机场同时起飞3架飞机D、E、F,与飞机A、B、C反方向飞行。

飞机D、E、F逆向飞行1/8航程时,飞机D将2×1/4油箱燃油分加至飞机E、F中返航,飞机E、F为满油箱,再向前1/8航程,

也就是逆向的1/4航程、正向的3/4航程处,正好与做环球飞行的飞机C汇合,飞机C燃油已耗尽,飞机E、F都还有3/4油箱燃油,

两飞机分别将1/4油箱燃油加给飞机C,并同飞机C一起返回机场,此时飞机C、E、F同为1/2油箱燃油,正好能飞完剩下的1/4航程。

如果飞机D、E、F不同时起飞,还可以节约一些燃油,但起飞飞机架次一样。

3.几段不规则的绳子,每个绳子燃烧时间都是60S,怎么计算15S。解析:

一根绳从两头同时点着燃烧完时间是30秒

过程如下:将一根绳子两端记为a b 另一根两端记为c d

同时点着a b c,第一根烧完的时候时间过去了30秒,此时将第二根熄灭。

这样剩下的半根绳子就是30秒

要得到15秒只需将剩下这一半的两端点着,烧完的时间就是15秒。

4.一群人参加聚会,每人头上戴一顶帽子,只能看见别人的帽子,看不见自己的帽子,帽子只有黑、白两种颜色。

黑帽子不少于1顶,主持人说。我们玩个游戏,一会儿我关灯,认为自己头上戴的是黑帽子的,扇自己一巴掌。

第一次关灯,没有声音。第二次,还是没声音。第三次关灯,才有噼里啪啦的声音。问有多少人参加聚会。

解析:

第一次关灯没人拍手说明不是黑帽子不止一个.如果只有一个,那戴黑帽子就会拍手,因为他看到的都是戴白帽子的。

如果是两个那么第二次关灯的时候。戴黑帽子A只会看到戴黑帽子B 一个戴黑色的帽子,这带黑帽子A确定自己也是戴黑帽子。

但是他们看到的不只只有一个戴黑帽子的.

第三次关灯有人拍手说明只有三个人戴黑帽子。因为戴黑帽子的只看到两个人戴黑帽子,而如果只有两个人戴黑帽子,那么第二次关灯就应该拍手了。

所以只有三个人戴黑帽子。

同类题比较:

一个教授逻辑学的教授,有三个学生,而且三个学生均非常聪明!

一天教授给他们出了一个题,教授在每个人脑门上贴了一张纸条并告诉他们,每个人的纸条上都写了一个正整数,且某两个数的和等于第三个!(每个人可以看见另两个数,但看不见自己的)

教授问第一个学生:你能猜出自己的数吗?回答:不能,问第二个,不能,第三个,不能,再问第一个,不能,第二个,不能,第三个:我猜出来了,是144!教授很满意的笑了。请问您能猜出另外两个人的数吗?

解析:

前两个一个是48 一个是96 第三个是144

1 每个人虽然猜不出自己的数字但是心里会有两个答案自己的数字是这两个答案中的一个(心里的两个数字是另外两人的数字之和与数字之差)

2 如果在教授第一轮询问三个人三个人都猜不到的情况下由此说明三个数字各不相同因为假如有两个是相同的话

就会有人能猜出自己的数字(三个数字都是正整数,不会是0,所以如果有两个相同的数,

除了两个相同的数字以外的第三个人肯定知道自己的数字不是另外两数之差,是两数之和)

3 第二轮询问中第三个说猜出了自己的数字是14

4 由此说明他排除了心中两个答案之一确定了剩下的一个是正确数字

那么排除自己心中两个答案中错误的一个肯定是因为他知道了自己的数字只能是另外两个数之和并不是另外两数之差

否定了两数之差的可能性是根据“2”

那么前两数之差肯定是和前两数中的一个相等那么由此可知前两数和为144 并且一个是另一个的二倍

4 列出方程x+y=144 x=2y 得知 x=96 y=48 。

Javascript笔试题及答案

Javascript面试笔试题 考试时间90分钟 一、不定项选择题(每题3分,共30分) 1.声明一个对象,给它加上name属性和show方法显示其name值,以下代码中正确的是 ( D ) A.var obj = [name:"zhangsan",show:function(){alert(name);}]; B.var obj = {name:"zhangsan",show:”alert”}; C.var obj = {name:"zhangsan",show:function(){alert(name);}}; D.var obj = {name:"zhangsan",show:function(){alert;}}; 2.以下关于Array数组对象的说法不正确的是( CD) A.对数组里数据的排序可以用sort函数,如果排序效果非预期,可以给sort函数加 一个排序函数的参数 B.reverse用于对数组数据的倒序排列 C.向数组的最后位置加一个新元素,可以用pop方法 D.unshift方法用于向数组删除第一个元素 3.要将页面的状态栏中显示“已经选中该文本框”,下列JavaScript语句正确的是( A ) A.="已经选中该文本框" B.="已经选中该文本框" C.="已经选中该文本框" D.="已经选中该文本框" 4.点击页面的按钮,使之打开一个新窗口,加载一个网页,以下JavaScript代码中可行 的是( AD) A. B. C. D.

5.使用JavaScript向网页中输出

hello

,以下代码中可行的是( BD) A. B. C. D.

html+css+js面试题

html+css+js面试题 87 . 如何求得2和4中最大的数? A) Math.ceil(2,4) B) Math.max(2,4) C) ceil(2,4) D) top(2,4) 88 . 打开名为“window2”的新窗口的JavaScript语法是? A) open.new("https://www.360docs.net/doc/9414483310.html,","window2") B) window.open("https://www.360docs.net/doc/9414483310.html,","window2") C) new("https://www.360docs.net/doc/9414483310.html,","window2") D) new.window("https://www.360docs.net/doc/9414483310.html,","window2") 89 . 如何在浏览器的状态栏放入一条消息? A) statusbar = "put your message here" B) window.status = "put your message here" C) window.status("put your message here") D) status("put your message here") 90.下列不属于文档对象的方法的是() A)createElement B)getElementById C)getElementByName D)forms.length 91.下面这段代码运行的结果() A)弹出一个对象框 B)没有任何输出 C)在文档中显示文档最后修改的时间

前端开发的面试题

前端开发的面试题 web前端面试题 以下是收集一些面试中经常会遇到的经典面试题以及自己面试过程中无法解决的问题,通过对知识的整理以及经验的总结,重新巩固自身的前端基础知识。 1.对WEB标准以及W3C的理解与认识 标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件,容易维护、改版方便,不需要变动页面 内容、提供打印版本而不需要复制内容、提高网站易用性; 2.xhtml和html有什么区别 HTML是一种基本的WEB语言,XHTML是一个基于XML的置标语言 最主要的不同: XHTML 元素必须被正确地嵌套。 XHTML 元素必须被关闭。 标签名必须用小写字母。 XHTML 文档必须拥有根元素。 3.Doctype? 严格模式与混杂模式-如何触发这两种模式,区分它们有何意义? 用于声明文档使用那种规范(html/Xhtml)一般为严格过度基于框架的html文档 加入XMl声明可触发,解析方式更改为IE5.5 拥有IE5.5的bug 4.行内元素有哪些?块级元素有哪些?CSS的盒模型? 块级元素:div p h1 h2 h3 h4 form ul 行内元素: a b br i span input select Css盒模型:内容,border ,margin,padding 5.CSS引入的方式有哪些? link和@import的区别是?

内联内嵌外链导入 区别:同时加载 前者无兼容性,后者CSS2.1以下浏览器不支持 Link 支持使用script改变样式,后者不可 6.CSS选择符有哪些?哪些属性可以继承?优先级算法如何计算?内联和important哪个优先级高? 标签选择符类选择符 id选择符 继承不如指定 Id>class>标签选择 后者优先级高 7.前端页面有哪三层构成,分别是什么?作用是什么? 结构层 Html 表示层 CSS 行为层 js 8.css的基本语句构成是? 选择器{属性1:值1;属性2:值2;……} 9.你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么? Ie(Ie内核) 火狐(Gecko) 谷歌(webkit) opear(Presto) 10.写出几种IE6 BUG的解决方法 1.双边距BUG float引起的使用display 2.3像素问题使用float引起的使用dislpay:inline -3px 3.超链接hover 点击后失效使用正确的书写顺序 link visited hover active 4.Ie z-index问题给父级添加position:relative 5.Png 透明使用js代码改 6.Min-height 最小高度 !Important 解决’ 7.select 在ie6下遮盖使用iframe嵌套

前端工程师面试题题及答案(全面综合)

1. 要动态改变层中内容可以使用的方法有(AB ) a)innerHTML b)innerText c)通过设置层的隐藏和显示来实现 d)通过设置层的样式属性的display属性 2. 在javascript里,下列选项中不属于数组方法的是(B); a)sort() b)length() c)concat() d)reverse() 3 、var emp = new Array(3); for(var i in emp) 以下答案中能与for循环代码互换的是: (选择一项)。(D ) A for(var i =0; i

c)getElementsByName() d)bgColor() 6. 、display属性值的常用取值不包括(C ) a)inline b)block c)hidden d)none 7. 以下有关pixelTop属性与top属性的说法正确的是。(D ) a)都是Location对象的属性 b)使用时返回值都是字符串 c)都是返回以像素为单位的数值 d)以上都不对 8. 使用open方法打开具有浏览器工具条,地址栏,菜单栏的窗 口,下列选项正确的是__D__ a)open("x.html","HI","toolbas=1,scrollbars=1,status=1"); b)open("HI","scrollbars=1,location=1,status=1"); c)open("x.html","status=yes,menubar=1,location=1"); d)open("x.html","HI","toolbas=yes,menubar=1,location=1"); 9. 、javascript中表达式parseInt(“X8X8”)+paseFloat(‘8’)的结果是什么?( C) a)8+8 b)88 c)16 d)“8”+’8 10. 关于setTimeout(“check”,10)中说法正确的是( D)

JavaScript精选面试题

一选择题(单选) 1、以下哪条语句会产生运行错误:() A.var obj = (); B.var obj = []; C.var obj = {}; D.var obj = //; 答案:A 2、以下哪个单词不属于javascript保留字:() A.with B.parent C.class D.void 答案:B 3、请选择结果为真的表达式:() A.null instanceof Object B.null === undefined C.null == undefined D.NaN == NaN 答案:C 二、不定项选择题 4、请选择对javascript理解有误的:() A.JScript 是javascript的简称 B.javascript是网景公司开发的一种Java脚本语言,其目的是为了简化Java的开发难度 C.FireFox 和IE存在大量兼容性问题的主要原因在于他们对javascript 的支持不同上 D.AJAX技术一定要使用javascript技术 答案:ABCD 5、foo对象有att属性,那么获取att属性的值,以下哪些做法是可以的:() A.foo.att B.foo(“att”) C.foo[“att”] D.foo{“att”} E.foo[“a”+”t”+”t”] 答案:ACE

6、在不指定特殊属性的情况下,哪几种HTML标签可以手动输入文本:() A. B. C. D.

答案:AB 7、以下哪些是javascript的全局函数:() A.escape B.parseFloat C.eval D.setTimeout E.alert 答案:ABC 8、关于IFrame表述正确的有:() A.通过IFrame,网页可以嵌入其他网页内容,并可以动态更改 B.在相同域名下,内嵌的IFrame可以获取外层网页的对象 C.在相同域名下,外层网页脚本可以获取IFrame网页内的对象 D.可以通过脚本调整IFrame 的大小 答案:ABCD 9、关于表格表述正确的有:() A.表格中可以包含TBODY元素 B.表格中可以包含CAPTION元素 C.表格中可以包含多个TBODY元素 D.表格中可以包含COLGROUP元素 E.表格中可以包含COL元素 答案:ABCDE 10、关于IE的window对象表述正确的有:() A.window.opener属性本身就是指向window对象 B.window.reload() 方法可以用来刷新当前页面 C.window.location=”a.html”和window.location.href=”a.html”的作用都是把当前页面替换成a.html页面 D.定义了全局变量g;可以用window.g的方式来存取该变量 答案:ACD 三、问答题

node.js面试题大全-侧重后端应用与对Node核心的理解

node.js面试题大全-侧重后端应用与对Node核心的理解 Node是搞后端的,不应该被被归为前端,更不应该用前端的观点去理解,去面试node开发人员。所以这份面试题大全,更侧重后端应用与对Node核心的理解。 github地址: https://https://www.360docs.net/doc/9414483310.html,/jimuyouyou/node-interview-questions 注: 这是本人历时一星期完成的小作品,github里面对一些关键代码还有js源文件.直接node filename.js就可查看效果. 第一个版本,写的匆忙,能力有限,欢迎拍砖补充!后面持续更新会及时发布到github上. node开发技能图解 起源 node正风生火起,很多介绍却停留在入门阶段,无法投入生产 node相关的高质量面试题更是少之又少,很难全面考查应聘者的node能力 许多文章在讲第三方类库,可是这些库质量差距较大,一旦

遇到问题怎么办 必需的,全面了解node核心才能成为一名合格的node开发人员 目标与原则 前后端兼顾,更侧重后端 理论实战兼顾,侧重考察对实战中应用较多的理论的理解 参考答案简单明了,一针见血,不为追求严谨而浪费口舌,绕弯子 尽量用代码讲清理论的应用与区别,以接地气 终极目标是让大家对node有一个快速完整的认识 内容大纲 javascript高级话题(面向对象,作用域,闭包,设计模式等) node核心内置类库(事件,流,文件,网络等) node高级话题(异步,部署,性能调优,异常调试等) 常用知名第三方类库(Async, Express等) 其它相关后端常用技术(MongoDB, Redis, Apache, Nginx 等) 常用前端技术(Html5, CSS3, JQuery等)

js基础部分面试题

JS基础面试题 1.介绍下js中关于arguments 。【考点:函数arguments】 在函数代码中,使用特殊对象 arguments,开发者无需明确指出参数名,就能访问它们。例如,在函数 sayHi() 中,第一个参数是 message。用 arguments[0] 也可以访问这个值,即第一个参数的值(第一个参数位于位置 0,第二个参数位于位置 1,依此类推)。 因此,无需明确命名参数,就可以重写函数: function sayHi() { if (arguments[0] == "bye") { return; } alert(arguments[0]); } 2.看以下JavaScript程序问:执行以上程序后,num的值为( D )【考点:数据类型】 var num; num=5+true; A、true B、false C、5 D、6 3、看以下JavaScript程序【考点:switch语句,break】 var x=prompt(“请输入1-5的数字!”,“”); switch (x) { case “1”:alert(“one”); case “2”:alert(“two”); case “3”:alert(“three”); case “4”:alert(“four”); case “5”:alert(“five”); default:alert(“none”); } 运行以上程序,在提示对话框中输入“4”,依次弹出的对话框将输出: ( B ) A、four,none B、four,five,none C、five D、five,none 4、分析下面的JavaScript代码段【考点:for循环】 a=new Array(2,3,4,5,6); sum=0; 输出结果是().(选择一项)

前端面试题含答案

前端面试题含答案 The latest revision on November 22, 2020

前端开发面试知识点大纲: HTML&CSS : 对Web 标准的理解、浏览器内核差异、兼容性、hack 、CSS 基本功:布 局、盒子模型、选择器优先级及使用、HTML5、CSS3、移动端适应 JavaScript : 数据类型、面向对象、继承、闭包、插件、作用域、跨域、原型链、模块 化、自定义事件、内存泄漏、事件机制、异步装载回调、模板引擎、Nodejs 、 JSON 、ajax 等。 其他: HTTP 、安全、正则、优化、重构、响应式、移动端、团队协作、可维护、SEO 、UED 、架构、职业生涯 作为一名前端工程师,无论工作年头长短都应该必须掌握的知识点: 1、DOM 结构 —— 两个节点之间可能存在哪些关系以及如何在节点之间任意移动。 产品部-前端面试题-答案 产品部 Beijing

2、DOM操作——如何添加、移除、移动、复制、创建和查找节点等。 3、事件——如何使用事件,以及IE和标准DOM事件模型之间存在的差 别。 4、XMLHttpRequest ——这是什么、怎样完整地执行一次GET请求、怎样检测 错误。 5、严格模式与混杂模式——如何触发这两种模式,区分它们有何意义。 6、盒模型——外边距、内边距和边框之间的关系,及IE8以下版本的浏览器 中的盒模型 7、块级元素与行内元素——怎么用CSS控制它们、以及如何合理的使用它们 8、浮动元素——怎么使用它们、它们有什么问题以及怎么解决这些问题。 9、HTML与XHTML——二者有什么区别,你觉得应该使用哪一个并说出理由。 10、JSON ——作用、用途、设计结构。 HTML 一、Doctype作用严格模式与混杂模式如何区分它们有何意义 (1)、 声明位于文档中的最前面,处于 标签之前。告知浏览器的解析器,用什么文档类型规范来解析这个文档。

Javascript笔试题及答案

J a v a s c r i p t笔试题及 答案 Company Document number:WTUT-WT88Y-W8BBGB-BWYTT-19998

Javascript面试笔试题 考试时间90分钟 一、不定项选择题(每题3分,共30分) 1.声明一个对象,给它加上name属性和show方法显示其name值,以下 代码中正确的是( D ) A.var obj = [name:"zhangsan",show:function(){alert(name);}]; B.var obj = {name:"zhangsan",show:”alert”}; C.var obj = {name:"zhangsan",show:function(){alert(name);}}; D.v ar obj = {name:"zhangsan",show:function(){alert;}}; 2.以下关于Array数组对象的说法不正确的是( CD) A.对数组里数据的排序可以用sort函数,如果排序效果非预期,可以给 sort函数加一个排序函数的参数 B.reverse用于对数组数据的倒序排列 C.向数组的最后位置加一个新元素,可以用pop方法 D.unshift方法用于向数组删除第一个元素 3.要将页面的状态栏中显示“已经选中该文本框”,下列JavaScript语句正确的 是( A ) A.="已经选中该文本框" B.="已经选中该文本框" C.="已经选中该文本框" D.="已经选中该文本框" 4.点击页面的按钮,使之打开一个新窗口,加载一个网页,以下JavaScript 代码中可行的是( AD)

js_ext_jquery面试题

对js,ext,jquey的总结 一:js面试题 1.js中到的String你是怎么理解的 答:String是js中唯一可以变长的长度到值,存储方式是以数组存储的一般组合alert使用 \n:是代表回车 \r是代表换行 2.写js代码的时候要注意的语法 答:1.区分大小写 2.变量类型是弱类型 var 3.注释 //单行注释 /** 多行注释 **/ 4.变量名要是字母下划线 $ 5.数据类型: * 原始数据类型(栈) boolean,null,undefind,number,String * 引用数据类型(堆)比如对象 3.强类型变量和弱类型变量到区别 1.强类型变量:编译前必须要声明----->基于java 2.弱类型变量:编译前不需要声明(使用前不需要声明 , 而是解释器在运行时检查数据类型)---->js 3.在js中function()表示什么? 可不可以重载? function的声明方式? 答: 1.可以表示为---> 类 , 对象 , 方法 , 构造器 2.不可以重载(当function()的名字相同--->后面到会覆盖前面到)

3.function()是所有函数到父类例如:function 函数名(参数列明){ } 4.js的特点 答: 1.脚本语言,基于对象 2.基于java的,基于语句和控制流之上简单而紧凑 3.动态的脚本语言 4.依赖于浏览器本身于操作环境无关 5.以字符串解析执行 5.给你一页面,要你写JS代码拿对象,得到它值,然后进行一些操作 答: 第一种方法是 document.getEelementById("标签里面到id属性").value; 第二种方法是 document.getEelementsByName("标签里面name属性 ").value; 第三种方法是直接用document点name里面到属性例 如:document.xxx.xxx.value 这样就可以拿到值 6.你是怎么理解js里面到this关键字 答:this是对当前对象的引用,在js中由于对象到引用是多层次的,为了避免乱(谁调用了它,它就会指向谁) 7.js里面的警告框和询问框确认框有什么作用 答: 1.警告框为了输出js调式用例:alert("我是用于js调式"); 2.询问框为了询问你通不通过例:提问 var number=prompt("你到分数") if(number>100){通过}else{没有通过} 3.确认框为了让你确认的例: 确认 var name = confirm("js菜鸟") if(name==true){彼此彼此}else{你才是菜鸟} 8.js是的组成分为哪三部分 答:核心(Ecmscript) , 文档对象模型 , 浏览器对象模型 9.在js里面跳转一个页面用什么方法

基础JavaScript面试问题及答案

基础JavaScript面试问题及答案 1.使用typeof bar === "object"来确定bar是否是对象的潜在陷阱是什么?如何避免这个陷阱? 尽管typeof bar === "object"是检查bar是否对象的可靠方法,令人惊讶的是在JavaScript 中null也被认为是对象! 因此,令大多数开发人员惊讶的是,下面的代码将输出true (而不是false) 到控制台: var bar = null;console.log(typeof bar === "object"); // logs true! 只要清楚这一点,同时检查bar是否为null,就可以很容易地避免问题: console.log((bar !== null) && (typeof bar === "object")); // logs false 要答全问题,还有其他两件事情值得注意: 首先,上述解决方案将返回false,当bar是一个函数的时候。在大多数情况下,这是期望行为,但当你也想对函数返回true的话,你可以修改上面的解决方案为: console.log((bar !== null) && ((typeof bar === "object") || (typeof bar === "function")));

第二,上述解决方案将返回true,当bar是一个数组(例如,当var bar = [];)的时候。在大多数情况下,这是期望行为,因为数组是真正的对象,但当你也想对数组返回false时,你可以修改上面的解决方案为: console.log((bar !== null) && (typeof bar === "object") && (toString.call(ba r) !== "[object Array]")); 或者,如果你使用jQuery的话: console.log((bar !== null) && (typeof bar === "object") && (! $.isArray(ba r))); 2.下面的代码将输出什么到控制台,为什么? (function(){ var a = b = 3; })(); console.log("a defined? " + (typeof a !== 'undefined'));console.log("b defin ed? " + (typeof b !== 'undefined')); 由于a和b都定义在函数的封闭范围内,并且都始于var关键字,大多数JavaScript开发人员期望typeof a和typeof b在上面的例子中都是undefined。

JS数组的前端面试题

关于数组的前端面试题 1、如何判断一个变量是否为数组? (1)为什么不用typeof? var list = [1,2,3]; typeof list //"object" Array继承与Object,所以typeof 会直接返回object,所以不可以用typeof方法来检测(2)为什么不用instanceof? var list = [1,2,3]; list instanceof Array //true instanceof 表面上看确实是返回了true,但其实并不可靠。原因是Array实质是一个引用,用instanceof方法(包括下面的constructor方法)都是利用和引用地址进行比较的方法来确定的,但是在frame嵌套的情况下,每一个Array的引用地址都是不同的,比较起来结果也是不确定的,所以这种方法有其局限性。 (3)为什么不用constructor方法? var list = [1,2,3]; list.constructor === Array; //true 原因已经解释过了,不再赘述。 可靠的检测数组方式 (1)利用Object的toString方法 var list = [1,2,3]; Object.prototype.toString.call(list); //[object Array] (2)利用ES6的Array.isArray()方法 var list = [1,2,3]; Array.isArray(list); //true 2、数组的原生方法有哪些? 一是考察面试者平时使用的是否足够平凡;二是观察面试者是否对于日常的知识有所归纳。 可以用MDN中给出的方式来回答: (1)会改变自身的方法 Array.prototype.copyWithin() 在数组内部,将一段元素序列拷贝到另一段元素序列上,覆盖原有的值。 Array.prototype.fill() 将数组中指定区间的所有元素的值,都替换成某个固定的值。 Array.prototype.pop()删除数组的最后一个元素,并返回这个元素。 Array.prototype.push()在数组的末尾增加一个或多个元素,并返回数组的新长度。 Array.prototype.reverse()颠倒数组中元素的排列顺序,即原先的第一个变为最后一个,原先的最后一个变为第一个。 Array.prototype.shift()删除数组的第一个元素,并返回这个元素。 Array.prototype.sort()对数组元素进行排序,并返回当前数组。 Array.prototype.splice()在任意的位置给数组添加或删除任意个元素。 Array.prototype.unshift()在数组的开头增加一个或多个元素,并返回数组的新长度。

js基础测试题

一、选择题(每题 2 分,多选题错选、少选不得分) 1、分析下段代码输出结果是() var arr = [2,3,4,5,6]; var sum =0; for(var i=1;i < arr.length;i++) { sum +=arr[i] } console.log(sum); A.20 B.18 C.14 D.12 2、以下关于Array 数组对象的说法不正确的是() A.对数组里数据的排序可以用sort 函数,如果排序效果非预期,可以给sort 函数加一个排序函数的参数 B.reverse 用于对数组数据的倒序排列 C.向数组的最后位置加一个新元素,可以用pop 方法 D.unshift 方法用于向数组删除第一个元素

3、以下代码运行的结果是输出( ) var a = b = 10; (function(){ var a=b=20 })(); console.log(b); A.10 B.20 C.报错D.undefined 4、以下代码运行后的结果是输出( ) var a=[1, 2, 3]; console.log(a.join()); A.123 B.1,2,3 C.1 2 3 D.[1,2,3] 5、在JS 中,’1555 ’+3 的运行结果是( )

A.1558 B.1552 C.15553 D.1553 6、以下代码运行后弹出的结果是( ) var a = 888; ++a; alert(a++); A.888 B.889 C.890 D.891 7、关于变量的命名规则,下列说法正确的是() A.首字符必须是大写或小写的字母,下划线(_)或美元符($ )B.除首字母的字符可以是字母,数字,下划线或美元符 C.变量名称不能是保留字 D.长度是任意的 E.区分大小写

25个最基本的JavaScript面试问题及答案

25个最基本的JavaScript面试问题及答案 1.使用typeof bar === "object"来确定bar 是否是对象的潜在陷阱是什么?如何避免这个陷阱? 尽管typeof bar === "object"是检查bar 是否对象的可靠方法,令人惊讶的是在JavaScript中null 也被认为是对象! 因此,令大多数开发人员惊讶的是,下面的代码将输出 true (而不是false) 到控制台: var bar = null; console.log(typeof bar === "object"); // logs true! 只要清楚这一点,同时检查bar是否为null,就可以很容易地避免问题:console.log((bar !== null) && (typeof bar === "object")); // logs false 要答全问题,还有其他两件事情值得注意: 首先,上述解决方案将返回false,当bar是一个函数的时候。在大多数情况下,这是期望行为,但当你也想对函数返回true的话,你可以修改上面的解决方案为: console.log((bar !== null) && ((typeof bar === "object") || (typeof bar === "function "))); 第二,上述解决方案将返回true,当bar是一个数组(例如,当var bar = [];)的时候。在大多数情况下,这是期望行为,因为数组是真正的对象,但当你也想对数组返回false时,你可以修改上面的解决方案为:

console.log((bar !== null) && (typeof bar === "object") && (toString.call(bar) !== "[obje ct Array]")); 或者,如果你使用jQuery的话: console.log((bar !== null) && (typeof bar === "object") && (! $.isArray(bar))); 2.下面的代码将输出什么到控制台,为什么? (function(){ var a = b = 3; })(); console.log("a defined? " + (typeof a !== 'undefined')); console.log("b defined? " + (typeof b !== 'undefined')); 由于a和b 都定义在函数的封闭范围内,并且都始于var关键字,大多数JavaScript开发人员期望typeof a和typeof b在上面的例子中都是undefined。然而,事实并非如此。这里的问题是,大多数开发人员将语句var a = b = 3;错误地理解为是以下声明的简写: var b = 3; var a = b; 但事实上,var a = b = 3;实际是以下声明的简写: b = 3; var a = b; 因此(如果你不使用严格模式的话),该代码段的输出是: a defined? false b defined? true

史上最全前端面试题(含答案)

HTML+CSS 1.对WEB标准以及W3C的理解与认识 标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件,容易维护、改版方便,不需要变动页面内容、提供打印版本而不需要复制内容、提高网站易用性; 2.xhtml和html有什么区别 HTML是一种基本的WEB网页设计语言,XHTML是一个基于XML的置标语言 最主要的不同: XHTML 元素必须被正确地嵌套。 XHTML 元素必须被关闭。 标签名必须用小写字母。 XHTML 文档必须拥有根元素。 3.Doctype? 严格模式与混杂模式-如何触发这两种模式,区分它们有何意义? 用于声明文档使用那种规范(html/Xhtml)一般为严格过度基于框架的html 文档 加入XMl声明可触发,解析方式更改为IE5.5 拥有IE5.5的bug 4.行内元素有哪些?块级元素有哪些?CSS的盒模型? 块级元素:div p h1 h2 h3 h4 form ul 行内元素: a b br i span input select Css盒模型:内容,border ,margin,padding 5.CSS引入的方式有哪些? link和@import的区别是? 内联内嵌外链导入 区别:同时加载 前者无兼容性,后者CSS2.1以下浏览器不支持 Link 支持使用javascript改变样式,后者不可 6.CSS选择符有哪些?哪些属性可以继承?优先级算法如何计算?内联和important哪个优先级高? 标签选择符类选择符 id选择符 继承不如指定 Id>class>标签选择 后者优先级高 7.前端页面有哪三层构成,分别是什么?作用是什么? 结构层 Html 表示层 CSS 行为层 js 8.css的基本语句构成是? 选择器{属性1:值1;属性2:值2;……}

JavaScript面试题汇总

一、单选题 1、以下哪条语句会产生运行错误:(A) A.var obj = ( ); B.var obj = [ ];//定义一个数组 C.var obj = { };//定义一个对象 D.var obj = / /;//定义一个正则表达式 2、以下哪个单词不属于javascript保留字:(B) A. with B. parent C. class D. void 3、请选择结果为真的表达式:(C) A. null instanceof Object B. null === undefined C. null == undefined D. NaN == NaN 说明: ==用于一般比较,===用于严格比较, ==在比较的时候可以转换数据类型, ===严格比较,只要类型不匹配就返回flase。 举例说明: "1" == true 类型不同,"=="将先做类型转换,把true转换为1,即为 "1" == 1; 此时,类型仍不同,继续进行类型转换,把"1"转换为1,即为 1 == 1; 此时,"==" 左右两边的类型都为数值型,比较成功! 如果比较:"1" === true 左侧为字符型,右侧为bool布尔型,左右两侧类型不同,结果为false; 如果比较:"1" === 1 左侧为字符型,右侧为int数值型,左右两侧类型不同,结果为false; 如果比较: 1 === 1 左侧为int数值型,右侧为int数值型,左右两侧类型相同,数值大小也相同,结果为true;

如果比较: 1 === 2 左侧为int数值型,右侧为int数值型,左右两侧类型相同,但数值大小不同,结果为false; 简而言之就是 "==" 只要求值相等; "===" 要求值和类型都相等 二、不定项选择题 4、请选择对javascript理解有误的:(ABCD) A. JScript是javascript的简称、 B. javascript是网景公司开发的一种Java脚本语言,其目的是为了简化Java 的开发难度(没有什么关系)。 C. FireFox和IE存在大量兼容性问题的主要原因在于他们对javascript的支持不同上 D. AJAX技术一定要使用javascript技术 说明: Java、javascript、JS和JScript 首先,这三者没有必然的联系,它们是完全不同的事物,它们是分别由不同公司开发的,在函数方面有相同的地方,也有很多不同之处。Java是由Sun公司创立、开发;javascript则是Sun和Netscape公司共同开发的产品;JScript 是微软对ECMA262语言规范的一种实现。这三者的共同点是,语法与C语言相似。 JS是javascript的简称。 JScript应用于ASP,运行于服务器端。而Java、javascript都是运行于客户端。Sun公司后来又推出了JSP,以Java语言为基础,运行于服务器端。运行于服务器端的网页是动态网页,所以以JScript为基础的ASP、以Java为基础的JSP是动态网页,而Java、javascript则是静态网页。 ajax是一种概念,它是几种技术的综合运用(javascript,xml),ajax可以用在任何动态语言开发的网站里(asp,https://www.360docs.net/doc/9414483310.html,,jsp,php等)。它不为微软专有,不过呢,微软为https://www.360docs.net/doc/9414483310.html,专门开发了一个ajax框架。 5、foo对象有att属性,那么获取att属性的值,以下哪些做法是可以的:(ACE) A. foo.att B. foo(“att”) C.foo[“att”] D. foo{“att”} E. foo[“a”+”t”+”t”]

2019前端经典面试题

1,html和xml有什么区别 html是超文本标记语言xml是可扩展标记语言 html语法宽松,xml语法严谨 html使用固有标记,xml没有固有标记 html标签预定义,xml标签可扩展,可定义 html是用来显示数据的,xml是用来描述和存储数据的 2,css有哪几种选择器?权重的优先级? 第一种为属性选择器 第二种为id选择器 第三种为class选择器 第四种为伪类选择器 第五种是后代选择器 第六种是标签选择器 第七种是通用选择器 第八种是伪元素选择器 1. 第一等:代表内联样式,如: style=””,权值为1000。 2. 第二等:代表ID选择器,如:#content,权值为0100。 3. 第三等:代表类,伪类和属性选择器,如.content,权值为0010。 4. 第四等:代表类型选择器和伪元素选择器,如div p,权值为0001。 5. 通配符、子选择器、相邻选择器等的。如*、>、+,权值为0000。 6. 继承的样式没有权值。 3,网页有哪几部分组成? 结构层:html 表示层:css 行为层:js和dom 4,一个200*200的div在不同分辨率屏幕上下左右居中,用css实现 Div{ position:absolute; width:200px; height:200px; top:50%; left:50%; margin-top:-100px; margin-left:-100px; }

5,阐述清楚浮动的几种方式 第一种父级div定义高度height 适合高度固定的布局 第二种父级div定义overflow:hidden 第三种结尾处加空标签clear:both 让父级自动获取高度 第四种父级div定义伪类:after 和zoom 6,解释css sprites,如何使用? CSS Sprites其实就是把网页中一些背景图片整合到一张图片文件中,再利用CSS的“background-image”,“background- repeat”,“background-position”的组合进行背景定位,background-position可以用数字能精确的定位出背景图片的位置。 CSS Sprites为一些大型的网站节约了带宽,让提高了用户的加载速度和用户体验,不需要加载更多的图片 7,如何用原生js给一个按钮绑定两个onclick事件? Var btn1 =document. getElementsById(“btn”); btn1.addEnventListener(“click”,”hello1); btn1.addEnventListener(“click”,”hello2); function hello1(){ alert(“hello1”); } function hello2(){ alert(“hello2”); } 8, 拖曳会用到哪些事件? Dragstart Dragenter Dragover Dragleave Drag Drop Dragend 9, 请列举jQuery中选择器? 1,基本选择器 ID,class,元素之类的 2,层级选择器 返回的是jQuery对象才可以进行的链式操作

相关文档
最新文档