前端技术面试题

电玩女神 2022-04-11 10:23 436阅读 0赞

---

## title : 前端技术（HTML、CSS、JS、JQuery等） ##

## 前端技术 ##

##### 在js中怎么样验证数字？ #####

通过正则表达式/\*$/  
reg.test(需要判断的字符串)

##### js中如何给string这个类型加方法？ #####

通过原型链添加方法：

String.prototype.go = function(){//在string大对象上添加方法go
        console.log(this)
    }
    'sss'.go();//调用自定义的方法

##### 谈谈js的定时器？ #####

js给我们提供了两种定时器  
setTimeout(1000,function()\{\}) 每秒调用一次,但是在页面刷新的时候会出现第一秒不会调用的情况  
setIntever(1000,function()\{\})间隔一秒调用一次,直调用一次,但是没有空白期,所以我们在秒杀倒计时的时候是通过该定时器递归调用显示时间

##### 请写几个javascript 里面的对象和对象的函数使用 #####

javascript对象
    - String对象
    length:使用长度属性来计算字符串的长度。
    var txt="Hello world!"
    document.write(txt.length)
    
    indexOf() 方法:使用 indexOf() 来定位字符串中某一个指定的字符首次出现的位置。
    var str="Hello world!"
    document.write(str.indexOf("Hello") + "<br />")
    
    match():使用 match() 来查找字符串中特定的字符，并且如果找到的话，则返回这个字符。
    var str="Hello world!"
    document.write(str.match("world") + "<br />")
    
    -  Date对象
    Date():返回当日的日期和时间
    document.write(Date());
    setFullYear:使用 setFullYear() 设置具体的日期。
    var d = new Date()
    d.setFullYear(1992,10,3)
    
    - Array对象
    for..in:使用 for...in 声明来循环输出数组中的元素。
    for (x in mycars)
    {
    document.write(mycars[x] + "<br />")
    }

##### 请写几个html元素以及相应控制效果 #####

<h1>...<h6>:控制标签字体大小
    <p> ：段落标签，独占一行
    <img>:展示图片标签
    无序标签：
     <ul>
        <li></li>
        <li></li>
     </ul>
     有序标签：
     <ol>
        <li></li>
        <li></li>
     </ol>
     <a href=""></a>:超连接标签

##### ajax的实现机制 #####

XMLHttpRequest发送异步请求先open,再send;判断响应状态码200和状态4然后设置回调函数  
由于每个浏览器之间存在差异所以我们对不同的浏览器需要创建不同的XMLHttpRequest对象

Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发异步请求，从服务器获得数据，然后用javascript来操作DOM而更新页面。这其中最关键的一步就是从服务器获得请求数据。要清楚这个过程和原理，我们必须对 XMLHttpRequest有所了解。XMLHttpRequest是ajax的核心机制

由于各浏览器之间存在差异，所以创建一个XMLHttpRequest对象可能需要不同的方法。这个差异主要体现在IE和其它浏览器之间。下面是一个比较标准的创建XMLHttpRequest对象的方法。

