js考试题目相关
1. 我们可以在下列哪个HTML元素中放置javascript代码?
A.< script >
B.<javascript >
C.< js >
D.<scripting >
★标准答案:A
2. 预测以下代码片段的输出结果:
var str
alert(typeof str);
A.. string
B..undefined;
C..object
D..String;
★标准答案:B
3. 下列哪个不是Javascript中注释的正确写法:( ) A.< !-- …… -- >
B.//……
C./*……*/
D. /* …… */
★标准答案:A
4. 以下哪项不属于Javascript的特征? A.Javascript是一种脚本语言 B.Javascript是事件驱动的 C.Javascript代码需要编译以后才能执行
D.Javascript是独立于平台的
★标准答案:C
5. 关于以下两个陈述的描述中,正确的是:( ) 陈述1:Javascript是弱类型语言 陈述2:Javascript的常用类型包括:int、string、boolean A.陈述1正确,陈述2错误 B.陈述1错误,陈述2正确
C.两个陈述都正确
D.两个陈述都错误
★标准答案:A
6. 阅读下面的JavaScript代码:
<HTML > < BODY >
<SCRIPT LANGUAGE="JavaScript" >
function f(y) {
varx=y*y;
return x;
}
for(x=0;x< 5;x++) {
y=f(x);
document.writeln(y);
}
< /SCRIPT > < /BODY > </HTML >
输出结果是()。
A.01 2 3 4
B.0 1 4 9 16
C.0 1 4 9 16 25
D.以上答案都不对
★标准答案:B
7. 在Javascript中,需要声明一个整数类型的变量num,以下哪个语句能实现上述要求? A.int num;
B.number num;
C.var num; D.Integer num;
★标准答案:C
8. 关于Javascript中数组的说法中,不正确的是:()
A.数组的长度必须在创建时给定,之后便不能改变
B.由于数组是对象,因此创建数组需要使用new运算符
C.数组内元素的类型可以不同
D.数组可以在声明的同时进行初始化
★标准答案:A
9. 除了一些常规的运算符之外,Javascript还提供了一些特殊的运算符。下面不属于Javascript特殊运算符的是:() A.delete
B.size
C.new
D.typeof ★标准答案:B
10. 以下关于Javascript中事件的描述中,不正确的是:()
A.click——鼠标单击事件
B.focus——获取焦点事件
C.mouseOver——鼠标指针移动到事件源对象上时触发的事件 D.change——选择字段时触发的事件
★标准答案:D
11. 考察以下程序片段: var n = newNumber(3456); alert(n.toFixed(2)); 以下选项正确的是:( )
A.输出34 B.输出 56 C.输出 3456.00 D.输出 345600 ★标准答案:C
12.
考察以下代码片段:
function Student(name) {
this.name = name;
this.move = function() {
alert(this.name+”准备移动了”); } }
Student.prototype.move = function() {
alert(this.name+”开始移动了!”); }
varst = new Student(“李四);
st.study();
下列说法正确的是?
A.输出 ”李四准备移动了” B.输出 ”李四开始移动了” C.输出 ”李四准备移动了 李四开始移动了”” D.程序出错,没有任何输出。 ★标准答案:A
13. 预测以下代码片段的输出结果:function add(i) { var k = i+10; alert(k); } function add(i) { var k = i+20; alert(k); } add(10); A.40 B.20 C.30 D.程序出错
★标准答案:C
14. 预测以下代码片段的输出结果
: var student = new Object(); student.study = function() {window.alert(“开始学习了”); }study(); A.输出“开始学习了”
B.程序出错。不能在实例化对象之后,再添加方法
C.程序出错。study()方法不能直接调用。应该用student来调用
D.程序出错。给student.study赋值时,右边的函数必须有名字 ★标准答案:C
15. 考察以下程序片段: varstr = “32px”; var str1 = str.slice(-2); alert(str); alert(str1); 以下选项正确的是?
A.依次输出”px” “px”
B.依次输出”32” “32”
C.依次输出”32px” “px”
D.依次输出”32px” “32px” ★标准答案:C
16. 考察以下程序片段: var str = “12px”; var s =str.indexof(“2”); alert(s);
以下选项正确的是?
A.输出 1 B.输出 2 C.输出 p D.输出 12 ★标准答案:A
17. 考察以下程序片段:
function Person() {
}
Person.prototype.move = function() {
alert(this.name+“移动”);}
function Student(name) {
this.name = name; }
Student.prototype.study = function() {
alert(this.name+”学习”); }
Student.prototype = new Person(); var st =new Student(“张三丰”);
st.study();
st.move();
以下选项正确的是?
A.依次输出”张三丰学习” “百晓生移动”
B.依次输出”张三丰学习” “移动”
C.输出”张三丰学习” ,之后程序出错
D.程序出错,什么都不能输出
★标准答案:D
18. 以下不属于Javascript原始类型的是:()
A.string B.number
C.function D.boolean ★标准答案:C
19. 以下哪段代码不能正确创建函数show()?
A.function show(text){ alert(text); }
B.var showFun = function show(text){alert(text); }
C.var showFun = function(text){alert(text); }
D.var showFun =newfunction("text" , "alert(text)"}; ★标准答案:D
20. Javascript是如何实现继承的?
A.创建父类对象作为子类的原型(prototype)
B.使用extends关键子继承父类
C.创建子类对象作为父类的原型(prototype)
D.使用class关键子继承父类
★标准答案:A
21. 在JavaScript中,下列哪段代码能够在1秒之后执行表达式expression? A.window.setTimeout(1000,expression);
B.window.setTimeout(expression,1);
C.window.setTimeout(1,expression);
D.window.setTimeout(expression,1000);
★标准答案:D
22. < body onLoad="f1()"onError="f2()' > < inputonFocus="g1()" onBlur()="g2()" > < /body > 下列方法一定会被调用的是:( )
A.f1()
B.f2()
C.g1()
D.g2() ★标准答案:A
23. 以下哪个选项中的方法全部属于window对象:( )
A.alert,clear,close B.clear,close,open C.alert,close,confirm D.alert,setTimeout,write ★标准答案:C
24. 与image对象不相关的事件处理是下列哪项:( )
A.onError
B.onMouseOut
C.onLoad D.onOpen ★标准答案:D
25. 在JavaScript中,如果不指明对象直接调用某个方法,则该方法默认属于哪个对象:() A.document B.window
C.form
D.location
★标准答案:B
26. 打开名为“window2”的新窗口的JavaScript语法是:( ) A.window.new("http://www.w3schools.com","window2")
B.window.open("http://www.w3schools.com","window2","")
C.new("http://www.w3schools.com","window2")
D.new.window("http://www.w3schools.com","window2") ★标准答案:B
27. 如何在浏览器的状态栏放入一条消息:( )
A.statusbar = "put your messagehere"
B.window.status = "put your messagehere"
C.window.status("put your messagehere")
D.status("put your messagehere") ★标准答案:B
28. 与window对象无关的属性是下列哪项:( )
A.top B.self
C.left D.frames ★标准答案:C
29. history从属于window,下列能访问前一页面方法是:( )
A.back(-1) B.back(1) C.forward(1) D.go(-1) ★标准答案:D
30. 关于以下两个陈述的描述中,正确的是:()
陈述1:window对象的confirm方法用于显示一个包括相关信息以及Yes和No这两个按钮的对话框。陈述2:window对象的alert方法用于弹出一个提示窗口,显示提示信息。()
A.陈述1正确,陈述
2错误
B.陈述1错误,陈述2正确
C.陈述1和陈述2均正确
D.陈述1和陈述2均错误 ★标准答案:B
31. 下列不是document对象的属性的是:( )
A.anchors B.forms C.location D.image ★标准答案:D
32. 下列说法有误的是()
A.event是window对象的一个属性,所以可以直接引用event对象
B.不同的浏览器事件处理的方式可能不同
C.对于同一事件,子对象的事件处理函数会覆盖父对象的事件处理函数 D.事件可以增强用户与页面的交互 ★标准答案:C
33. 考察以下代码片段,预测在
IE中打开该页面,点击按钮时的输出结果为:( )
<body>
<form name=”form1”>
<INPUT type="button" name="button1" value="测试按钮" />
</form>
</body>
<script>
document.form1.button1.attachEvent(“onclick”,"alert('被点击了!')"); document.form1.button1.attachEvent(“onclick”,"alert('被点击了……..')");
</script>(10分)
A.输出 “被点击了!”
B.输出 “被点击了……..’”
C.依次输出“被点击了……..” “被点击了!”
D.依次输出“
被点击了!”“被点击了……..” ★标准答案:C
34. 考察以下代码片段,预测输出结果( )
<script>
function handleEvent()
{ alert("我被点击了!");}
document.form1.button1.onclick =handleEvent;
</script>
<body>
<form name=”form1”>
<INPUT type="button" name="button1" value="测试按钮" />
</form>
</body>
A.输出 “我被点击了”
B.没有错误,但也没有任何输出。
C.出现错误,没有任何输出。
D.出现错误,但输出 “我被点击了” ★标准答案:C
35. 考察以下代码片段:
<scripttype="text/JavaScript">
function handleEvent() {
var oTextbox =document.getElementById("txt1");
oTextbox.value += " " + event.type;//event是所触发的事件对象
}
</script> 请在文本框中操作键盘:
<input type="text" id="txt"size="5"
οnkeydοwn="handleEvent()"
οnkeyup="handleEvent()"
οnkeypress="handleEvent()"/>
<textarea id="txt1" rows="6" cols="30"></textarea>----------------------------------------------------------------- 如果光标定位文本框中,敲击键盘的shift键,文本域中的输出结果为:(
)
A.keydown keyup keypress
B.keydown keyup
C.keydown D.keyup
★标准答案:B
36. 分析下面的代码:
< HTML >
< BODY >
< SELECT type="select" name=s1onChange=alert("你选择了"+s1.value) >
<OPTION selected value=select1 >北京< /OPTION>
< OPTION value=select2 >上海</OPTION >
< OPTION value=select3 >广州</OPTION >
< /SELECT >
< /BODY >
</HTML >
下面对结果的描述正确的是:( )。
A.当选中“上海”时,弹出“你选择了select2”信息框
B.当选中“广州”时,弹出“你选择了广州”信息框
C.任何时候选中“北京”时,不弹出信息框
D.代码有错误,应该将“onChange”修改为“onClick”
★标准答案:A
37.下列哪个不是js的事件类型()
A.动作事件
B.鼠标事件
C.键盘事件
D.HTML页面事件 ★标准答案:A
38. 下列关于鼠标事件描述有误的是()
A.click表示鼠标单击
B.dblclick表示鼠标右击
C.mousedown表示鼠标的按钮被按下
D.mousemove表示鼠标进入某个对象范围,并且移动 ★标准答案:B
39. 考察以下代码片段:
<formaction="#" name="form1">
<input type="button" name="button1" value="按钮1"/>
<input type="button" name="button2" value="按钮2"/>
</form>
<script type="text/javascript">
function handleEvent1(){
document.form1.button2.click(); }
function handleEvent2() {
alert(event.srcElement.name+"的"+event.type+"事件被触发!"); } document.form1.button1.onclick = handleEvent1;
document.form1.button2.onclick =handleEvent2;
</script>
如果用户点击了按钮1,此时输出结果为:
A.输出 “button2的click事件被触发!”
B.输出 “button1的click事件被触发!”
C.程序出错,没有输出
D.依次输出“button1的click事件被触发!” “button2的click事件被触发!”
★标准答案:A
40.
下列陈述有误的是()
陈述一:一个button的click事件只能添加一个事件处理函数
陈述二:js事件一旦添加就无法销毁
A.陈述1正确,陈述2错误
B.陈述1错误,陈述2正确
C.两种陈述都正确
D.两种陈述都错误 ★标准答案:D
41. 事件是按照DOM层次结构的由高到低顺序依次触发,则该事件流属于( )
A.冒泡型
B.捕获型
C.DOM型
D.BOM型
★标准答案:B
42 预测以下代码片段运行结果:
var reg = /^\w+,Java\w*$/
var str = “Hello,JavaScript!”;
var b = str.match(reg);
document.write(b);
A.输出Hello,JavaScript! B.输出Java C.输出 null D.输出false ★标准答案:C
43. 下列正则表达式量词符号与含义不匹配的是()
A.{n,}:至少出现n次
B.{n,m}:出现m-n次
C.?:出现0-1次
D.*:出现任意次 ★标准答案:B
44. 下列正则表达式中描述有误的是()
A.[] :匹配范围内的任意一个字符
B.{n:匹配n次
C.\w:匹配任意字母、数字、下划线、符号
D.\d:匹配0-9之间的任意数字 ★标准答案:C
45. 一年有12个月。现要求月份的正确格式为: 1,2,….9,10,11,12。以下哪个正则表达式可以符合要求?
A./^[1-12]$/
B./^[1-9]\d?$/
C./^([1-9]︱1[0-2])$/
D./^\d︱11︱12︱10$/
★标准答案:C
46. 下列与表达式/^[0-9]+$/相符的是()
A.123
B.a123
C.123a
D.a
★标准答案:A
47. 下面那个方法能判断字符串中是否存在和指定正则表达式匹配的字符串;是则返回true,否则返回false:()
A.RegExp对象的test()方法
B.RegExp对象的exec()方法
C.String对象的search()方法
D.String对象的match()方法 ★标准答案:A
48. 关于以下两种陈述,说法正确的是?
陈述1:RegExp的search(str)方法返回字符串中与正则表达式相匹配的字串的位置
陈述2:String的test(str) 方法用于测试字符串是否与正则表达式相匹配。
A.陈述1正确,陈述2错误
B.陈述1错误,陈述2正确
C.两种陈述都正确
D.两种陈述都错误 ★标准答案:D
49. 下列对应关系有误的是()
A.\n 对应换行符
B.\t对应 制表符
C.\r对应 回车符
D.\f 对应空格符 ★标准答案:D
50. 下列与表达式/^\d{3,5$/相符的是()
A.3 B.4 C.5 D.345 ★标准答案:D
51. 下列关于正则表达式的标志与它的含义表达有误的是()
A.i--忽略大小写 B.g--匹配全部
C.m--匹配多行D.*--匹配任意
★标准答案:D
第2部分
1、js中使用typeof能得到哪些类型?
——undefined、string、number、boolean、object、function
2、===和==分别在何时使用?
//==的使用情况为以下2种(其他情况下推荐使用===)
if(obj.a == null){
//相当于obj.a === null || obj.a === undefined
}
function fn(a,b){
if(a == null){
//a要先定义
}
}
3、js中哪些内置函数
——Object、Array、Boolean、Number、String、Function、Date、RegExp、Error
4、js变量按照存储方式区分为哪些类型,并描述其特点
—— 值类型:赋值不会相互干涉;
引用类型:是指针的赋值,都指向内存空间中的同一个对象,会相互干涉;
5、如何理解json
——js对象(有两个API :JSON.stringify() 、JSON.parse())和数据格式
6、如何准确判断一个变量是数组类型
console.log(arr instanceof Array);
7、写一个原型链继承的例子
//DOM封装查询
function Elem(id){
this.elem = document.getElementById(id);
}
Elem.prototype.html = function(val){
var elem = this.elem;
if(val){
elem.innerHTML = val;
return this;
}else{
return elem.innerHTML;
}
}
Elem.prototype.on = function (type,fn){
var elem = this.elem;
elem.addEventListener(type,fn);
return this;
}
var div1 = new Elem('div1');
div1.html('<p>hello world</p>').on('click',function(){
alert('clicked');
}).html('<p>hello javascript</p>');
8、描述new一个对象的过程
—— 1、创建一个新对象
2、this指向这个新对象
3、执行代码,即对this赋值
4、返回this
9、说一下对变量提升的理解
—— 变量定义;
函数声明(注意和函数表达式的区别)
10、说明this几种不同的使用场景
—— 1、作为构造函数执行
2、作为对象属性执行
3、作为普通函数执行
4、call、apply、bind
11、用js创建10个<a>标签,点击的时候弹出来对应的序号
var i;
for(i=0;i<10;i++){
(function(i){
var a = document.createElement('a');
a.innerHTML = i + '<br>';
a.addEventListener('click',function(e){
e.preventDefault();
alert(i);
});
document.body.appendChild(a);
})(i);
}
12、如何理解作用域
—— 自由变量
作用域链,即自由变量的查找
闭包的两个场景(返回函数、作为参数传递)
13、实际开发中闭包的应用
//闭包实际应用中主要用于封装变量,收敛权限
//Exp1
function F1(){
var a =100;
return function(){
console.log(a);
}
}
var f1 = F1();
function F2(fn){
var a = 200;
fn()
}
F2(f1);
//Exp2
function ifFirstLoad(){
var _list =[];
return function(id){
if(_list.indexOf(id)>=0){
return false;
}else{
_list.push(id);
return true;
}
}
}
var firstLoad = isFirstLoad();
firstLoad(10); //true
firstLoad(10); //false
14、同步和异步的区别
——同步会阻塞代码执行,而异步不会。
15、setTimeout()
console.log(1);
setTimeout(function(){
console.log(2);
},1000);
console.log(3);
//1 3 2
16、前端使用异步的场景有哪些
—— 1、setTimeout、setInverval
2、ajax请求、动态<img>加载
3、事件请求
(特点:都需要等待,由js是单线程语言所决定)
17、获取2018-4-26格式的日期
function formatDate(dt){
if(!dt){
dt = new Date();
}
var year = dt.getFullYear();
var month = dt.getMonth() + 1;
var date = dt.getDate();
if(month<10){
month = '0' + month;
}
if(date<10){
dae = '0' +date;
}
return year + '-' + month + '-' + date;
}
var dt = new Date();
var formatDate = formatDate(dt);
console.log(formatDate);
18、获取随机数(要求长度一致的字符串格式)
var random = Math.random();
var random = random + '0000000000';
var random = random.slice(0,10);
console.log(random);
(Math.random():随时改变,清除缓存)
19、写一个能遍历对象和数组的通用的forEach函数
function forEach(obj,fn){
var key;
if(obj instanceof Array){
obj.forEach(function(item,index){
fn(index,item);
});
}else{
for(key in obj){
fn(key,obj[key]);
}
}
}
var arr = [1,2,3];//数组
forEach(arr,function(index,item){
console.log(index,item);
})
var obj = {x:1,y:2};//对象
forEach(obj,function(key,val){
console.log(key,val);
})
20、DOM是哪种基本的数据结构
——树
21、DOM操作的常用API有哪些
—— 1、获取DOM节点,以及节点的property和Attribute
2、获取父节点,获取子节点
3、新增节点,删除节点
(<div><p></p></div>换行与不换行的div的子节点的数量是不一样的)
22、DOM节点的attr和property有何区别
—— property只是一个js对象的属性的修改
Attribute是对html标签属性的修改
23、如何检查浏览器的类型
var ua = navigator.userAgent;
var isChrome = ua.indexOf('Chrome');
console.log(isChrome);
24、拆解url的各部分
location.protocal //"https:"
location.host //"blog.csdn.net"
location.pathname //"/hannah1116"
location.search //""
location.hash //""
location.href //"https://blog.csdn.net/hannah1116"
25、编写一个通用的事件监听函数
function bindEvent(elem,type,selector,fn){
if(fn == null){
fn = selector;
selector = null;
}
elem.addEventListener(type,function(event){
var target;
if(selector){
target = event.target;
if(target.matches(selector)){
fn.call(target,event);
}else{
fn(event);
}
}
});
}
//使用代理
var div1 = document.getElementById("div1");
bindEvent(div1,'click','a',function(event){
console.log(this.innerHTML);
});
//不使用代理
var a = document.getElementById("a1");
bindEvent(div1,'click',function(event){
console.log(a.innerHTML);
});
26、描述事件冒泡流程
—— DOM树形结构
事件冒泡
阻止冒泡
27、对于一个无限下拉加载图片的页面,如何给每个图片绑定事件
—— 使用代理:代码简洁;减少浏览器内存占用;
28、手动编写一个ajax,不依赖第三方库
var xhr = new XMLHttpRequest();
xhr.open(“GET”,”/api”,true);
xhr.onreadystatechange = function(){
if(xhr.readyState == 4){//客户端可以使用
if(xhr.status == 200){//表示成功处理请求
alert(xhr.responseText);
}
}
}
xhr.send(null);
29、跨域的几种方式
—— 1、CORS跨域资源共享
2、图像Ping
3、JSONP
4、Comet
5、服务器发送事件
6、Web Sockets
30、请描述一下cookie,sessionStorage和localStorage的区别
—— cookie:本身用于客户端和服务器端通信,但是有本地存储的功能
缺点:存储量太小,只有4KB;所有http请求都带着,会影响获取资源的效率;API简单,需要封装才能用document.cookie = ……
localStorage和sessionStorage:HTML5专门为存储而设计
优点:最大容量为5M;API简单易用:loaclStorage.setItem(key,value);localStorage.getItem(key);
注意:iOS safari隐藏模式下:localStorage.getItem会报错;建议统一使用try-catch封装;
区别:容量、是否会携带到ajax中、API易用性
31、上线流程和回滚的要点
—— 上线流程要点:
(1)将测试完成的代码提交到git版本库的master分支
(2)将当前服务器的代码全部打包并记录版本号,备份
(3)将master分支的代码提交覆盖到线上服务器,生成新版本号
回滚流程要点:
(1)将当前服务器的代码打包并记录版本号,备份
(2)将备份的上一个版本号解压,覆盖到线上服务器,并生成新的版本号
32、从输入url到得到html的详细过程
—— 1、浏览器根据DNS服务器得到域名的IP地址
2、向这个IP的机器发送HTTP请求
3、服务器收到、处理并返回HTTP请求
4、浏览器得到返回内容
33、window.onload和DOMContentLoaded的区别?
—— window.onload:页面的全部资源加载完才可执行(包括图片、视频)
DOMContentLoaded:DOM渲染完即可执行(此时图片、视频还没有加载完)
34、加载资源优化
—— 1、静态资源的压缩合并
2、静态资源缓存
3、使用CDN让资源加载更快
4、使用SSR后端渲染,数据直接输出到HTML中
35、渲染优化
—— 1、CSS放前面,JS放后面
2、懒加载(图片懒加载、下拉加载更多)
3、减少DOM查询,对DOM查询做缓存
4、减少DOM操作,多个操作尽量合并在一起执行
5、事件节流
6、尽早执行操作(如DOMContentLoaded)
36、代码运行结果
function test(a) {
console.log(a);
var a = 1;
console.log(a);
function a() {}
console.log(a);
var b = function() {}
console.log(b);
function d() {}
}
test(2);