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);