示例代码：
    function CreateXmlHttp() {
    
        //非IE浏览器创建XmlHttpRequest对象
        if (window.XmlHttpRequest) {
            xmlhttp = new XmlHttpRequest();
        }
    
        //IE浏览器创建XmlHttpRequest对象
        if (window.ActiveXObject) {
            try {
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch (e) {
                try {
                    xmlhttp = new ActiveXObject("msxml2.XMLHTTP");
                }
                catch (ex) { }
            }
        }
    }
    
    function Ustbwuyi() {
    
        var data = document.getElementById("username").value;
        CreateXmlHttp();
        if (!xmlhttp) {
            alert("创建xmlhttp对象异常！");
            return false;
        }
    
        xmlhttp.open("POST", url, false);
    
        xmlhttp.onreadystatechange = function () {
            if (xmlhttp.readyState == 4) {
                document.getElementById("user1").innerHTML = "数据正在加载...";
                if (xmlhttp.status == 200) {
                    document.write(xmlhttp.responseText);
                }
            }
        }
        xmlhttp.send();
    }

函数首先检查XMLHttpRequest的整体状态并且保证它已经完成（readyStatus=4），即数据已经发送完毕。然后根据服务器的设定询问请求状态，如果一切已经就绪（status=200），那么就执行下面需要的操作。

对于XmlHttpRequest的两个方法，open和send，其中open方法指定了：

a、向服务器提交数据的类型，即post还是get。

b、请求的url地址和传递的参数。

c、传输方式，false为同步，true为异步。默认为true。

Send方法用来发送请求。  
知道了XMLHttpRequest的工作流程，我们可以看出，XMLHttpRequest是完全用来向服务器发出一个请求的，它的作用也局限于此，但它的作用是整个ajax实现的关键，因为ajax无非是两个过程，发出请求和响应请求。并且它完全是一种客户端的技术。而XMLHttpRequest正是处理了服务器端和客户端通信的问题所以才会如此的重要。

##### 如何在b.html页面获取a.html元素值 #####

通过静态或动态包含

##### javascript中如何判断数据类型，返回值分别是什么？ #####

typeof()进行判断  
返回值有  
String,Number,undefine,Object,boolean,function

##### 用jq或者js获取复选框中选中的值 #####

jq可以通过选择器$("input\[type=“checkbox”\]).val()  
js可以通过document.getElementById(“复选框的id”).value;

##### jQuery中find方法和children方法的使用和区别 #####

find和children都可以用来查找一个元素的后代元素,children只能找子代元素,find可以找所有后代元素

## J2EE基础 ##

##### Servlet属于线程安全的吗？ #####

不是,Tomcat底层机制是多线程的  
当Tomcat接收到Client的HTTP请求时，Tomcat从线程池中取出一个线程，之后找到该请求对应的Servlet对象并进行初始化，之后调用service()方法。要注意的是每一个Servlet对象再Tomcat容器中只有一个实例对象，即是单例模式。如果多个HTTP请求请求的是同一个Servlet，那么着两个HTTP请求对应的线程将并发调用Servlet的service()方法。所以此时如果Servlet中定义了实例变量或静态变量，那么可能会发生线程安全问题（因为所有的线程都可能使用这些变量）。

##### 在JSP中，只有一行代码：<%=A+B %>，运行结果是() #####

报错 因为A和B没有定义

##### jsp和servlet有什么关系？ #####

JSP本质上就是Servlet,JSP是实现了Servlet的接口的,但是jsp更优秀与动态数据的加载,加载JSP页面的时候实质上是加载了一个JSPServlet的类对象,通过out对象进行页面的渲染和其他内置作用域对象进行数据的填充,而Servlet更优秀于逻辑控制

##### iso8859-1如何转换成utf-8? #####

通过String的构造器  
new String(“需要转换的字符串”.getBytes(“iso-8859-1”),“utf-8”);

##### 你如何防止直接敲URL进行访问页面 #####

通过Filter，进行判断是否登陆，如果用户登陆了才放行，否则回到登陆页面

##### 谈谈Jsp的9大内置对象 #####

四大作用域对象  
pageContext：  
取得任何范围的参数，通过它可以获取 JSP页面的out、request、reponse、session、application 等对象。pageContext对象的创建和初始化都是由容器来完成的，在JSP页面中可以直接使用 pageContext对象。

request：  
request 对象是 javax.servlet.httpServletRequest类型的对象。 该对象代表了客户端的请求信息，主要用于接受通过HTTP协议传送到服务器的数据。（包括头信息、系统信息、请求方式以及请求参数等）。request对象的作用域为一次请求。

session：  
由服务器自动创建的与用户请求相关的对象。服务器为每个用户都生成一个session对象，用于保存该用户的信息，跟踪用户的操作状态。session对象内部使用Map类来保存数据，因此保存数据的格式为 “Key/value”。 session对象的value可以使复杂的对象类型，而不仅仅局限于字符串类型。

application：  
application 对象可将信息保存在服务器中，直到服务器关闭，否则application对象中保存的信息会在整个应用中都有效。与session对象相比，application对象生命周期更长，类似于系统的“全局变量”。

page  
page 对象代表JSP本身，只有在JSP页面内才是合法的。 page隐含对象本质上包含当前 Servlet接口引用的变量，类似于Java编程中的 this 指针。

out  
out 对象用于在Web浏览器内输出信息，并且管理应用服务器上的输出缓冲区。在使用 out 对象输出数据时，可以对数据缓冲区进行操作，及时清除缓冲区中的残余数据，为其他的输出让出缓冲空间。待数据输出完毕后，要及时关闭输出流。  
exception：  
exception 对象的作用是显示异常信息，只有在包含 isErrorPage=“true” 的页面中才可以被使用，在一般的JSP页面中使用该对象将无法编译JSP文件。excepation对象和Java的所有对象一样，都具有系统提供的继承结构。exception 对象几乎定义了所有异常情况。在Java程序中，可以使用try/catch关键字来处理异常情况； 如果在JSP页面中出现没有捕获到的异常，就会生成 exception 对象，并把 exception 对象传送到在page指令中设定的错误页面中，然后在错误页面中处理相应的 exception 对象。  
config:  
config 对象的主要作用是取得服务器的配置信息。通过 pageConext对象的 getServletConfig() 方法可以获取一个config对象。当一个Servlet 初始化时，容器把某些信息通过 config对象传递给这个 Servlet。 开发者可以在web.xml 文件中为应用程序环境中的Servlet程序和JSP页面提供初始化参数。

response:  
对客户端的响应，主要是将JSP容器处理过的对象传回到客户端。response对象也具有作用域，它只在JSP页面内有效。

##### 谈谈jsp的4个数据传输域以及他们的区别 #####

JSP四个域对象:pageContext,servletContext,request,sesssion  
主要区别是：  
1.生命周期不同，pageContext当前页面有效,request一次请求范围内有效，session本次会话范围内，servletContext作用于整个应用范围

##### 谈谈jsp跟Servlet的区别 #####

JSP与Servlet主要有两方面的不同：  
编译：JSP修改后可以立即看到结果，不需要编译；而Servelt缺需要编译。  
转换：JSP是动态网页开发技术，是运行在服务器端的脚本语言，而Servlet是web服务器端编程技术。所以JSP运行时就是转换为Servlet，也就是java程序来执行。

##### 谈谈Servlet的生命周期 #####

1.在容器初始化的时候，加载web.xml文件时候对配置好的servlet进行加载  
2.初始化，调用init()方法初始化  
3.请求处理阶段,service()接受请求调用doGet()和doPost()方法  
4.销毁，调用destory()方法进行销毁,一般是在服务器关闭的时候销毁  
当服务器不再需要Servlet实例或重新装入时，会调用destroy方法，使用这个方法，Servlet可以释放掉所有在init方法申请的资源。一个Servlet实例一旦终止，就不允许再次被调用，只能等待被卸载。

##### 谈谈转发和重定向的区别 #####

1.位置不同，转发是服务器行为，重定向是浏览器行为  
2.转发可以携带请求数据，重定向不可以  
3.转发是一次请求，重定向是两次请求  
4.转发的地址栏不会改变，重定向的地址栏会改变  
5.转发只能站内，重定向还将有访问其他站点

##### 谈谈MVC设计模式的理解 #####

M-Model 业务处理层，接受C层调用,获得参数,进行业务处理,调用Dao层访问数据，响应数据回C层  
V-View 接受客户请求,然后调用C层,最后接受C层响应渲染视图响应用户  
C-Controller 逻辑控制层,接受V层请求，调用M层然后获得响应，根据响应进行判断后返回页面到V层

##### 谈谈cookie跟session的区别 #####

cookie是存放在客户端，session是存放在服务端的  
session本身是基于cookie的会话机制  
session数据大小远大于cookie，cookie只能是字符串类型，并且每个站点大概是20个总个数不能超过300个，总大小大概4k左右  
cookie数据是不安全的，session数据相对来说安全  
cookie的生命周期一般来说远长于session，session作用一次会话，cookie如果没有设置过期时间可以是永远存在磁盘上的

##### 谈谈你用过的设计模式？？ #####

简单工厂模式，线程池…  
代理设计模式，spring的AOP，事务管理，日志记录等  
单例设计模式，Spring的Bean管理，简单购物车的实现  
装饰者设计模式，request过滤器解决get请求乱码问题，MyBatis的分页对象  
适配器设计模式，springboot的日志记录，使用了适配器模式，SpringMvc底层的HanlderAdapter

##### 如何在XML文件中输出<,>,\#这些特殊字符 #####

CDATA强制不解析字符串

##### JSP页面中如何处理编码问题 #####

1、eclipse配置中的Text file encoding（文件编码），这是给java编译器用的，如果想在jsp页面中保存中文字符，必须将其设置为UTF-8格式。  
2.jsp页面中contentType指定了服务器响应给客户端的http内容类型，默认为”text/html“，charset指定了服务器发送给客户端时的内容编码。可以把charset设置成utf-8  
3.pageEncoding是jsp文件本身的编码,可以设置成utf-8

##### jsp中有几种注释方式，分别是什么？ #####

三种支持JAVA注释，HTML注释，还有JSP注释  
//和<!1-- -->和<% %>

##### jsp:forward与Window.location.href的区别? #####

在jsp:forward标签对中使用jsp:param标签可以进行传值。  
jsp:forward动作指令之后的代码是不会执行的。  
使用动作指令跳转的页面，浏览器的地址还是跳转之前的页面地址。  
window.location.href通过请求地址携带参数，且页面地址会改变。

##### 在jsp页面怎么获取url里面的请求参数？ #####

通过EL表达式,或者小脚本<% request.getParamter(“key”) %>

##### 在tomcat项目根目录下有个文件images/logo.png，在web环境下怎么获取该文件路径？ #####

通过类构造器  
this.getClass().getClassLoad("/image/logo.png").getPath();  
通过ServletAPI

String path = getServletContext().getRealPath("/images/logo.png");
    File file = new File(path);

## 数据库 ##

##### 数据表的设计原则 #####

三大范式，  
1.第一范式，所有字段不可再分，即原子性  
2.第二范式，主键约束，每列都需要与主见相关  
3.第三范式，外键约束，直接相关  
在实际开发中最为常见的设计范式有三个：

*  第一范式是最基本的范式。如果数据库表中的所有字段值都是不可分解的原子值，就说明该数据库表满足了第一范式；
 *  第二范式在第一范式的基础之上更进一层。第二范式需要确保数据库表中的每一列都和主键相关，而不能只与主键的某一部分相关（主要针对联合主键而言）。也就是说在一个数据库表中，一个表中只能保存一种数据，不可以把多种数据保存在同一张数据库表中；
 *  第三范式需要确保数据表中的每一列数据都和主键直接相关，而不能间接相关。

##### 原生的jdbc怎么连接数据库？ #####

四大金刚  
ClassForname(驱动类);加载驱动类  
getConnection();获得连接对象  
Statement获得执行对象  
ResultSet()获得结果集  
close()关闭所有资源ResultSet->Statement->Connection

##### 关系数据库中连接池的机制是什么？ #####

通过连接池获得Connection对象然后操作数据库,使用后放回连接池

J2EE服务器启动时会建立一定数量的池连接，并一直维持不少于此数目的池连接。客户端程序需要连接时，池驱动程序会返回一个未使用的池连接并将其表记为忙。如果当前没有空闲连接，池驱动程序就新建一定数量的连接，新建连接的数量有配置参数决定。当使用的池连接调用完成后，池驱动程序将此连接表记为空闲，其他调用就可以使用这个连接。  
实现方式，返回的Connection是原始Connection的代理，代理Connection的close方法不是真正关连接，而是把它代理的Connection对象还回到连接池中。

##### 关系数据库中的主键和外键有什么关系？ #####

一般来说，表的主键就是关联表的外键

定义主键和外键主要是为了维护关系数据库的完整性。

1.  主键是能确定一条记录的唯一标识，比如，一条用户记录包括身份证号，姓名等。身份证号是唯一能确定你这个人的，其他都可能有重复，所以，身份证号可以是主键。
2.  外键用于与另一张表的关联。是能确定另一张表记录的字段，用于保持数据的一致性,一表的外键是另一张表的主键或唯一字段。

##### 关系数据库中第一范式、第二范式和第三范式是什么？ #####

三大范式，  
1.第一范式，所有字段不可再分，即原子性  
2.第二范式，主键约束，每列都需要与主见相关  
3.第三范式，主键和列直接相关

##### Oracle 端口号？MySQL端口号？ #####

Oracle:**1521**  
mysql:3306

##### test1表中有ABC三列，用SQL语句实现：当A列大于B列时，选择A列否则选择B列，当B列大于C列时选择B列 否则选择C列。 #####

select
    	(case A>B then A else B end) as t1,
    	(case B>c then B esle C end) as t2
    from test1

##### 给定基本信息表baseInfo包括：学号、姓名、性别、年龄、籍贯（主键是学号），分数表scoreInfo包括：学号，科目，分数（主键是学号-科目） #####

##### 查询所有语文成绩大于85分的学生的学号、姓名、性别、年龄、语文分数、数学分数 #####

##### 查询所有语文成绩大于85分、性别为女的学生的学号、姓名、各科分数 #####

##### Long类型怎么设计的表结构?Boolean类型怎么设计的表结构? #####

##### 请介绍下触发器的原理 #####

触发器利用了监听器的原理，一旦监听的操作执行就执行该触发器

触发器是由INSERT、UPDATE和DELETE等事件来触发某种特定操作。满足触发器的触发条件时，数据库系统就会执行触发器中定义的程序语句。这样做可以保证某些操作之间的一致性。例如，当学生表中增加了一个学生的信息时，学生的总数就必须同时改变。可以在这里创建一个触发器，每次增加一个学生的记录，就执行一次计算学生总数的操作。这样就可以保证每次增加学生的记录后，学生总数是与记录数是一致的。触发器触发的执行语句可能只有一个，也可能有多个。

##### 存储过程里的语句是一条条按顺序执行的吗? #####

存储过程里的语句并不是一条条按编写顺序执行。  
数据库在编译存储过程时会有一个优化的过程，在不改变存储过程最后结果的前提下，可能会对存储过程里的语句有一个顺序的调整。

##### 如何写分组过滤的SQL语句，比如统计一个班级里面，按省份分组，统计每个省份的学员平均年龄或统计一个班级里面，按省份分组，要求只列出平均年龄大于20岁的省份信息 #####

##### 如何解决SQL注入的问题 #####

通过预编译PrepareStatement对象，使用占位符而不是直接拼接的方式传参，隔离了参数和SQL语句之间的影响

##### 请说说内连接和外连接的写法及区别 #####

内连接查询匹配的数据，左外连接以左边表的数据为准，即左边表的数据全部查出，右边表无匹配数据则以空代替。右外连接则相反。

inner join 表名 on  
left/right outer join 表名 on

##### 向一张表插入100万条数据，该如何做？ #####

分批次插入，使用batchExecute

##### 谈谈对数据库事务的理解？事务的边界应该放在哪一层？为什么？ #####

事务是逻辑控制的最小单位，表示一个逻辑命令控制，其中可能有多次操作，这些操作要么全部成功要么全部失败，应该放在service层，因为service就是用来操作Dao层也就是我们的数据，而事务就是为了保证数据一致性而产生的；

##### 谈谈事务的特性ACID #####

A:原子性，操作要么全部成功要么全部失败  
C:一致性，事务操作前后保证数据完整性  
I:隔离性，事务和事务之间是透明的互不影响的  
D:持久性，一旦事务提交那么数据将持久化到硬盘上

##### 谈谈事务的隔离级别 #####

事务的隔离级别是用来解决一些事务中的安全隐患的  
1.读  
脏读：读未提交，读到了另外一个事务还没有提交的数据  
不可重复读：读已提交，读到了另外一个事务已经提交的数据  
幻读/虚读：读到另一个事务修改的数据  
2.写  
丢失更新，使用乐观锁解决  
隔离级别  
Read uncommitted 读未提交  
Read committed 读已提交  
Repeatable Read 可重复读  
Serializable 序列化

##### 存储过程是什么？ #####

一组SQL,可以有逻辑判断和控制流语句,是存放在数据库中的，一处编译处处运行，避免了我们service层的复杂业务逻辑与数据库频繁交互带来的程序性能下降；但是可移植性很差，因为不同的数据库的存储过程的写法不相同

存储过程是SQL 语句和可选控制流语句的预编译集合，以一个名称存储并作为一个单元处理。存储过程存储在数据库内，可由应用程序通过一个调用执行，而且允许用户声明变量、有条件执行以及其它强大的编程功能。存储过程在创建时即在服务器上进行编译，所以执行起来比单个SQL语句快、

##### 用过哪些数据库连接池，为什么要用数据库连接池？ #####

连接池主要减少数据库连接的创建时间和连接销毁时间  
DBCP,C3P0,DHCP,Druid