文章目录
前端面试题js篇
1、js的数据类型有哪些？
2、判断一个值类型的方法？
3、说说null和undefined
4、说下“===”和“==”的区别
5、eval是干什么的？
6、var 、let 、const的区别？
7、document.write和innerHTML的区别？
8、v-if和v-show的区别？
9、vue的生命周期是什么？
10、JSON的特点？
11、在JavaScript中( )方法可以对数组元素进行排序？(选择一项)
12、下列JS定义变量正确的是？
13、关于媒体查询，正确的媒体查询表示是?
14、document.onload和document.ready两个事件的区别？
15、JS如何重定向到另一个页面？
16、JS中的主要错误类型有？
17、如何通过类别名获取 dom 元素？
18、JS的作用域链是什么及其作用？
19、 列出JS中的一些设计模式:
20、如何在JavaScript中每x秒调用一个函数？
21、白屏时间first paint和可交互时间dom ready的关系是？
22、如果想为id值为button1的元素设置背景色为红色，下列选项中，做法正确的一项是？
23、以下哪个选项的描述是错误的？
24、关于AngularJS说法，错误的是？
25、下面这段JS程序的执行结果是：？
26、以下那个变量名是非法的? （选择二项）
27、关于javascript变量的声明与赋值,正确的有:)（选择三项）
28、下列语句中,不能够正确调用函数myFun的是: （选择一项）
29、下列选项中,对于Date对象的getMonth()方法返回值描述正确的是？（选择一项）
30、在HTML文档对象模型(HTML DOM)中,history对象的()方法用于加载历史列表中的下一个URL页面() （选择一项）
31、方法setTimeout(“move()”,20)的作用是？（选择一项）
32、setTimeout（）和setInterval（）的区别
33、分析下面的JavaScript代码段，输出结果是？（选择一项）
34、下列哪一个选项不属于document对象的方法（选择一项）
35、光标移到文本框上方时,文本框边框的颜色就改变,这是因为激发了下列的事件？（选择一项）
1、js的数据类型有哪些？
答：Number、Undefined、Null、String、Object、Boolean
2、判断一个值类型的方法？
答：typeof运算符，instanceof运算符，Object.prototype.toString
3、说说null和undefined
答：null表示一个对象已经被定义了，但是值为“空值”。
undefined表示这个值不存在，如：变量声明了，但是没有赋值，这时候就是undefined；调用有参函数时
没有提供参数，等等。
4、说下“===”和“==”的区别
答：“==”：判断是否相等，仅进行值得比较，不尽兴类型的判断。
如：1==“1”》true。
“===”：完全相等，一模一样才是true，判断类型。
如：1===“1”》false。
5、eval是干什么的？
答：eval可以将字符串解析成js可以执行的代码并且执行。eval会执行两次，一次将字符串解析成js可执行的代码，一次执行代码。
6、var 、let 、const的区别？
答：var有变量提升的功能，他可以把变量提升到作用域的最前面；
let不存在变量提升，只能作用域块级作用域。
const用于定义常量，已定义的变量不能再改变。
7、document.write和innerHTML的区别？
答：doucment.wirte绘制整个页面，在整个页面输出。
innerHTML在页面局部绘制，在局部输出。
8、v-if和v-show的区别？
答：v-if只有在值为true的时候才会渲染，他控制的是标签的存在与否，每次都会重建和销毁，-
v-if是惰性的；
v-show也有true和false两个值，但与v-if不同的是，v-show不会销毁标签，而是将标签隐藏起来，dispaly值为none。
v-show虽然首次加载开销较大，但是整体还是比v-if节省。
9、vue的生命周期是什么？
答：开始创建，初始化数据，编译模板，挂载Dom（渲染），更新（渲染），卸载。
或vue从创建开始到销毁的过程。beforCreate(),created(),beforMount(),mounted(),beforUpdate(),updated(),beforDestroy(),destroyed()
10、JSON的特点？
答：1、JSON是一种轻量级的数据交换格式。
2、易于人阅读和编写，同时，也易于机器解析和生成。
3、JSON采用完全独立于语言的文本格式。
11、在JavaScript中( )方法可以对数组元素进行排序？(选择一项)
A.add().
B.push().
C.reverse().
D.sort()
正确答案：D
12、下列JS定义变量正确的是？
A.var 1abcd_bac.
B.var my home.
C.var index.
D.var c$sb.
正确答案：D
13、关于媒体查询，正确的媒体查询表示是?
A.@media.
B.@meida.
C.@medai.
D.@madie.
正确答案：A
14、document.onload和document.ready两个事件的区别？
答：两个都是页面加载完成的事件。
reday表示的是文档结构已加载完成，但不包括图片、视频等非文字媒体资源；
onload表示的是页面包括图片视频的文件资源在内的所有元素加载完成。
15、JS如何重定向到另一个页面？
答：
①使用window.location.href:
window.location.href=“新页面的url地址”
②使用window.location.replace:
window.location.replace(“新的url地址”)
16、JS中的主要错误类型有？
答：
加载时的错误：加载web页面是出现的错误，比如语法错误等。
运行时的错误：滥用html语言中的命令所导致的错误。
逻辑错误：具有不同操作的函数执行不正确逻辑而出现的错误。
17、如何通过类别名获取 dom 元素？
答：
document.getElementsByClassName（）方法可以获取具有类名的元素。
需要注意的是：此方法获得的是一个类数组，不可以直接使用，使用时需要具体到个数。
18、JS的作用域链是什么及其作用？
答：
一般情况下，变量取值在创建这个变量的函数的作用域下取值。但是当这个变量在当前作用域没有取到值时，就会向上一级作用域去查找值，直到查到全局变量，这样一个过程形成的链条就叫做作用域链。
19、 列出JS中的一些设计模式:
设计模式是软件设计中常见问题的通用可重用解决方案，以下是一些设计模式是：
创建模式：该模式抽象了对象实例化过程。
结构型模式：这些模式处理不同的类和对象以提供新功能。
行为模式：也称发布-订阅模式，定义了一个被观察者和多个观察者的、一对多的对象关系。
并行设计模式：这些模式处理多线程编程范例。
架构设计模式：这些模式用于处理架构设计。
20、如何在JavaScript中每x秒调用一个函数？
答：可以使用计时器setInter（）来完成。
setInterval(function(){
执行内容。
},单位ms)；
1
2
3
21、白屏时间first paint和可交互时间dom ready的关系是？
A.先触发first paint ，后触发dom ready
B.先触发dom ready，后触发first paint
C.一起触发
D.没关系
正确答案：A
解析：
白屏时间first paint time：从字面意思上看就是第一次绘制的时间。指的是页面从打开开始到有东西开始呈现出来的这段时间。
可交互时间dom ready：可交互指的就是用户可以对浏览的界面进行操作。可交互时间，用户的正常点击、输入等操作都默认统计为可交互时间dom ready。
先有才能操作，所以前者比后者先触发。
22、如果想为id值为button1的元素设置背景色为红色，下列选项中，做法正确的一项是？
A.document.getElementById(‘button1’).style.backgroundColor=“red”;
B.document.getElementById(‘button1’).style.backgroundcolor=“red”;
C.document.getElementById(‘button1’).style.backGroundColor=“red”;
D.document.getElementById(‘button1’).style.bgcolor=“red”;
正确答案：A
解析：使用js修改元素的css样式时，具体样式需要使用驼峰命名法。
骆驼式命名法（Camel-Case）: 又称驼峰式命名法，是电脑程式编写时的一套命名规则（惯例）。正如它的名称CamelCase所表示的那样，是指混合使用大小写字母来构成变量和函数的名字。（来自百度百科：驼峰命名法）
简单的说就是，在JS中写入css样式时，原css样式存在中横线“-”的要将中横线去掉，中横线后面的第一个字母大写。如：“font-size“ ==》“fontSize”。
23、以下哪个选项的描述是错误的？
A.iframe是用来在网页中插入第三方页面，早期的页面使用iframe主要是用于导航栏这种很多页面都相同的部分，这样在切换页面的时候避免重复下载。
B…iframe的创建比一般的DOM元素慢了1-2个数量级。
C.iframe标签会阻塞页面的的加载。
D.iframe本质是动态语言的Incude机制和利用ajax动态填充内容。
正确答案：D
解析：
1、创建比一般的 DOM 元素慢了 1-2 个数量级
iframe 的创建比其它包括 scripts 和 css 的 DOM 元素的创建慢了 1-2 个数量级，使用 iframe 的页面一般不会包含太多 iframe，所以创建 DOM 节点所花费的时间不会占很大的比重。但带来一些其它的问题：onload 事件以及连接池（connection pool）
2、阻塞页面加载
及时触发 window 的 onload 事件是非常重要的。onload 事件触发使浏览器的 “忙” 指示器停止，告诉用户当前网页已经加载完毕。当 onload 事件加载延迟后，它给用户的感觉就是这个网页非常慢。
window 的 onload 事件需要在所有 iframe 加载完毕后（包含里面的元素）才会触发。在 Safari 和 Chrome 里，通过 JavaScript 动态设置 iframe 的 SRC 可以避免这种阻塞情况
3、唯一的连接池
浏览器只能开少量的连接到 web 服务器。比较老的浏览器，包含 Internet Explorer 6 & 7 和 Firefox 2，只能对一个域名（hostname）同时打开两个连接。这个数量的限制在新版本的浏览器中有所提高。Safari 3+ 和 Opera 9+ 可同时对一个域名打开 4 个连接，Chrome 1+, IE 8 以及 Firefox 3 可以同时打开 6 个
绝大部分浏览器，主页面和其中的 iframe 是共享这些连接的。这意味着 iframe 在加载资源时可能用光了所有的可用连接，从而阻塞了主页面资源的加载。如果 iframe 中的内容比主页面的内容更重要，这当然是很好的。但通常情况下，iframe 里的内容是没有主页面的内容重要的。这时 iframe 中用光了可用的连接就是不值得的了。一种解决办法是，在主页面上重要的元素加载完毕后，再动态设置 iframe 的 SRC。
4、不利于 SEO
搜索引擎的检索程序无法解读 iframe。另外，iframe 本身不是动态语言，样式和脚本都需要额外导入。综上，iframe 应谨慎使用。
来自牛客大佬：https://www.nowcoder.com/test/question/done?tid=59499133&qid=369917#summary
24、关于AngularJS说法，错误的是？
A.前端mvc，极大降低前端开发的耦合。
B.极大的丰富了dom操作。
C.实现了数据双向绑定。
D.实现了依赖注入。
正确答案：B
解析：Angular大大减少了对DOM的访问。 jQuery极大的丰富了DOM操作。
25、下面这段JS程序的执行结果是：？
var user = {
count : 1,
getCount: function(){
return this.count;
}
}
var func = user.getCount
console.log(func())
1
2
3
4
5
6
7
8
A.this.count
B.1
C.报错
D.undefined
参考答案： D
解析：
1.调用对象未声明的属性会undifned
var user={};
console.log(user.name);//undifned
// 2.使用未赋值只声明的基本数据类型会undifned
var one;
console.log(one);//undifned
// 3.使用未声明的变量会报错
console.log(two);//new_file.html:15 Uncaught ReferenceError: two is not defined
1
2
3
4
5
在本题中，this指向的是window,window对象已经自动被浏览器声明了，只是还没有声明count属性，所以也是undifned。
因为func=user.getCount只是保存了getCount函数，并没有执行，该函数是在console里面执行，func()就相当于user.getCount()，一看是像user调用，其实func()就相当于一个全局的函数，实际上是window.func() ,也就是window.user.getCount()。
自牛客大佬：https://www.nowcoder.com/test/question/done?tid=59500810&qid=326124#summary
26、以下那个变量名是非法的? （选择二项）
A. numb_1
B. 2numb
C. function
D. _d2$f
参考答案：B,C
27、关于javascript变量的声明与赋值,正确的有:)（选择三项）
A. var count = 10;
B. var x,y,z=10;
C. int a=10,b=10;
D. x=80;
参考答案：A,B,D
28、下列语句中,不能够正确调用函数myFun的是: （选择一项）
A.
B.
C.
D. myFun()
参考答案：D
29、下列选项中,对于Date对象的getMonth()方法返回值描述正确的是？（选择一项）
A. 返回系统时间的当前月
B. 返回值范围介于1~12之间
C.返回系统时间的但前月+1
D.返回值范围介于0~11之间
参考答案：D
30、在HTML文档对象模型(HTML DOM)中,history对象的()方法用于加载历史列表中的下一个URL页面() （选择一项）
A. next()
B. back()
C.forword()
D.go(-1)
参考答案：C
31、方法setTimeout(“move()”,20)的作用是？（选择一项）
A. 每隔20秒, move()函数会被调用一次.
B. 20秒后, move()函数会被调用一次.
C.每隔20毫秒, move()函数会被调用一次.
D.20毫秒后, move()函数会被调用一次.
参考答案：D
32、setTimeout（）和setInterval（）的区别
答：
setTimeout只运行一次，也就是说设定的时间到后就触发运行指定代码，运行完后即结束；
而setinterval是一直循环运行下去，即每到设定时间间隔就触发指定代码，要想停止，需要使用clearInterval()函数。
33、分析下面的JavaScript代码段，输出结果是？（选择一项）
var s1=parseInt(“101中学”);
document.write(“s1”);
a) NaN
b) 101中学
c) 101
d) 出现脚本错误
参考答案：C
34、下列哪一个选项不属于document对象的方法（选择一项）
A. focus()
B. getElementById()
C.getElementsByName()
D.bgColor()
参考答案：D
35、光标移到文本框上方时,文本框边框的颜色就改变,这是因为激发了下列的事件？（选择一项）
A. onFocus
B. onMouseUp
C.onMouseOver
D.onMouseMove
参考答案：C
————————————————
