JS面試題

時間 2019-11-09

原文原文鏈接

JavaScript常見面試題目javascript

1：javascript的typeof返回哪些數據類型? 6種php

typeof 運算符把數據類型信息看成字符串返回。css

typeof 返回值有六種可能： "number," "string,"
"boolean," "object," "function," 和 "undefined."html

alert(typeof null); // "object"
alert(typeof function () {
return 1;
}); // "function"
alert(typeof '夢龍小站'); // "string"
alert(typeof 1); // "number"
alert(typeof a); // "undefined"
alert(typeof undefined); // "undefined"
alert(typeof []); // "object"前端

2：如何判斷某變量是否爲數組數據類型？ 4種java

Instanceof Array.isArray() toString.call() constructor
1.instanceof操做符
這個操做符和JavaScript中面向對象有點關係，瞭解這個就先得了解JavaScript中的面向對象。由於這個操做符是檢測對象的原型鏈是否指向構造函數的prototype對象的。
var arr = [1,2,3,1];
alert(arr instanceof Array); // true
2.對象的constructor屬性
除了instanceof，每一個對象還有constructor的屬性，利用它彷佛也能進行Array的判斷。node

var arr = [1,2,3,1];
alert(arr.constructor === Array); // truejquery

3.Array.isArray()
ECMAScript5將Array.isArray()正式引入 JavaScript，目的就是準確地檢測一個值是否爲數組。IE9+、 Firefox 4+、Safari 5+、Opera 10.5+和Chrome都實現了這個方法。可是在IE8以前的版本是不支持的。webpack

4.c++

toString.call([]);//」[object Array]」

注意：typeof操做符與instanceof操做符區別

Typeof返回值爲數據類型，好比string，number，boolean，object，function，undefined

考點：使用typeof檢測數據類型（沒法檢測函數之外的對象及類型）；

instanceof返回值是布爾型，判斷一個變量是不是一個對象的實例

2例舉3種強制類型轉換和2種隱式類型轉換?

強制類型轉換：轉數字類型parseInt()，Number()，parseFloat()

轉字符串 String() .toString()

轉布爾型 Boolean()

隱式：轉數字類型 + - * / %

轉字符串 +「」

轉布爾！

隱式類型轉換：JS引擎自動幫咱們轉換的

舉例：==、 console.log()、 alert() 、if() 、+-*/

擴展：經過==比較兩邊的值是否相等的結果？

1==’1’ true

null==undefined true

4.split() join() 的區別?

Split()是將以某種分隔符（參數能夠爲空或者「」），將字符串轉化爲數組

Join()是將以某種分隔符（參數能夠爲空或者「」），將數組轉化爲字符串

四、數組方法pop() push() unshift() shift()

Pop()刪除數組的最後一項，並返回刪除的元素

Push（）在數組末尾添加一個元素，並返回新數組的長度

Unshift（）在數組首部添加一個元素，並返回新數組的長度

Shift（）刪除數組的第一項，並返回刪除的元素

五、事件綁定和普通事件有什麼區別 2 ???

事件綁定是：addEventListener(「click」，「function（）{}」)

普通事件是：對象.onclick=function（）{}

<div id="box"></div>
<script>
    var btn = document.getElementById("box");
    // 普通事件不支持添加多個事件，最下面的事件會覆蓋上面的，只會alert（2）
    //    btn.onclick = function () {
    //        alert(1);
    //    }
    //    btn.onclick = function () {
    //        alert(2);
    //    }

    // 事件綁定支持添加多個事件會alert（1）再alert（2）
    btn.addEventListener("click", function () {
        alert(1);
    });
    btn.addEventListener("click", function () {
        alert(2);
    });
</script>

一、區別就是事件綁定能夠添加多個事件，而普通事件只支持單個事件

二、事件綁定就是針對dom元素的事件，綁定在dom元素上
普通事件即爲非針對dom元素的事件

普通事件：給html元素添加一個特定的屬性（好比：onclick）

div1.onclick=function(){};

事件綁定：js代碼中經過標記(id tag class)獲取元素，給元素添加特定的方法(好比onclick)

傳統事件綁定和符合W3C標準的事件綁定有什麼區別？

div1.onclick=function(){};

一、若是說給同一個元素綁定了兩次或者屢次相同類型的事件，那麼後面的綁定會覆蓋前面的綁定

二、不支持DOM事件流事件捕獲階段è目標元素階段=>事件冒泡階段

addEventListener

一、若是說給同一個元素綁定了兩次或者屢次相同類型的事件，全部的綁定將會依次觸發

二、支持DOM事件流的

三、進行事件綁定傳參不須要on前端

addEventListener(「click」,function(){},false);//此時的事件就是在事件冒泡階段執行

ie9開始，ie11 edge：addEventListener

ie9之前：attachEvent/detachEvent

一、進行事件類型傳參須要帶上on前綴

二、這種方式只支持事件冒泡，不支持事件捕獲

事件綁定是指把事件註冊到具體的元素之上，n

六、IE和DOM事件流的區別

IE採用冒泡型事件 DOM使用先捕獲後冒泡型事件

1.執行順序不同、
2.參數不同
3.事件加不加on
4.this指向問題=

示例：
複製代碼代碼以下:
<body>
<div>
<button>點擊這裏</button>
</div>
</body>
冒泡型事件模型： button->div->body (IE事件流)
捕獲型事件模型： body->div->button (Netscape事件流)
DOM事件模型： body->div->button->button->div->body (先捕獲後冒泡)

8.IE和DOM事件流的區別?

事件流是描述頁面接收事件的順序。
具體的有：事件冒泡，事件捕獲，DOM事件流。
一、事件冒泡又叫IE的事件流，即事件開始時由最具體的元素（文檔中嵌套層次最深的那個節點）接收，而後逐級向上傳播到較爲不具體的節點（文檔）。
二、事件捕獲的思想是不太具體的節點應該更早的接收到事件，而最具體的節點應該在最後接收到節點。事件捕獲的用意在於事件到達預約目標以前捕獲它。
三、DOM2級事件流規定的事件流包括三個階段：事件捕獲階段、處於目標階段和冒泡階段。首先發生的是事件捕獲，爲截獲事件提供了機會。而後是實際的目標接收到事件。最後一個階段是冒泡階段，能夠在這個階段對事件做出響應。

8.IE和DOM事件流的區別?

IE9之前：attachEvent(「onclick」)、detachEvent(「onclick」)

IE9開始跟DOM事件流是同樣的，都是addEventListener

比較attachEvent和addEventListener：

一、attachEvent只支持事件冒泡 addEventListener既支持事件冒泡，也支持事件捕獲
二、參數：attachEvent事件類型須要on前綴 addEventListener事件類型不須要on前綴

三、若是使用attachEvent對一個元素的目標階段綁定了屢次事件，那麼會按照綁定順序的相反順序進行觸發

若是使用addEventListener對一個元素的目標階段綁定了屢次事件，那麼會按照綁定順序進行觸發

七、IE和標準下有哪些兼容性的寫法

Var ev = ev || window.event
document.documentElement.clientWidth || document.body.clientWidth
Var target = ev.srcElement||ev.target

a、獲取事件對象：var ev = ev || window.event

var ev=ev?ev:window.evnet;

srcElement：IE9以前的瀏覽器用來獲取事件目標元素

target：IE9+、ff、chrome用來獲取事件的目標元素

b、獲取事件目標元素：var target = ev.srcElement||ev.target

c、innerText

八、call和apply的區別

考點：call和apply的用法

call和apply相同點：改變函數中this的指向

不一樣點：函數參數的傳遞形式

call將函數參數依次傳入

apply將函數參數用一個數組的形式傳入

無參數調用：

function fn(){
alert(this.name);
}
var p1={name:1};
fn.call(p1);
fn.apply(p1);

有參數調用：

function fn2(name,age){
this.name=name;
this.age=age;
}
var p1={};
fn2.call(p1,"張三",20);
fn2.apply(p1,["張三",20]);

九、如何實現js中的繼承

考點：繼承的多種方式（參考高設6.3）

// 方式1：實例繼承原生原型對象

function Fn() {}

Fn.prototype.itcast = 'XXX';

var obj = new Fn();

```

---

```

// 方式2：實例繼承自定義的原型對象

function Fn() {}

Fn.prototype = {

itcast : 'XXX'

};

var obj = new Fn();

// 方式3：copy繼承

function extend(obj, obj2) {

for (var key in obj2) {

obj[key] = obj2[key];

}

var obj1 = {

a : 1,

b : 2

};

var obj2 = {};

extend(obj2, obj1);

```

// 方式4：擴充(經過extend函數)構造函數原生原型對象的屬性方式

function extend(obj, obj2) {

for (var key in obj2) {

obj[key] = obj2[key];

}

var itcast = {

name : 'XXX'

};

function Fn() {}

extend(Fn.prototype, itcast);

var obj = new Fn();

```

---

```

// 方式5 獲取一個新對象，讓新對象的__proto__(原型對象)指針指向傳入的對象。

var itcast = {

name : 'XXX'

};

var obj = Object.create(itcast);

```

---

```

// 方式6 間接繼承方式1：覆蓋構造函數的原型屬性，

讓該屬性的指針指向另一個對象，這個對象繼承實例真正要繼承的對象。

別名：寄生組合式繼承

var itcast = {

name : 'XXX'

};

function Fn() {}

Fn.prototype = Object.create(itcast);

var obj = new Fn();

```

----

```

//方式7 間接繼承方式2：子類的原型屬性(prototype)指針指向父類的事例

別名：類式繼承

function FnP() {}

Fnp.prototype.itcast = 'XXX';

function Fn() {}

Fn.prototype = new FnP();

var obj = new Fn();

十、JavaScript this、閉包、做用域

this：指向調用上下文

做用域：定義一個函數就開闢了一個局部做用域，整個js執行環境有一個全局做用域

閉包：一個函數能夠訪問其餘函數中的變量（閉包是一個受保護的變量空間）

var f=(function fn(){
    var name=1;
    return function(){
        name++;
        console.log(name);
    }
})();

十一、事件委託是什麼

什麼是事件委託：通俗的講，事件就是onclick，onmouseover，onmouseout，等就是事件，委託呢，就是讓別人來作，這個事件原本是加在某些元素上的，然而你卻加到別人身上來作，完成這個事件。

也就是：利用冒泡的原理，把事件加到父級上，觸發執行效果。

好處呢：1，提升性能。好處2，新添加的元素還會有以前的事件。

事件委託就是利用事件冒泡，只指定一個事件處理程序，就能夠處理某一類型的全部事件

利用事件冒泡的原理，將事件綁定在父容器中，讓父容器代爲觸發

十二、閉包是什麼，有什麼特性，對頁面有什麼影響

若是在一個內部函數裏，對在外部做用域（但不是在全局做用域）的變量進行引用，那麼內部函數就被認爲是閉包（closure）。

閉包的返回值和函數的返回值定義方式是同樣的：若是有return語句，則返回值是return語句後面的內容；若是沒有return語句，則閉包內的最後一行代碼就是它的返回值。

閉包的實質是一個函數，是一個用於返回局部變量值的函數，由於在全局中，受JavaScript鏈式做用域結構的影響，父級變量中沒法訪問到子級的變量值，爲了解決這個問題，才使用閉包這個概念。因爲閉包時，變量的值都保存到內存中，會致使頁面加載時內存消耗很大，IE會致使內在泄露，所以儘可能少用或用時要及時刪除變量。

閉包就是可以讀取其餘函數內部變量的函數。

閉包的缺點：

1 更多的內存消耗

2 性能問題（跨做用域訪問）

3濫用閉包函數會形成內存泄露，由於閉包中引用到的包裹函數中定義的變量都永遠不會被釋放，因此咱們應該在必要的時候，及時釋放這個閉包函數

閉包是一種特殊的對象。它由兩部分構成：函數，以及建立該函數的環境。

能夠把閉包簡單理解成「定義在一個函數內部的函數」，閉包就是將函數內部和函數外部鏈接起來的一座橋樑。閉包有以下特性：

a. JavaScript容許你使用在當前函數之外定義的變量

b. 即便外部函數已經返回，當前函數仍然能夠引用在外部函數所定義的變量

c. 閉包能夠更新外部變量的值

d. 用閉包模擬私有方法

因爲閉包會使得函數中的變量都被保存在內存中，內存消耗很大，因此不能濫用閉包，不然會形成網頁的性能問題

1三、如何阻止事件冒泡和默認事件

方法以下

//阻止事件冒泡

function stopBubble(e) {

// 若是提供了事件對象，則這是一個非IE瀏覽器

if ( e && e.stopPropagation ) {

// 所以它支持W3C的stopPropagation()方法

e.stopPropagation();

} else {

// 不然，咱們須要使用IE的方式來取消事件冒泡

window.event.cancelBubble = true;

}

//阻止事件默認行爲

function stopDefault(e) {

// 阻止默認瀏覽器動做(W3C)

if ( e && e.preventDefault ) {

e.preventDefault();

} else {

// IE中阻止函數器默認動做的方式

window.event.returnValue = false;

}

return false;

}

阻止事件冒泡：

IE9+ FF Chrome：e. stopPropagation();

return false;

window.event.cancelBubble=true;//ie9以前

默認行爲：html標籤所具備的默認行爲，好比：

a、點擊a標籤，就會默認跳轉到指定的頁面

b、點擊submit按鈕，就會自動提交表單

適用場景：

一、異步操做

二、提交表單以前對錶單進行一些基本的驗證，好比郵箱是否合法，用戶名是否是知足指定的格式

爲了避免讓a點擊以後跳轉，咱們就要給他的點擊事件進行阻止

三、文本框得到焦點

阻止默認行爲：

IE9以前：window.event.returnValue=false;

IE9+ FF Chrome： e.preventDefault();

1四、添加刪除替換插入到某個節點的方法

obj.appendChlid() removeChlid() replaceChlid() insertBefore()參數1：被插入的元素

參數2：目標元素

1五、javascript的本地對象，內置對象和宿主對象(有網電腦在查)

簡單地回答就是

本地對象爲Array RegExp等能夠new實例化

內置對象爲global Math 等不能夠實例化的

宿主爲瀏覽器自帶的document,window 等

本地對象：由ECMAScript實現提供的、獨立於宿主環境的對象

，包括：Object Function Array

String Boolean Number Date RegExp Error EvalError RangeError...等能夠new實例化

內置對象：

由ECMAScript實現提供的、獨立於宿主環境的全部對象

Global和Math等不能夠實例化的

宿主對象：全部的非本地對象都是宿主對象，由ECMAScript實現的宿主環境提供的對象，全部的Bom Dom對象都是宿主對象，宿主爲瀏覽器自帶的document,window 等

1六、Document load 和document ready的區別

頁面加載完成時有兩個事件：ready 和 onload

Document.onload,指頁面包含圖片等在內的全部元素都加載完成

Document.ready ，表示文檔結構已經加載完成（不包含圖片等非文字媒體文件）

Dom Ready是在dom加載完成後就能夠直接對dom進行操做，好比一張圖片只要<img>標籤完成，不用等這個圖片加載完成，就能夠設置圖片的寬高的屬性或樣式等；

Dom Load是在整個document文檔（包括了加載圖片等其餘信息）加載完成後就能夠直接對dom進行操做，好比一張圖片要等這個圖標加載完成以後才能設置圖片的寬高的屬性或樣式等；

document.onload 是在結構和樣式加載完才執行js

document.ready原生中沒有這個方法，jquery中有 $().ready(function)

DOMCententLoaded事件：頁面的文檔結構（DOM樹）加載完以後就會觸發

window.onload：不只僅要在結構和樣式加載完，還要執行完全部的外部樣式、圖片這些資源文件，所有加載完纔會觸發window.onload事件

1七、」==」和「===」的不一樣

一、前者會自動轉換類型後者不會

二、前者只是判斷數值是否相等，後者會判斷數之和類型是否相等

==：會自動轉換類型

===：先判斷左右兩邊的數據類型，若是數據類型不一致，直接返回false

以後纔會進行兩邊值的判斷

1==」1」

null==undefined;//==true

1八、javascript的同源策略 ×

一段腳本只能讀取來自於同一來源的窗口和文檔的屬性，這裏的同一來源指的是主機名、協議和端口號的組合

http,ftp:協議

關鍵詞解釋：

主機名：localhost、www.baidu.com

協議：http https ftp

端口：一個網站對應着一個端口， http協議的默認端口：80

https協議的默認端口是8083

同源策略帶來的麻煩：ajax在不一樣域名下的請求沒法實現，

若是說想要請求其餘來源的js文件，或者json數據，那麼能夠經過jsonp來解決

跨域解決方式一

跨域解決方式二

1九、編寫一個數組去重的方法

定義空數組+利用for循環嵌套+定義及判斷標誌

20、JavaScript是一門什麼樣的語言，它有哪些特色？

JavaScript 是一種腳本語言，官方名稱爲 ECMAScript（因定義語言的標準爲 ECMA-262）。JS 的主要特色：

語法相似於常見的高級語言，如 C 和 Java；
腳本語言，不須要編譯就能夠由解釋器直接運行
變量鬆散定義，屬於弱類型語言；

4. 面向對象（基於對象）的。
JS 最初是爲網頁設計而開發的，如今也是 Web 開發的重要語言。它支持對瀏覽器（瀏覽器對象模型，BOM）和 HTML 文檔（文檔對象模型，DOM）進行操做，而使網頁呈現動態的交互特性。
嚴格的說，JS 只是 ECMAScript 的一種實現，是 ECMAScript 和 BOM、DOM 組成的一種 Web 開發技術。

弱類型、腳本語言、面向對象、

沒有標準答案。

運行環境：JS引擎（v8(Chrome)/SpiderMonkey(FireFox)/JavaScriptCore(Safari)

/Chakra(IE)）

語言特性：

一、面向對象：原型繼承、構造函數、原型鏈

二、動態語言：弱類型語言

//動態語言的特性
var num=10;//num是一個數字類型
num="jim";//此時num又變成一個字符串類型

//咱們把一個變量用來保存不一樣數據類型的語言稱之爲一個動態語言
//靜態語言：c# java c c++ OC

//int a;
//靜態語言在聲明一個變量就已經肯定了這個變量的數據類型，
// 並且在任什麼時候候都不能夠改變他的數據類型

2一、JavaScript的數據類型都有什麼？

基本數據類型：String,Boolean,Number,Undefined, Null 5

引用數據類型：Object(Array,Date,RegExp,Function等) 1

2二、已知ID的Input輸入框，但願獲取這個輸入框的輸入值，怎麼作？(不使用第三方框架)

document.getElementById(‘id’).value value屬性

1	document.getElementById(「ID」).value

2三、但願獲取到頁面中全部的checkbox怎麼作？(不使用第三方框架)

var domList = document.getElementsByTagName(‘input’)

var checkBoxList = [];

var len = domList.length;　　//緩存到局部變量

while (len--) {　　//使用while的效率會比for循環更高

　　if (domList[len].type == ‘checkbox’) {

　　checkBoxList.push(domList[len]);

　　}

2四、設置一個已知ID的DIV的html內容爲xxxx，字體顏色設置爲黑色(不使用第三方框架)

var dom = document.getElementById(「ID」);

dom.innerHTML = 「xxxx」

dom.style.color = 「#000」;//」black」

2五、當一個DOM節點被點擊時候，咱們但願可以執行一個函數，應該怎麼作？

直接在DOM裏綁定事件：<div onclick=」test()」></div>
在JS裏經過onclick綁定：xxx.onclick = test
經過事件添加進行綁定：addEventListener(xxx, ‘click’, test)

HTML事件綁定：<div onclick=」test()」></div>

DOM0事件綁定：xxx.onclick = test

DOM2事件綁定：addEventListener(div1, ‘click’, test)

擴展：Javascript的事件流模型都有什麼？

事件流：

從最不肯定的元素(最外層容器)到目標元素，再由目標元素到最不肯定的元素(最外層容器)；

也就是說先經歷事件捕獲，到目標元素，再經歷事件冒泡

「事件冒泡」：事件開始由最具體的元素接受，而後逐級向上傳播

「事件捕捉」：事件由最不具體的節點先接收，而後逐級向下，一直到最具體的

2六、看下列代碼輸出爲什麼？解釋緣由。

var a;

alert(typeof a); // undefined

//alert(b); // 報錯 b is not defined

b=10;

alert(typeof b);//number

解釋：Undefined是一個只有一個值的數據類型，這個值就是「undefined」，在使用var聲明變量但並未對其賦值進行初始化時，這個變量的值就是undefined。而b因爲未聲明將報錯。注意未申明的變量和聲明瞭未賦值的是不同的。

undefined產生狀況：

一、一個變量定義了卻沒有被賦值

二、想要獲取一個對象上不存在的屬性或者方法:

三、一個數組中沒有被賦值的元素

四、調用函數，參數未傳

擴展：not defined語法錯誤

2七、看下列代碼,輸出什麼？解釋緣由。

vara =null;

alert(typeof a);//object

Null可認爲是空對象

2八、看下列代碼,輸出什麼？解釋緣由。

var undefined;//此時undefined這個變量的值是undefined

undefined == null; // true null和其餘數據都爲false

1 == true; // true

此時會把布爾類型的值轉換爲數字類型 true=1 false=0

2 == true; // false

0 == false; // true

0 == ''; // true

NaN == NaN; // false isNaN NaN和任何數據都爲false

[] == false; // true 解釋：會把[]和false都經過Number()轉換爲數字類型

[] == ![]; // true 解釋：![]：false

[]==[];//false

一個是number一個是string時，會嘗試將string轉換爲number

一個是number一個是boolean，將boolean轉換爲number，結果：true：1 false：0

一個是object 另外一個是string或number，將Object轉換成number或string

因此，對於0、空字符串的判斷，建議使用「===」。「===」會先判斷兩邊的值類型，類型不匹配時爲false。

// 比較規律：

// NaN 和任何數據比較，結果都爲false

// null 和其餘數據類型比較，結果都爲false，undefined除外

// undefined 和其餘數據類型比較，結果都爲false，null除外

// 對象與對象比較，比較的是地址

// 對象與字符串比較，會把對象轉換爲字符串以後再比較

// 其餘數據類型(null和undefined除外)和數值比較時，會把其餘數據類型轉換爲數值再比較

// 其餘數據類型(null和undefined除外)和布爾比較時，會把兩邊數據都轉換爲數值再比較

// switch 和 break

28.二、看下列代碼會有什麼樣的輸出？（不用再看）

var foo = "11"+2-"1";

console.log(foo);

console.log(typeof foo);

2九、看代碼給答案。（不用再看）

var a = new Object();

a.value = 1;

b = a; //b.value=1

b.value = 2;//b.value=2;a.value=2，由於a和b指向同一塊引用類型的值

alert(a.value);//2

30、已知數組var stringArray = [「This」, 「is」, 「Baidu」, 「Campus」]，alert出」This is Baidu Campus」。

考點：數組的join方法的使用

var stringArray = ['This', 'is', 'Baidu', 'Campus'];
alert(stringArray.join(" "));

30.二、已知有字符串foo=」get-element-by-id」,寫一個function將其轉化成駝峯表示法」getElementById」。

function combo(msg){

var arr=msg.split("-");//[get,element,by,id]

for(var i=1;i<arr.length;i++){

arr[i]=arr[i][0].toUpperCase()+arr[i].substring(1);//Element

}

msg=arr.join("");//msg=」 getElementById」

return msg;

}

3一、var numberArray = [3,6,2,4,1,5];

1) 實現對該數組的倒排，輸出[5,1,4,2,6,3]

function reverseArray(arr){
    var result=[];
    //方法1：
    /*for (var i = arr.length - 1; i >= 0; i--) {
        result.push(arr[i]);
    }*/
    //方法2：
    for (var i = 0, len = arr.length; i < len; i++) {
        result.unshift(arr[i]);
    }
    return result;
}

本身寫的：

var numberArray = [3,6,2,4,1,5];
var fanzhuan = numberArray.reverse();
console.log(fanzhuan);//[5, 1, 4, 2, 6, 3]

2) 實現對該數組的降序排列，輸出[6,5,4,3,2,1]

第一層for是比較的趟數-1 第二層for 是兩兩比較的次數-1-i

3二、輸出今天的日期，以YYYY-MM-DD的方式，好比今天是2014年9月26日，則輸出2014-09-26

考點：日期對象Date相關API的使用

var d = new Date();

// 獲取年，getFullYear()返回4位的數字

var year = d.getFullYear();

// 獲取月，月份比較特殊，0是1月，11是12月

var month = d.getMonth() + 1;

// 變成兩位

month = month < 10 ? '0' + month : month;

// 獲取日

var day = d.getDate();

day = day < 10 ? '0' + day : day;

alert(year + '-' + month + '-' + day);

3三、將字符串」<tr><td>{$id}</td><td>{$name}</td></tr>{$id}」中的{$id}替換成10，{$name}替換成Tony （使用正則表達式）

考點：正則表達式、字符串的replace方法的使用

答案：」<tr><td>{$id}</td><td>{$id}_{$name}</td></tr>」.replace(/{\$id}/g, ’10′).replace(/{\$name}/g, ‘Tony’);

3四、爲了保證頁面輸出安全，咱們常常須要對一些特殊的字符進行轉義，請寫一個函數escapeHtml，將<, >, &, 「進行轉義

function escapeHtml(str) {

//[<>」&]:中括號中字符只要其中的一個出現就表明知足條件

//給replace第二個參數傳遞一個回調函數，回調函數中參數就是匹配結果，若是匹配不到就是null

return str.replace(/[<>」&]/g, function(match) {

switch (match) {

case 「<」:

return 「<」;

case 「>」:

return 「>」;

case 「&」:

return 「&」;

case 「\」」://雙引號包裹一個單引號：「’」單引號包裹一個雙引號 ‘」」’

return 「"」;

}

});

}

3五、foo = foo||bar ，這行代碼是什麼意思？爲何要這樣寫？

考點：if條件的真假斷定

記住如下是false的狀況：空字符串、false、undefined、null、0

這種寫法稱之爲短路表達式

至關於：

var foo;
if(foo){
foo=foo;
}else{
foo=bar;
}

答案：經常使用於函數參數的空判斷

短路表達式：做爲」&&」和」||」操做符的操做數表達式，這些表達式在進行求值時，只要最終的結果已經能夠肯定是真或假，求值過程便了結止，這稱之爲短路求值。

3六、看下列代碼，將會輸出什麼?（不用看）

考點：一、變量做用域二、變量聲明提高

var foo = 1;

function f(){

console.log(foo);

var foo = 2;

console.log(foo);

}

f(); 輸出undefined 和 2。

3七、用js實現隨機選取10–100之間的10個數字，存入一個數組，並排序。

var iArray = [];

function getRandom(istart, iend){

var iChoice = iend - istart +1;

return Math.floor(Math.random() * iChoice+ istart);

}

Math.random()就是獲取0-1之間的隨機數（永遠獲取不到1）

for(var i=0; i<10; i++){

var result= getRandom(10,100);

iArray.push(result);

}

iArray.sort();

3八、把兩個數組合並，並刪除第二個元素。

考點：一、數組的concat、splice用法

splice() 方法刪除數組的元素，或者向數組中添加元素，而後返回被刪除的項目。

參數1：從何處開始刪除數組的元素（使用負數則從數組的末尾開始）

參數2：要刪除的元素個數（若是是0，就表明不刪除）

參數3，4，5。。。：要添加的元素

var array1 = ['a','b','c'];

var bArray = ['d','e','f'];

var cArray = array1.concat(bArray);

cArray.splice(1,1);

3九、怎樣添加、移除、移動、複製、建立和查找節點（使用原生JS）

1）建立新節點

createDocumentFragment() //建立一個DOM文檔片斷

createElement() //建立一個具體的元素

createTextNode() //建立一個文本節點

2）添加、移除、替換、插入

appendChild() //追加

removeChild() //移除

replaceChild() //替換

insertBefore() //插入

3）查找

getElementsByTagName() //經過標籤名稱

getElementsByName() //經過元素的Name屬性的值

getElementsByTagName() // 經過類名查找

getElementById() //經過元素Id，惟一性

40、有這樣一個URL：http://item.taobao.com/item.htm?a=1&b=2&c=&d=xxx&e，請寫一段JS程序提取URL中的各個GET參數(參數名和參數個數不肯定)，將其按key-value形式返回到一個json結構中，如{a:’1′, b:’2′, c:」, d:’xxx’, e:undefined}。

答案：

function serlize(url){
    var result={};
    //一、尋找？後面的字符串
    url=url.substr(url.indexOf("?")+1);
    //二、將字符串用&分隔
    var args=url.split("&");//[「a=1」,」b=2」]
    for (var i = 0, len = args.length; i < len; i++) {
        var arg = args[i];

var item = arg.split('=');
        //三、對象的鍵=值
        result[item[0]]= item[1];
    }
    return result;
}
serlize('http://item.taobao.com/item.htm?a=1&b=2&c=&d=xxx&e');

4一、正則表達式構造函數var reg=new RegExp(「xxx」)與正則表達字面量var reg=//有什麼不一樣？匹配郵箱的正則表達式？

RegExp

答案：當使用RegExp()構造函數的時候，不只須要轉義引號（即\」表示」），而且還須要雙反斜槓（即\\表示一個\）。使用正則表達字面量的效率更高。

郵箱的正則匹配：

var regMail = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/;

41.二、.看下面代碼，給出輸出結果。

for(var i=1;i<=3;i++){

setTimeout(function(){

console.log(i);

},0);

}

答案：4 4 4。

考點：setTimeout的執行原理——Javascript事件處理器在線程空閒以前不會運行。

JavaScript運行機制：事件循環

追問，如何讓上述代碼輸出1 2 3？

代碼1：用當即執行函數

for(var i=1;i<=3;i++){
    setTimeout((function(num){
        return function(){
            console.log(num);
        }

    })(i),0);
}

代碼2：使用閉包

for(var i=1;i<=3;i++){
    setTimeout((function(){
        var j=i;
        return function(){
            console.log(j);
        };
    })(),0);
}

4二、寫一個function，清除字符串先後的空格。（兼容全部瀏覽器）

使用自帶接口trim()，考慮兼容性(IE9如下瀏覽器不支持)：

考點：一、原型擴展二、正則表達式3、字符串的replace方法

if(typeof String.prototype.trim !="function"){
    String.prototype.trim=function(){
        return this.replace(/^\s+|\s+$/g,"");
    }
}
var str=" hello ";

4三、Javascript中callee和caller的做用？

arguments.callee：得到當前函數的引用

fn.caller是返回一個對函數的引用，該函數調用了當前函數；（被廢棄）

callee是返回正在被執行的function函數，也就是所指定的function對象的正文。

44、Javascript中, 如下哪條語句必定會產生運行錯誤？答案( BC )

A、var _變量=NaN;

B、var 0bj = [];

C、var obj = //;

D、var obj = {};

//正確答案：BC

4五、如下兩個變量a和b，a+b的哪一個結果是NaN？答案( C )

A、var a=undefind; b=NaN //拼寫

B、var a=‘123’; b=NaN

C、var a =undefined , b =NaN

D、var a=NaN , b='undefined'

解析：A、拼寫錯誤 B、結果是字符串 D、結果是字符串

46、var a=10; b=20; c=4; ++b+c+a++ 如下哪一個結果是正確的？答案( B )

考點：++運算符的使用 21+4+10=35

A、34 B、35 C、36 D、37

//var a=10; b=20; c=4;

//++b+c+a++
//21+4+10=35;

var a = 1;

a++ + a++ = ？

a = 1;

a++ + ++a = ?

a = 1;

++a + a++ = ?

a = 1;

++a + ++a = ?

4七、下面的JavaScript語句中，（ D ）實現檢索當前頁面中的表單元素中的全部文本框，並將它們所有清空

A. for(vari=0;i< form1.elements.length;i++) {

if(form1.elements.type==」text」)

form1.elements.value=」";

}

B. for(vari=0;i<document.forms.length;i++) {

if(forms[0].elements.type==」text」)

forms[0].elements.value=」";

}

C. if(document.form.elements.type==」text」)

form.elements.value=」";

D. for(vari=0;i<document.forms.length; i++){

var form= document.forms[i];

for(var j=0;j< form.elements.length; j++){

if(form [j].type==」text」)

form.elements [j].value=」";

}

4八、要將頁面的狀態欄中顯示「已經選中該文本框」，下列JavaScript語句正確的是（ A ）

A. window.status=」已經選中該文本框」

B. document.status=」已經選中該文本框」

C. window.screen=」已經選中該文本框」

D. document.screen=」已經選中該文本框」

4九、如下哪條語句會產生運行錯誤：（A、D）

A.var obj = ();B.var obj = [];C.var obj = {};D.var obj = //;

50、如下哪一個單詞不屬於javascript保留字：（B）

A.withB.parentC.classD.void

5一、請選擇結果爲真的表達式：（C）

考點：一、instanceof：用於檢測某個對象是否是某個構造函數的實例

2、==、===用於數據類型的判斷

A.null instanceof ObjectB.null === undefinedC.null == undefinedD.NaN == NaN

5二、Javascript中, 若是已知HTML頁面中的某標籤對象的id=」username」，用__document.getElementById(‘username’)_ _方法得到該標籤對象。

5三、typeof運算符返回值中有一個跟javascript數據類型不一致，它是」function」。

考點：type運算符

5四、定義了一個變量，但沒有爲該變量賦值，若是alert該變量，javascript彈出的對話框中顯示_undefined____ 。

5五、分析代碼，得出正確的結果。

var a=10, b=20 , c=30;

++a;

a++;

e=++a+(++b)+(c++)+a++;//13+21+30+13

alert(e);

彈出提示對話框：77

var a=10, b=20 , c=30;
++a;//a=11
a++;//a=11
e=++a+(++b)+(c++)+a++;
//a=12 13+21+30+13=77
alert(e);

5六、寫出函數DateDemo的返回結果，系統時間假定爲今天

function DateDemo(){

var d, s="今天日期是：";

d = new Date();

s += d.getMonth() + "/";

s += d.getDate() + "/";

s += d.getFullYear();

return s;}

考點：Date對象的api使用，

注意點：getMonth()打印的是比當前月份小1的數字

結果：今天日期是：

5七、寫出程序運行的結果？

for(var i=0, j=0; i<10, j<6; i++, j++){
//循環結束條件：j=5 i=5
k = i + j;//k=10
}
//結果：10

for循環

解析：最終的結果其實就是程序運行的最後一個表達式的值

這裏考的是逗號運算符的特性；

5八、閱讀如下代碼，請分析出結果：

var arr = new Array(1 ,3 ,5);

arr[4]='z'; //arr=[1,3,5,undefined,’z’]

arr2 = arr.reverse(); //arr2=[’z’,undefined,5,3,1];

//arr=[’z’,undefined,5,3,1]

arr3 = arr.concat(arr2);

alert(arr3);

考點：reverse 方法顛倒數組中元素的位置，並返回該數組的引用。

答案：彈出：z,,5,3,1,z,,5,3,1

5九、補充按鈕事件的函數，確認用戶是否退出當前頁面，確認以後關閉窗口； <html>

考點：confirm的用法

<head>

function closeWin(){

//在此處添加代碼

if(confirm("肯定要退出嗎？")){
window.close();
}

}

</script>

</head>

<body>

</body>

</html>

60、寫出簡單描述html標籤（不帶屬性的開始標籤和結束標籤）的正則表達式，並將如下字符串中的html標籤去除掉

考點：正則表達式以及replace()的使用

var str = 「<div>這裏是div<p>裏面的段落</p></div>」;

<scripttype=」text/javascript」>

var reg = /<\/?\w+\/?>/gi;//img br hr

x?	匹配問號前面的內容出現0 或 1 次。

var str = 「<div>這裏是div<p>裏面的段落</p></div>」;

alert(str.replace(reg,」"));

</script>

6一、完成foo()函數的內容，要求可以彈出對話框提示當前選中的是第幾個單選框。

<html>

<head>

<metahttp-equiv=」Content-Type」 content=」text/html;charset=utf-8″ />

</head>

<body>

function foo() {

//在此處添加代碼

var rdo =document.form1.radioGroup;//表單下面的全部的單選框

for(var i =0 ;i<rdo.length;i++){

if(rdo[i].checked){

alert(「您選擇的是第」+(i+1)+」個單選框」);

}

document.getElementsByTagName(「input」)[4].onclick = function(e) {

e.preventDefault();

foo();

};

</script>

<body>

</form>

</body>

</html>

6二、完成函數showImg()，要求可以動態根據下拉列表的選項變化，更新圖片的顯示

考點：一、下拉框切換：onchange事件二、經過value獲取下拉框的值

function showImg (oSel) {

//在此處添加代碼

var str = oSel.value;

document.getElementById(「pic」).src= str+」.jpg」;

}

</script>

<br />

</select>

6三、截取字符串abcdefg的efg

alert('abcdefg'.substring(4));

6四、列舉瀏覽器對象模型BOM裏經常使用的至少4個對象，並列舉window對象的經常使用方法至少5個

對象：window document location screen history navigator

方法：alert() confirm() prompt() open() close()

6五、簡述列舉文檔對象模型DOM裏document的經常使用的查找訪問節點的方法並作簡單說明

document.getElementById 根據元素id查找元素

document.getElementsByName 根據元素name查找元素

document.getElementsByTagName 根據指定的元素名查找元素

6六、但願獲取到頁面中全部的checkbox怎麼作？(不使用第三方框架)

var domList = document.getElementsByTagName(‘input’)

var checkBoxList = [];

var len = domList.length;　　//緩存到局部變量

while (len--) {

　　if (domList[len].type == ‘checkbox’) {

　　checkBoxList.push(domList[len]);

　　}

6八、javascript中有哪幾種數據類型，分別寫出中文和英文。

string boolean number null undefined object

字符串布爾數值空值未定義對象

6九、javascript中==和===的區別是什麼？舉例說明。

==會自動進行類型轉換，好比：1==」1」，數字和字符串比較，會將非數字轉變爲數字

===不會，好比：1===」1」因爲兩邊數據類型不一致，因此結果必然是false

70、簡述建立函數的幾種方式

第一種（函數聲明）：

function sum1(num1,num2){

return num1+num2;

}

第二種（函數表達式）：

var sum2 = function(num1,num2){

return num1+num2;

}

匿名函數：沒有函數名稱，沒法經過函數名稱調用

function(){}:只能本身執行本身

第三種（Function構造函數方式）：

var sum3 = new Function("num1","num2","return num1+num2");

7一、Javascript如何實現繼承？

原型鏈繼承，借用構造函數繼承，組合繼承，寄生式繼承，寄生組合繼承

7二、Javascript建立對象的幾種方式？

構造函數方式，原型模式，混合構造函數原型模式，工廠方式，動態原型方式

混合構造函數+原型模式：

function Robot(name){
this.name=name;
}
Robot.prototype.say=function(){
alert("你們好，我叫"+this.name);
};
var alphaGo=new Robot("阿爾法狗");
alphaGo.say();

工廠方式：

function create(name,age){
    var o={};
    o.name=name;
    o.age=age;

return o;
}
var p1=create("張三",20);

動態原型方式：

function Person(name,work){
    this.name=name;
    if(work){
        Person.prototype.doWork=function(){
            alert("我正在從事"+work+"的工做");
        }
    }
}
var p1=new Person("姚明");
var p2=new Person("喵喵","程序猿鼓勵師");

7三、把 Script 標籤放在頁面的最底部的body封閉以前和封閉以後有什麼區別？瀏覽器會如何解析它們？

若是說放在body的封閉以前，將會阻塞其餘資源的加載

若是放在body封閉以後，不會影響body內元素的加載

7四、iframe的優缺點？

優勢：

1. 解決加載緩慢的第三方內容如圖標和廣告等的加載問題

二、並行加載腳本

缺點：

一、iframe會阻塞主頁面的onload事件

二、即時內容爲空，加載也須要時間，由於須要http請求

三、不便於SEO

四、內外網頁維護麻煩

7五、請你談談Cookie的弊端？

什麼是Cookie？Cookie是指某些網站爲了辨別用戶身份或進行session跟蹤而儲存在用戶本地瀏覽器終端上的數據。通常來講，Cookie經過HTTP Headers從服務器端返回到瀏覽器上。首先，服務器端在響應中利用Set-Cookie header來建立一個Cookie ，而後，瀏覽器在它的請求中經過Cookie header包含這個已經建立的Cookie，而且把它返回至服務器，從而完成瀏覽器的驗證。

Cookie的保存形式
IE 瀏覽器將站點的 Cookie 保存在文件名格式爲 @.txt 的文件中，其中是您的賬戶名。例如，若是您的名稱爲 user，您訪問的站點爲 www.codetc.com，那麼該站點的 Cookie 將保存在名爲 user@codetc.com.txt 的文件中。（該文件名可能包含一個順序的編號，如 user@codetc.com [1].txt。） Cookie 文本文件是與用戶相關的，因此會按照賬戶分別保存。

Cookie的限制
一個 Cookie 大約佔用 50 個字符的基本空間開銷（用於保存有效期信息等），再加上其中保存的值的長度，其總和接近 4K 的限制。大多數瀏覽器只容許每一個站點保存 20 個 Cookie。

爲何選擇把信息保存到cookie中
因爲session在使用過程當中會形成極大的網絡負擔，隨之帶來的就是性能問題，所認咱們能夠把session以Cookie的形式保存在客戶端。固然有時候也是爲了完成某些特定的功能而使用cookie，好比實現記住密碼和自動登陸。

優勢：是極高的擴展性和可用性
經過良好的編程，控制保存在cookie中的session對象的大小。
經過加密和安全傳輸技術（SSL），減小cookie被破解的可能性。
只在cookie中存放不敏感數據，即便被盜也不會有重大損失。
控制cookie的生命期，使之不會永遠有效。偷盜者極可能拿到一個過時的cookie。

缺點：數量限制和安全問題
Cookie是有數量和長度限制的。每一個domain最多隻能有20條cookie，每一個cookie長度不能超過4KB，不然會被截掉。
安全性問題。若是cookie被人攔截了，那人就能夠取得全部的session信息。即便加密也與事無補，由於攔截者並不須要知道cookie的意義，他只要原樣轉發cookie就能夠達到目的了。
有些狀態不可能保存在客戶端。例如，爲了防止重複提交表單，咱們須要在服務器端保存一個計數器。若是咱們把這個計數器保存在客戶端，那麼它起不到任何做用。

缺點：

1.`Cookie`數量和長度的限制。每一個domain最多隻能有20條cookie，每一個cookie長度不能超過4KB，不然會被截掉。

2.安全性問題。若是cookie被人攔截了，那人就能夠取得全部的session信息。即便加密也與事無補，由於攔截者並不須要知道cookie的意義，他只要原樣轉發cookie就能夠達到目的了。

3.有些狀態不可能保存在客戶端。例如，

1、爲了防止重複提交表單，咱們須要在服務器端保存一個計數器。若是咱們把這個計數器保存在客戶端，那麼它起不到任何做用。

2、好比用戶密碼輸入錯誤超過3次，咱們應該在後端數據庫中保存錯誤數據

7六、DOM操做——怎樣添加、移除、移動、複製、建立和查找節點。3-4-3

CreatElement() creatTextNode() creatDocumentFragment() 3

obj.appendChild() removeChild() insertBefore() replaceChild() 4

document.getElementById() document.getElementsByName() 3

document.getElementsByTagName()

1. 建立新節點

createDocumentFragment() // 建立一個DOM片斷

createElement() // 建立一個具體的元素

createTextNode() // 建立一個文本節點

2. 添加、移除、替換、插入

appendChild()

removeChild()

replaceChild()

insertBefore() // 在已有的子節點前插入一個新的子節點

3. 查找

getElementsByTagName() // 經過標籤名稱

getElementsByName() // 經過元素的Name屬性的值(IE容錯能力較強，會獲得一個數組，其中包括id等於name值的)

getElementById() // 經過元素Id，惟一性

7七、js延遲加載的方式有哪些？

1. defer和async

defer：當文檔加載完成以後執行

async：異步執行腳本

2. 動態建立DOM方式

建立script，插入到DOM中，加載完畢後callBack）

7八、documen.write和 innerHTML 的區別？

document.write 指定位置輸出

dom.innerHTML 能夠重繪指定元素的內容

document.write和innerHTML的區別

7九、哪些操做會形成內存泄漏？

內存泄漏指任何對象在您再也不擁有或須要它以後仍然存在。

垃圾回收器按期掃描對象，並計算引用了每一個對象的其餘對象的數量。若是一個對象的引用數量爲 0（沒有其餘對象引用過該對象），或對該對象的唯一引用是循環的，那麼該對象的內存便可回收。

1. setTimeout 的第一個參數使用字符串而非函數的話，會引起內存泄漏。

2. 閉包

3. 控制檯日誌

內存泄漏的幾種狀況

8三、判斷一個字符串中出現次數最多的字符，統計這個次數

答：var str = 'asdfssaaasasasasaa';
var json = {};
for (var i = 0; i < str.length; i++) {
if(!json[str.charAt(i)]){
json[str.charAt(i)] = 1;// json[str[i]] = 1;
}else{
json[str.charAt(i)]++;
}
};
var iMax = 0;
var iIndex = '';
for(var i in json){
if(json[i]>iMax){
iMax = json[i];
iIndex = i;
}
}
alert('出現次數最多的是:'+iIndex+'出現'+iMax+'次');

8四、javascript的typeof返回哪些數據類型

Object number function boolean underfind

8五、例舉3種強制類型轉換和2種隱式類型轉換?

強制（parseInt,parseFloat,number）

隱式（== – ===）

8六、split() join() 的區別

前者是切割成數組的形式，後者是將數組轉換成字符串

8七、數組方法pop() push() unshift() shift()

push()尾部添加 shift() 尾部刪除

unshift() 頭部添加 shift() 頭部刪除

9三、寫一個獲取非行間樣式的函數

dom.style.color;//行內的color屬性的值

function getStyle(obj,attr)

{

if(obj.currentStyle)//ie9以前

{

return obj.currentStyle[attr];

}

else{//ie9+ 標準瀏覽器

window.getComputedStyle(obj,null)[attr];

}

9五、閉包是什麼，有什麼特性，對頁面有什麼影響

閉包就是可以讀取其餘函數內部變量的函數。

閉包此連接可查看（問這個問題的不是一個公司）

9六、解釋jsonp的原理，以及爲何不是真正的ajax

動態建立script標籤，回調函數

Ajax是頁面無刷新請求數據操做

9九、字符串反轉，如將 '12345678' 變成 '87654321'

//大牛作法；

//思路：先將字符串轉換爲數組 split()，利用數組的反序函數 reverse()顛倒數組，再利用 join() 轉換爲字符串

var str = '12345678';

str = str.split('').reverse().join('');

Ajax

Ajax交互

阿里-面試題

100、將數字 12345678 轉化成 RMB形式如： 12,345,678

//我的方法；

//思路：先將數字轉爲字符， str= str + '' ;

//利用反轉函數，每三位字符加一個 ','最後一位不加； re()是自定義的反轉函數，最後再反轉回去！

for(var i = 1; i <= re(str).length; i++){

tmp += re(str)[i - 1];

if(i % 3 == 0 && i != re(str).length){

tmp += ',';

}

10一、生成5個1-10之間不一樣的隨機數；

考點：Math.random()：結果0-1之間

function getFiveRandomNumber(){
    var arr=[];
    while(arr.length<5){
        var number=Math.floor(Math.random()*10) + 1;
        if(arr.indexOf(number)<0){
            arr.push(number);
        }
    }
    return arr;
}

10二、去掉數組中重複的數字

方法一；

//思路：每遍歷一次就和以前的全部作比較，不相等則放入新的數組中！

//這裏用的原型我的作法；

Array.prototype.unique = function(){

var len = this.length,

newArr = [],

flag = 1;

for(var i = 0; i < len; i++, flag = 1){

for(var j = 0; j < i; j++){

if(this[i] == this[j]){

flag = 0; //找到相同的數字後，不執行添加數據

}

flag ? newArr.push(this[i]) : '';

}

return newArr;

}

方法二：

(function(arr){

var len = arr.length,

newArr = [],

flag;

for(var i = 0; i < len; i+=1, flag = 1){

for(var j = 0; j < i; j++){

if(arr[i] == arr[j]){

flag = 0;

}

flag?newArr.push(arr[i]):'';

}

alert(newArr);

})([1, 1, 22, 3, 4, 55, 66]);

**10三、階乘函數；987*65…1**

//原型方法

Number.prototype.N = function(){

var re = 1;

for(var i = 1; i <= this; i++){

re *= i;

}

return re;

}

var num = 5;

alert(num.N());

10四、window.location.search返回的是什麼？

答：查詢(參數)部分。除了給動態語言賦值之外，咱們一樣能夠給靜態頁面,並使用javascript來得到相信應的參數值

返回值：?ver=1.0&id=timlq 也就是問號後面的！

//url:http://www.sina.com/getage?number=1&year=2016

10五、window.location.hash 返回的是什麼？

答：反正當前頁面的錨點

若是網頁的地址爲：http://www.sina.com/getage?#age

window.location.hash就會返回」#age」

10六、window.location.reload() 做用？

答：刷新當前頁面。

10七、阻止冒泡函數

function stopPropagation(e) {

e = e || window.event;

if(e.stopPropagation) { //W3C阻止冒泡方法

e.stopPropagation();

} else {

e.cancelBubble = true; //IE阻止冒泡方法

}

document.getElementById('need_hide').onclick = function(e) {

stopPropagation(e);

}

10八、什麼是閉包？寫一個簡單的閉包？；

答：閉包就是可以讀取其餘函數內部變量的函數。在本質上，閉包就是將函數內部和函數外部鏈接起來的一座橋樑。

function outer(){

var num = 1;

function inner(){

var n = 2;

alert(n + num);

}

return inner;

}

outer()();

10九、javascript 中的垃圾回收機制？

答：在Javascript中，若是一個對象再也不被引用，那麼這個對象就會被GC回收。若是兩個對象互相引用，而再也不被第3者所引用，那麼這兩個互相引用的對象也會被回收。由於函數a被b引用，b又被a外的c引用，這就是爲何函數a執行後不會被回收的緣由。

1十、看題作答：

function f1(){

var tmp = 1;

this.x = 3;

console.log(tmp); //A

console.log(this.x)； //B

}

var obj = new f1(); //1 ==>1 3

console.log(obj.x) //2 ==>3

console.log(f1()); //3 ==>1 3 undefined

分析：

這道題讓我從新認識了對象和函數，首先看代碼（1），這裏實例話化了 f1這個類。至關於執行了 f1函數。因此這個時候 A 會輸出 1，而 B 這個時候的 this 表明的是實例化的當前對象 obj B 輸出 3.。代碼（2）毋庸置疑會輸出 3，重點代碼（3）首先這裏將再也不是一個類，它只是一個函數。那麼 A輸出 1， B呢？這裏的this 表明的其實就是window對象，那麼this.x 就是一個全局變量至關於在外部的一個全局變量。因此 B 輸出 3。最後代碼因爲f沒有返回值那麼一個函數若是沒返回值的話，將會返回 underfined ，因此答案就是： 1， 3， 3， 1， 3， underfined 。

1十一、下面輸出多少？

var o1 = new Object();

var o2 = o1;

o2.name = "CSSer";

console.log(o1.name);

若是不看答案，你回答正確了的話，那麼說明你對javascript的數據類型瞭解的仍是比較清楚了。js中有兩種數據類型，分別是：基本數據類型和引用數據類型（object Array）。對於保存基本類型值的變量，變量是按值訪問的，由於咱們操做的是變量實際保存的值。對於保存引用類型值的變量，變量是按引用訪問的，咱們操做的是變量值所引用（指向）的對象。答案就清楚了： //CSSer;

1十二、下面代碼的輸出結果？

function changeObjectProperty (o) {

o.siteUrl = "http://www.csser.com/";

o = new Object();

o.siteUrl = "http://www.popcg.com/";

}

var CSSer = new Object();

changeObjectProperty(CSSer);

console.log(CSSer.siteUrl); //

若是CSSer參數是按引用傳遞的，那麼結果應該是"http://www.popcg.com/"，但實際結果卻還是"http://www.csser.com/"。事實是這樣的：在函數內部修改了引用類型值的參數，該參數值的原始引用保持不變。咱們能夠把參數想象成局部變量，當參數被重寫時，這個變量引用的就是一個局部變量，局部變量的生存期僅限於函數執行的過程當中，函數執行完畢，局部變量即被銷燬以釋放內存。

（補充：內部環境能夠經過做用域鏈訪問全部的外部環境中的變量對象，但外部環境沒法訪問內部環境。每一個環境均可以向上搜索做用域鏈，以查詢變量和函數名，反之向下則不能。）

11三、輸出多少？

var a = 6;

setTimeout(function () {

var a = 666;//因爲變量a是一個局部變量

alert(a); // 輸出666，

}, 1000);

console.log(a);

a = 66;

由於var a = 666;定義了局部變量a，而且賦值爲666，根據變量做用域鏈，
全局變量處在做用域末端，優先訪問了局部變量，從而覆蓋了全局變量。

var a = 6;

setTimeout(function () {

//變量聲明提早

alert(a); // 輸出undefined

var a = 666;

}, 1000);

a = 66;

由於var a = 666;定義了局部變量a，一樣覆蓋了全局變量，可是在alert(a);以前
a並未賦值，因此輸出undefined。

var a = 6;
setTimeout(function(){
alert(a);
var a = 66;
}, 1000);
a = 666;
alert(a);
//結果：666 undefined

記住：異步處理，一切OK 聲明提早

11四、輸出多少？

function setN(obj){

obj.name='屌絲';

obj = new Object();

obj.name = '腐女';

};

var per = new Object();

setN(per);

alert(per.name); //屌絲內部

11五、JS的繼承性

window.color = 'red';

var o = {color: 'blue'};

function sayColor(){

alert(this.color);

}

考點：一、this的指向

二、call的用法

sayColor(); //red

sayColor.call(this); //red this指向的是window對象

sayColor.call(window); //red

sayColor.call(o); //blue

11七、加減運算

alert('5'+3); //53 string

alert('5'+'3'); //53 string

alert('5'-3); //2 number

alert('5'-'3'); //2 number

11八、什麼是同源策略？

指：同協議、端口、域名的安全策略，由網景(Netscape)公司提出來的安全協議！

11九、call和apply的區別是什麼？

參數形式不一樣，call(obj, pra, pra)後面是單個參數。apply(obj, [args])後面是數組。

12一、結果是什麼？

考點：一個函數做爲一個普通函數和做爲一個構造函數

function foo(){

foo.a = function(){alert(1)};

this.a = function(){alert(2)};

a = function(){alert(3)};

var a = function(){alert(4)};

};

foo.prototype.a = function(){alert(5)};

foo.a = function(){alert(6)};

foo.a(); //6

var obj = new foo();

obj.a(); //2

foo.a(); //1

12二、輸出結果

考點：變量做用域、this的使用

var a = 5;

function test(){

a = 0;

alert(a);

alert(this.a); //沒有定義 a這個屬性

var a;

alert(a)

}

test(); // 0, 5, 0

new test(); // 0, undefined, 0 //因爲類它自身沒有屬性a，因此是undefined

12三、計算字符串字節數：

考點：字符串的charCodeAt方法

charCodeAt

function getByte(s){

if(!arguments.length||!s) return null;

if(""==s) return 0; //無效代碼，由於上一句!s已經判斷過

var l=0;

for(var i=0;i<s.length;i++){

if(s.charCodeAt(i)>255) l+=2; else l+=1; //charCodeAt()獲得的是uniCode碼

} //漢字的uniCode碼大於 255bit 就是兩個字節

alert(l);

}

getByte("hello world!");

12四、如下代碼將會產生什麼樣的結果？

考點：!（邏輯非）運算符的使用

var bool = !!2; alert(bool)；//true;

技巧：編程中常用雙向非操做能夠把字符串和數字轉換爲布爾值。

12五、聲明對象，添加屬性，輸出屬性

考點：this的使用

var obj = {

name: 'leipeng',

showName: function(){

alert(this.name);

}

obj.showName();

12六、匹配輸入的字符：第一個必須是字母或下劃線開頭，後面就是字母和數字或者下劃線構成，長度5-20

考點：正則表達式

var reg = /^[a-zA-Z_][a-zA-Z0-9_]{4,19}$/,

name1 = 'leipeng',

name2 = '0leipeng',

name3 = '你好leipeng',

name4 = 'hi';

alert(reg.test(name1));

alert(reg.test(name2));

alert(reg.test(name3));

alert(reg.test(name4));

12七、檢測變量類型

考點：typeof運算符

function checkStr(str){

return typeof str == 'string';

}

alert(checkStr('leipeng'));

12八、如何在HTML中添加事件，幾種方法？

一、標籤之中直接添加 onclick="alert(‘歡迎來到XXX學習’)";

2、標籤之中添加 onclick="fun()";

12九、BOM對象有哪些，列舉window對象？

一、window對象，是JS的最頂層對象，其餘的BOM對象都是window對象的屬性；

二、document對象，文檔對象；

三、location對象，瀏覽器當前URL信息；

四、navigator對象，瀏覽器自己信息；

五、screen對象，客戶端屏幕信息；

六、history對象，瀏覽器訪問歷史信息；

130、請問代碼實現 outerHTML

//說明：outerHTML其實就是innerHTML再加上自己；

<!doctype html>

<html>

<head>

<title>Document</title>

</head>

<body>

hello

</div>

Function getOuerHTML(element) {

Var d = document.createElement(「div」);

d.appendChild(element);

d = null;

return d.innerHTML;

}

function $(id){

return document.getElementById(id);

}

Console.log(getOuterHTML($(「d」)));

</script>

</body>

</html>

13一、JS中的簡單繼承（使用call方法實現！）

考點：call()

//頂一個父母類，注意：類名都是首字母大寫的哦！

function Parent(name, money){

this.name = name;

this.money = money;

this.info = function(){

alert('姓名： '+this.name+' 錢： '+ this.money);

}

//定義孩子類

function Children(name){

Parent.call(this, name); //繼承姓名屬性，不要錢。

this.info = function(){

alert('姓名： '+this.name);

}

//實例化類

var per = new Parent('parent', 800000000000);

var chi = new Children('child');

per.info();

chi.info();

13二、bind(), live(), delegate()的區別

bind：綁定事件，對新添加的事件不起做用，方法用於將一個處理程序附加到每一個匹配元素的事件上並返回jQuery對象。

live：方法將一個事件處理程序附加到與當前選擇器匹配的全部元素（包含現有的或未來添加的）的指定事件上並返回jQuery對象。

delegate：方法基於一組特定的根元素將處理程序附加到匹配選擇器的全部元素（現有的或未來的）的一個或多個事件上。

jQuery1.7+推薦使用：on() off()

13四、簡述link和import的區別？

link和import的區別

區別1：link是XHTML標籤，除了加載CSS外，還能夠定義RSS等其餘事務；@import屬於CSS範疇，只能加載CSS。

區別2：link引用CSS時，在頁面載入時同時加載；@import須要頁面網頁徹底載入之後加載。

區別3：link是XHTML標籤，無兼容問題；@import是在CSS2.1提出的，低版本的瀏覽器不支持。

區別4：link支持使用Javascript控制DOM去改變樣式；而@import不支持。

13六、解析URL成一個對象？

String.prototype.urlQueryString = function(){

var url = this.split('?')[1].split('&'),

len = url.length;

this.url = {};

for(var i = 0; i < len; i += 1){

var cell = url[i].split('='),

key = cell[0],

val = cell[1];

this.url[''+key+''] = val;

}

return this.url;

}

var url = '?name=12&age=23';

console.log(url.urlQueryString().age);

13七、看下列代碼輸出什麼？

var foo = "11"+2-"1";
console.log(foo);
console.log(typeof foo);

執行完後foo的值爲111，foo的類型爲Number。

13八、看下列代碼,輸出什麼？

考點：內存、引用類型

var a = new Object();

a.value = 1;

b = a;

b.value = 2;

alert(a.value);

執行完後輸出結果爲2

14二、原生JS的window.onload與Jquery的$(document).ready(function(){})有什麼不一樣？

　　window.onload()方法是必須等到頁面內包括圖片的全部元素加載完畢後才能執行。

$(document).ready()是DOM結構繪製完畢後就執行，至關於DOMContentLoaded事件，沒必要等到加載完畢。

14三、你如何優化本身的代碼？

A、代碼重用（函數封裝）

B、避免使用過多的全局變量（命名空間，封閉空間，模塊化mvc..）

C、拆分函數避免函數過於臃腫：單一職責原則

D、將面向過程的編程方式改成使用面向對象編程

E、適當的註釋，尤爲是一些複雜的業務邏輯或者是計算邏輯，都應該寫出這個業務邏輯的具體過程

F、內存管理，尤爲是閉包中的變量釋放

14四、請描述出下列代碼運行的結果

考點：this的使用

function d(){

console.log(this);

}

d();//window

14五、須要將變量e的值修改成「a+b+c+d」,請寫出對應的代碼

var e=」abcd」;

設計一段代碼可以遍歷下列整個DOM節點

<div>

<p>

</p>

<ul>

</ul>

</div>

14七、使用js實現這樣的效果：在文本域裏輸入文字時，當按下enter鍵時不換行，而是替換成「{{enter}}」,(只須要考慮在行尾按下enter鍵的狀況).

考點：onkeydown事件、keyCode屬性

textarea.onkeydown=function(e){

e.preventDefault();//爲了阻止enter鍵的默認換行效果

if(e.keycode==」enter鍵碼」){ //鍵碼：108

testarea.value+=」{{enter}}」;

}

14八、如下代碼中end字符串何時輸出

考點：while循環、setTimeout的使用

var t=true;

setTimeout(function(){

console.log(123);

t=false;

},1000);

while(t){}// 此時是一個死循環，永遠不可能執行setTimeout中的回調函數

console.log(‘end’);

14九、specify(‘hello,world’)//=>’h,e,l,l,o,w,o,r,l,d’實現specify函數

考點：split方法和join方法的使用

function specify(str){

return str= "hello,world".split(",").join("").split("").join(",");

}

150、請將一個URL的search部分參數與值轉換成一個json對象

//search部分的參數格式：a=1&b=2&c=3

15一、請用原生js實現jquery的get\post功能

1、建立XMLHttpRequest對象

function createXMLHTTPRequest() {

//1.建立XMLHttpRequest對象

//這是XMLHttpReuquest對象無部使用中最複雜的一步

//須要針對IE和其餘類型的瀏覽器創建這個對象的不一樣方式寫不一樣的代

var xmlHttpRequest;

if (window.XMLHttpRequest) {

//針對FireFox，Mozillar，Opera，Safari，IE7，IE8

xmlHttpRequest = new XMLHttpRequest();

//針對某些特定版本的mozillar瀏覽器的BUG進行修正

if (xmlHttpRequest.overrideMimeType) {

xmlHttpRequest.overrideMimeType("text/xml");

}

} else if (window.ActiveXObject) {

//針對IE6，IE5.5，IE5

//兩個能夠用於建立XMLHTTPRequest對象的控件名稱，保存在一個的數組中

//排在前面的版本較新

var activexName = [ "MSXML2.XMLHTTP", "Microsoft.XMLHTT" ];

for ( var i = 0; i < activexName.length; i++) {

try {

//取出一個控件名進行建立，若是建立成功就終止循

//若是建立失敗，回拋出異常，而後能夠繼續循環，繼續嘗建立

xmlHttpRequest = new ActiveXObject(activexNamei]);

if(xmlHttpRequest){

break;

}

} catch (e) {

}

return xmlHttpRequest;

}

2、get請求

function get(){
var req = createXMLHTTPRequest();
if(req){
req.open("GET", "http://test.com/?keywords=手機", true);
req.onreadystatechange = function(){
if(req.readyState == 4){
if(req.status == 200){
alert("success");
}else{
alert("error");
}
}
}
req.send(null);
}
}

3、post請求

function post(){

var req = createXMLHTTPRequest();

if(req){

req.open("POST", "http://test.com/", true);

req.setRequestHeader("Content-Type","application/x-www-form-urlencoded; charset=gbk;");

req.send("keywords=手機");

req.onreadystatechange = function(){

if(req.readyState == 4){

if(req.status == 200){

alert("success");

}else{

alert("error");

}

15二、請簡要描述web前端性能須要考慮哪方面，你的優化思路是什麼？

//參見雅虎14web優化規則

//減小http請求：

//一、小圖弄成大圖，精靈圖

//二、合理的設置緩存

//三、資源合併、壓縮

//四、將外部的js文件置底

//五、內存管理：合理釋放閉包函數

15三、簡述readyonly與disabled的區別

readonly只針對input(text / password)和textarea有效，

而disabled對於全部的表單元素都有效，當表單元素在使用了disabled後，當咱們將表單以POST或GET的方式提交的話，這個元素的值不會被傳遞出去，而readonly會將該值傳遞出去

15六、寫出3個使用this的典型應用

構造函數中使用this，原型對象中使用this，對象字面量使用this

15七、請儘量詳盡的解釋ajax的工做原理

思路：先解釋異步，再解釋ajax如何使用

Ajax的原理簡單來講經過XmlHttpRequest對象來向服務器發異步請求，從服務器得到數據，而後用javascript來操做DOM而更新頁面。這其中最關鍵的一步就是從服務器得到請求數據。要清楚這個過程和原理，咱們必須對 XMLHttpRequest有所瞭解。

　XMLHttpRequest是ajax的核心機制，它是在IE5中首先引入的，是一種支持異步請求的技術。簡單的說，也就是javascript能夠及時向服務器提出請求和處理響應，而不阻塞用戶。達到無刷新的效果。

15八、爲何擴展javascript內置對象不是好的作法？

由於擴展內置對象會影響整個程序中所使用到的該內置對象的原型屬性

15九、請解釋一下javascript的同源策略

域名、協議、端口相同

16一、瀏覽器標準模式和怪異模式之間的區別是什麼？

標準模式是指，瀏覽器按W3C標準解析執行代碼；

怪異模式則是使用瀏覽器本身的方式解析執行代碼，由於不一樣瀏覽器解析執行的方式不同，因此咱們稱之爲怪異模式。

瀏覽器解析時到底使用標準模式仍是怪異模式，與你網頁中的DTD聲明直接相關，DTD聲明定義了標準文檔的類型（標準模式解析）文檔類型，會使瀏覽器使用相應的方式加載網頁並顯示，忽略DTD聲明,將使網頁進入怪異模式

16二、若是設計中使用了非標準的字體，你該如何去實現？

先經過font-face定義字體，再引用

@font-face

{

font-family: myFirstFont;

src: url('Sansation_Light.ttf'),

url('Sansation_Light.eot'); /* IE9+ */

}

16四、module(12,5)//2 實現知足這個結果的modulo函數

function modulo(a,b){
return a%b;//return a/b;
}

16五、HTTP協議中，GET和POST有什麼區別？分別適用什麼場景？

get傳送的數據長度有限制，post沒有

get經過url傳遞，在瀏覽器地址欄可見，post是在報文中傳遞

適用場景：

post通常用於表單提交

get通常用於數據查詢，或者嚴格要求不是那麼高的場景

16六、HTTP狀態消息200 302 304 403 404 500分別表示什麼

200：請求已成功，請求所但願的響應頭或數據體將隨此響應返回。

302：請求的資源臨時從不一樣的 URI響應請求。因爲這樣的重定向是臨時的，客戶端應當繼續向原有地址發送之後的請求。只有在Cache-Control或Expires中進行了指定的狀況下，這個響應纔是可緩存的

304：若是客戶端發送了一個帶條件的 GET 請求且該請求已被容許，而文檔的內容（自上次訪問以來或者根據請求的條件）並無改變，則服務器應當返回這個狀態碼。304響應禁止包含消息體，所以始終以消息頭後的第一個空行結尾。

403：服務器已經理解請求，可是拒絕執行它。

404：請求失敗，請求所但願獲得的資源未被在服務器上發現。

500：服務器遇到了一個不曾預料的情況，致使了它沒法完成對請求的處理。通常來講，這個問題都會在服務器端的源代碼出現錯誤時出現。

16七、HTTP協議中，header信息裏面，怎麼控制頁面失效時間（last-modified,cache-control,Expires分別表明什麼）

Last-Modified	文檔的最後改動時間。客戶能夠經過If-Modified-Since請求頭提供一個日期，該請求將被視爲一個條件GET，只有改動時間遲於指定時間的文檔纔會返回，不然返回一個304（Not Modified）狀態。Last-Modified也可用setDateHeader方法來設置。
Expires	應該在何時認爲文檔已通過期，從而再也不緩存它？

16八、HTTP協議目前經常使用的有哪幾個？KEEPALIVE從哪一個版本開始出現的？

http1.0、http1.1

http1.1 keeplive

170、列舉經常使用的web頁面開發，調試以及優化工具

sublime vscode webstorm hbuilder dw

httpwatch=>ie

ff:firebug

chrome:

17一、解釋什麼是sql注入

17三、請列舉js數組類型中的經常使用方法

方法	描述
concat()	鏈接兩個或更多的數組，並返回結果。
join()	把數組的全部元素放入一個字符串。元素經過指定的分隔符進行分隔。
pop()	刪除並返回數組的最後一個元素
push()	向數組的末尾添加一個或更多元素，並返回新的長度。
reverse()	顛倒數組中元素的順序。
shift()	刪除並返回數組的第一個元素
slice()	從某個已有的數組返回選定的元素
sort()	對數組的元素進行排序
splice()	刪除元素，並向數組添加新元素。
toSource()	返回該對象的源代碼。
toString()	把數組轉換爲字符串，並返回結果。
toLocaleString()	把數組轉換爲本地數組，並返回結果。
unshift()	向數組的開頭添加一個或更多元素，並返回新的長度。
valueOf()	返回數組對象的原始值

17四、FF與IE中如何阻止事件冒泡，如何獲取事件對象，以及如何獲取觸發事件的元素

17五、列舉經常使用的js框架以及分別適用的領域

jquery：簡化了js的一些操做，而且提供了一些很是好用的API

jquery ui、jquery-easyui：在jqeury的基礎上提供了一些經常使用的組件日期，下拉框，表格這些組件

require.js、sea.js（阿里的玉帛）==>模塊化開發使用的

zepto：精簡版的jquery，經常使用於手機web前端開發提供了一些手機頁面實用功能,touch

ext.js：跟jquery差很少，可是不開源，也沒有jquery輕量

angular、knockoutjs、avalon(去哪兒前端架構師：司徒正美)：MV*框架，適合用於單頁應用開發(SPA)

17七、js能否實現面向對象編程，若是能夠如何實現js對象的繼承

答案：能夠

javascript中面向對象的相關知識點：構造函數、原型、原型鏈（對象的原型鏈、函數的原型鏈）、繼承、call、apply

實現繼承的幾種方式

原型鏈

180、如何獲取對象a擁有的全部屬性（可枚舉的、不可枚舉的，不包括繼承來的屬性）

第一種方式：Object.keys

瀏覽器兼容性：IE9+

第二種方式：for…in

問題：便可以獲取自身屬性、也能夠獲取繼承的屬性，全部須要進行過濾

for(o in obj){

if(obj. hasOwnProperty (o)){

//把o這個屬性放入到一個數組中

}

18一、有下面這樣一段HTML結構，使用css實現這樣的效果：

左邊容器不管寬度如何變更，右邊容器都能自適應填滿父容器剩餘的寬度。

</div>

18二、下面這段代碼想要循環輸出結果01234，請問輸出結果是否正確，若是不正確，請說明爲何，並修改循環內的代碼使其輸出正確結果

考點：setTimeout的執行原理

for(var i=0;i<5;++i){

setTimeout(function(){

console.log(i+’’);

},100);

}

正確答案：

for (var i = 0; i < 5; i++) {

setTimeout((function(e){

console.log(e);

})(i), 100)

};

18四、JavaScript如下哪條語句會產生運行錯誤

A. var obj = (); B. var obj = []; C. var obj = {}; D. var obj = //;

答案：AD

18五、如下哪些是javascript的全局函數：（ABCDE）

A. escape 函數可對字符串進行編碼，這樣就能夠在全部的計算機上讀取該字符串。ES3中反對使用該方法，應用使用 decodeURI() 和 decodeURIComponent() 替代它。

B. parseFloat parseFloat() 函數可解析一個字符串，並返回一個浮點數。

該函數指定字符串中的首個字符是不是數字。若是是，則對字符串進行解析，直到到達數字的末端爲止，而後以數字返回該數字，而不是做爲字符串。

C. eval 函數可計算某個字符串，並執行其中的的 JavaScript 代碼。

D. setTimeout

E. alert

18六、關於IE的window對象表述正確的有：（CD）

A. window.opener屬性自己就是指向window對象

window.opener返回打開當前窗口的那個窗口的引用.

若是當前窗口是由另外一個窗口打開的, window.opener保留了那個窗口的引用. 若是當前窗口不是由其餘窗口打開的, 則該屬性返回 null.

B. window.reload()方法能夠用來刷新當前頁面 //正確答案：應該是location.reload或者window.location.reload

C. window.location=」a.html」和window.location.href=」a.html」的做用都是把當前頁面替換成a.html頁面

D. 定義了全局變量g；能夠用window.g的方式來存取該變量

18七、描述錯誤的是：D

A、Http狀態碼302表示暫時性轉移對

B、DomContentLoaded事件早於onload事件 //正確

當 onload 事件觸發時，頁面上全部的DOM，樣式表，腳本，圖片，flash都已經加載完成了。

當 DOMContentLoaded 事件觸發時，僅當DOM加載完成，不包括樣式表，圖片，flash。

C、IE678不支持事件捕獲

解析：IE9開始就出現了addEventListener方法

D、localStorage 存儲的數據在電腦重啓後丟失 //錯誤，由於沒有時間限制

try...catch 語句。(在 IE5+、Mozilla 1.0、和 Netscape 6 中可用)

18八、關於link和@import的區別正確的是 AB

A: link屬於XHTML標籤，而@import是CSS提供的；

B：頁面被加載時，link會同時被加載，然後者引用的CSS會等到頁面被加載完再加載

C：import只在IE5以上才能識別而link是XHTML標籤，無兼容問題

解析：CSS2.1開始支持import

D: link方式的樣式的權重高於@import的權重

解析：權重同樣，只取決於書寫順序的前後

18九、下面正確的是 A

A: 跨域問題能經過JsonP方案解決

B：不一樣子域名間僅能經過修改window.name解決跨域 //還能夠經過script標籤src jsonp

C：只有在IE中可經過iframe嵌套跨域 //任何瀏覽器均可以使用iframe

D：MediaQuery屬性是進行視頻格式檢測的屬性是作響應式的

18九、不用任何插件，如何實現一個tab欄切換？

經過改變不一樣層的css設置層的顯示和隱藏

190、基本數據類型的專業術語以及單詞拼寫

19一、變量的命名規範以及命名推薦

19二、三種彈窗的單詞以及三種彈窗的功能

alert

confirm

prompt

19三、console.log( 8 | 1 ); 輸出值是多少？

考點：| 位運算符

答案：9

**19四、只容許使用 + - * / 和 Math.* ，求一個函數 y = f(x, a, b);當x > 100 時返回 a 的值，不然返回 b 的值，不能使用 if else 等條件語句，也不能使用|,?:,數組。**

答案：

function f(x, a, b) {

var temp = Math.ceil(Math.min(Math.max(x - 100, 0), 1));

return a * temp + b * (1 - temp);

}

console.log(f(-10, 1, 2));

19六、一個div，有幾種方式獲得這個div的jQuery對象？<div class='aabbcc' id='nodesView'></div>想直接獲取這個div的dom對象，如何獲取？dom對象如何轉化爲jQuery對象？

var domView=document.getElementById(「nodesView」)

document.getElementsByClassName(「aabbcc」);

document.querySelector(「.aabbcc#nodesView」);

轉換爲jquery對象：$( domView)

19七、主流瀏覽器內核

IE trident

火狐gecko

谷歌蘋果webkit

Opera：Presto

19八、如何顯示/隱藏一個dom元素？請用原生的JavaScript方法實現

dom.style.display=」none」;

dom.style.display=」」;

19九、JavaScript有哪幾種數據類型

Number String Boolean Null Undefined Object

200、jQuery框架中$.ajax()的經常使用參數有哪些？

type

類型：String

默認值: "GET")。請求方式 ("POST" 或 "GET")，默認爲 "GET"。注意：其它 HTTP 請求方法，如 PUT 和 DELETE 也能夠使用，但僅部分瀏覽器支持。

url

類型：String

默認值: 當前頁地址。發送請求的地址。

success

類型：Function

請求成功後的回調函數。

參數：由服務器返回，並根據 dataType 參數進行處理後的數據；描述狀態的字符串。

這是一個 Ajax 事件。

options

類型：Object

可選。AJAX 請求設置。全部選項都是可選的。

async

類型：Boolean

默認值: true。默認設置下，全部請求均爲異步請求。若是須要發送同步請求，請將此選項設置爲 false。

注意，同步請求將鎖住瀏覽器，用戶其它操做必須等待請求完成才能夠執行。

beforeSend(XHR)

類型：Function

發送請求前可修改 XMLHttpRequest 對象的函數，如添加自定義 HTTP 頭。

XMLHttpRequest 對象是惟一的參數。

這是一個 Ajax 事件。若是返回 false 能夠取消本次 ajax 請求。

cache

類型：Boolean

默認值: true，dataType 爲 script 和 jsonp 時默認爲 false。設置爲 false 將不緩存此頁面。

jQuery 1.2 新功能。

contentType

類型：String

默認值: "application/x-www-form-urlencoded"。發送信息至服務器時內容編碼類型。

默認值適合大多數狀況。若是你明確地傳遞了一個 content-type 給 $.ajax() 那麼它一定會發送給服務器（即便沒有數據要發送）。

data

類型：String

發送到服務器的數據。將自動轉換爲請求字符串格式。GET 請求中將附加在 URL 後。查看 processData 選項說明以禁止此自動轉換。必須爲 Key/Value 格式。若是爲數組，jQuery 將自動爲不一樣值對應同一個名稱。如 {foo:["bar1", "bar2"]} 轉換爲 '&foo=bar1&foo=bar2'。

dataFilter

類型：Function

給 Ajax 返回的原始數據的進行預處理的函數。提供 data 和 type 兩個參數：data 是 Ajax 返回的原始數據，type 是調用 jQuery.ajax 時提供的 dataType 參數。函數返回的值將由 jQuery 進一步處理。

dataType

類型：String

預期服務器返回的數據類型。若是不指定，jQuery 將自動根據 HTTP 包 MIME 信息來智能判斷，好比 XML MIME 類型就被識別爲 XML。在 1.4 中，JSON 就會生成一個 JavaScript 對象，而 script 則會執行這個腳本。隨後服務器端返回的數據會根據這個值解析後，傳遞給回調函數。可用值:

"xml": 返回 XML 文檔，可用 jQuery 處理。
"html": 返回純文本 HTML 信息；包含的 script 標籤會在插入 dom 時執行。
"script": 返回純文本 JavaScript 代碼。不會自動緩存結果。除非設置了 "cache" 參數。注意：在遠程請求時(不在同一個域下)，全部 POST 請求都將轉爲 GET 請求。（由於將使用 DOM 的 script標籤來加載）
"json": 返回 JSON 數據。
"jsonp": JSONP 格式。使用 JSONP 形式調用函數時，如 "myurl?callback=?" jQuery 將自動替換 ? 爲正確的函數名，以執行回調函數。
"text": 返回純文本字符串

error

類型：Function

默認值: 自動判斷 (xml 或 html)。請求失敗時調用此函數。

有如下三個參數：XMLHttpRequest 對象、錯誤信息、（可選）捕獲的異常對象。

若是發生了錯誤，錯誤信息（第二個參數）除了獲得 null 以外，還多是 "timeout", "error", "notmodified" 和 "parsererror"。

這是一個 Ajax 事件。

寫一個post請求並帶有發送數據和返回數據的樣例

$.ajax({
    url:"1.html",
    data:{name:"張三",age:18},//post數據
    dataType:"json",
    type:"POST",
    success:function(data){
        //data：返回的數據
    },
    error:function(){
        //異常處理
    }
});

20一、JavaScript數組元素添加、刪除、排序等方法有哪些？

Array.concat( ) 鏈接數組

Array.join( ) 將數組元素鏈接起來以構建一個字符串

Array.length 數組的大小

Array.pop( ) 刪除並返回數組的最後一個元素

Array.push( ) 給數組添加元素

Array.reverse( ) 顛倒數組中元素的順序

Array.shift( ) 將元素移出數組

Array.slice( ) 返回數組的一部分

Array.sort( ) 對數組元素進行排序

Array.splice( ) 插入、刪除或替換數組的元素

Array.toLocaleString( ) 把數組轉換成局部字符串

Array.toString( ) 將數組轉換成一個字符串

Array.unshift( ) 在數組頭部插入一個元素

20二、如何添加html元素的事件，有幾種方法？請列舉

a、直接在標籤裏添加：<div onclick=」alert(你好)」>這是一個層</div>

b、在元素上經過js添加:

c、使用事件註冊函數添加

20三、JavaScript的循環語句有哪些？

while for do while for…in

20四、做用域-編譯期執行期以及全局局部做用域問題

理解js執行主要的兩個階段：預解析和執行期

20五、閉包：下面這個ul，如何點擊每一列的時候alert其index？

<li>這是第一條</li>

<li>這是第二條</li>

<li>這是第三條</li>

</ul>

//非閉包實現

var lis=document.querySelectorAll('li');
document.querySelector('#test').onclick=function(e){
    for (var i = 0; i < lis.length; i++) {
        var li = lis[i];
        if(li==e.target){
            alert(i);
        }
    }
};

//閉包實現

var lis=document.querySelectorAll('li');
for (var i = 0; i < lis.length; i++) {
    var li = lis[i];
    li.onclick=(function(index){
        return function(e){
            alert(index);
        };
    })(i);
}

20六、列出3條以上ff和IE的腳本兼容問題

一、在IE下可經過document.frames["id"];獲得該IFRAME對象，

而在火狐下則是經過document.getElementById("content_panel_if").contentWindow;

二、IE的寫法： _tbody=_table.childNodes[0]

在FF中，firefox會在子節點中包含空白則第一個子節點爲空白""，而ie不會返回空白

能夠經過if("" != node.nodeName)過濾掉空白子對象

三、模擬點擊事件

if(document.all){ //ie下

document.getElementById("a3").click();

}

else{ //非IE

var evt = document.createEvent("MouseEvents");

evt.initEvent("click", true, true);

document.getElementById("a3").dispatchEvent(evt);

}

四、事件註冊

if (isIE){window.attachEvent("onload", init);}else{window.addEventListener("load", init, false);}

20九、如如今有一個效果，有顯示用戶頭像、用戶暱稱、用戶其餘信息；當用戶鼠標移到頭像上時，會彈出用戶的全部信息；若是是你，你會如何實現這個功能，請用代碼實現？

//答案見：J:\代碼,PPT,筆記,電子書\面試題\面試題02.html

2十、call與apply有什麼做用？又有什麼什麼區別？用callee屬性實現函數遞歸？

apply的參數是數組,call的參數是單個的值，除此以外，二者沒有差異，重點理解this的改變，callee已經不推薦使用

2十一、用正則表達式，寫出由字母開頭，其他由數字、字母、下劃線組成的6~30的字符串？

var reg=/^[a-ZA-Z][\da-zA-Z_]{5,29}/;

2十二、列舉瀏覽器對象模型BOM裏經常使用的至少4個對象，並列舉window對象的經常使用方法至少5個（10分）

對象：window document location screen history navigator

方法：alert() confirm() prompt() open() close() setInterval() setTimeout() clearInterval() clearTimeout()

(詳細參見：J:\代碼,PPT,筆記,電子書\面試題\window對象方法.png)

21三、Javascript中callee和caller的做用？

caller是返回一個對函數的引用，該函數調用了當前函數；

用法：fn.caller

callee是返回正在被執行的function函數，也就是所指定的function對象的正文。

用法：arguments.callee

21四、對於apply和call二者在做用上是相同的，便是調用一個對象的一個方法，以另外一個對象替換當前對象。將一個函數的對象上下文從初始的上下文改變爲由 thisObj 指定的新對象。

但二者在參數上有區別的。對於第一個參數意義都同樣，但對第二個參數：?apply傳入的是一個參數數組，也就是將多個參數組合成爲一個數組傳入，而call則做爲call的參數傳入（從第二個參數開始）。?如 func.call(func1,var1,var2,var3)對應的apply寫法爲：func.apply(func1,[var1,var2,var3]) 。

21五、在Javascript中什麼是僞數組？如何將僞數組轉化爲標準數組？

僞數組（類數組）：沒法直接調用數組方法或指望length屬性有什麼特殊的行爲，但仍能夠對真正數組遍歷方法來遍歷它們。典型的是函數的argument參數，還有像調用getElementsByTagName,document.childNodes之類的,它們都返回NodeList對象都屬於僞數組。

能夠使用Array.prototype.slice.call(fakeArray)將數組轉化爲真正的Array對象。

21六、寫一個函數能夠計算 sum(5,0,-5);輸出0; sum(1,2,3,4);輸出10;

function calc(){
    var result=0;
    for (var i = 0; i < arguments.length; i++) {
        var obj = arguments[i];
        result+=obj;
    }
    return result;
}
alert(calc(1,2,3,4));

Js基本功

21七、事件代理怎麼實現？

在元素的父節點註冊事件，經過事件冒泡，在父節點捕獲事件

21八、《正則》寫出正確的正則表達式匹配固話號，區號3-4位，第一位爲0，中橫線，7-8位數字，中橫線，3-4位分機號格式的固話號

經常使用正則表達式語法要熟悉

/0[0-9]{2,3}-\d{7,8}/

21九、《算法》一下A,B可任選一題做答，兩題全答加分

A:農場買了一隻羊，第一年是小羊，第二年末生一隻，第三年不生，第四年末再生一隻，第五年死掉。

B:寫出代碼對下列數組去重並從大到小排列{5,2,3,6,8,6,5,4,7,1,9}

先去重再排序

去重方法參考：J:\代碼,PPT,筆記,電子書\面試題

220、請寫出一張圖片的HTML代碼，已知道圖片地址爲「images/abc.jpg」,寬100px，高50px

22一、請寫一個正則表達式：要求最短6位數，最長20位，阿拉伯數和英文字母（不區分大小寫）組成

^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])[a-zA-Z\d]{6,20}$

22二、統計1到400億之間的天然數中含有多少個1？好比1-21中，有一、十、十一、十二、1三、1四、1五、1六、1七、1八、1九、20、21這麼多天然數有13個1

答案參考：J:\代碼,PPT,筆記,電子書\面試題\面試題_222.html

22三、刪除與某個字符相鄰且相同的字符，好比fdaffdaaklfjklja字符串處理以後成爲「fdafdaklfjklja」

答案參考：J:\代碼,PPT,筆記,電子書\面試題\面試題_223.html

22四、請寫出三種以上的Firefox有但InternetExplorer沒有的屬性和函數

一、在IE下可經過document.frames["id"];獲得該IFRAME對象，

而在火狐下則是經過document.getElementById("content_panel_if").contentWindow;

二、IE的寫法： _tbody=_table.childNodes[0]

在FF中，firefox會在子節點中包含空白則第一個子節點爲空白""，而ie不會返回空白

能夠經過if("" != node.nodeName)過濾掉空白子對象

三、模擬點擊事件

if(document.all){ //ie下

document.getElementById("a3").click();

}

else{ //非IE

var evt = document.createEvent("MouseEvents");

evt.initEvent("click", true, true);

document.getElementById("a3").dispatchEvent(evt);

}

四、事件註冊

if (isIE){window.attachEvent("onload", init);}else{window.addEventListener("load", init, false);}

22五、請寫出一個程序，在頁面加載完成後動態建立一個form表單，並在裏面添加一個input對象並給它任意賦值後義post方式提交到：http://127.0.0.1/save.php

答案參考：J:\代碼,PPT,筆記,電子書\面試題\面試題_225.html

22六、用JavaScript實現冒泡排序。數據爲2三、4五、1八、3七、9二、1三、24

面試常常遇到的排序，查找算法要熟悉

22七、解釋一下什麼叫閉包，並實現一段閉包代碼

簡單理解就是函數的嵌套造成閉包，閉包包括函數自己及其外部做用域

22八、簡述一下什麼叫事件委託以及其原理

在元素的父節點註冊事件，經過事件冒泡，在父節點捕獲事件

22九、前端代碼優化的方法

var User = { 對象

count = 1，屬性

getCount：function（）{ 方法

return this.count;

}

console.log(User.getCount());

var func = User.getCount;

console.log(func());

1 undefined（window）;

230、下列JavaScript代碼執行後，依次alert的結果是

(function test(){

var a=b=5;

alert(typeof a);

alert(typeof b);

})();

alert(typeof a);

alert(typeof b);

//number number undefined number

23一、下列JavaScript代碼執行後，iNum的值是

var iNum = 0;

for(var i = 1; i< 10; i++){

if(i % 5 == 0){

continue;

}

iNum++;

}

分析：

i=1 1

i=2 2

i=3 3

i=4 4

i=5

i=6 6

i=7 7

i=8 8

i=9 9

23二、輸出結果是多少？

1） var a;

var b = a * 0;

if (b == b) {

console.log(b * 2 + "2" - 0 + 4);

} else {

console.log(!b * 2 + "2" - 0 + 4);

}

答案：26

擴展：關於乘法操做符：J:\代碼,PPT,筆記,電子書\面試題\乘性操做符.png

2） <script>

var a = 1;

</script>

var a;

var b = a * 0;

if (b == b) { //b=0

console.log(b * 2 + "2" - 0 + 4);

} else {

console.log(!b * 2 + "2" - 0 + 4);

}

</script>

答案：6

3） var t = 10;

function test(t){

var t = t++;//此時的t是一個局部變量，全局變量沒有任何變化

console.log(t);//此時的結果又是多少？

}test(t);

console.log(t);

答案：10

4） var t = 10;

function test(test){

var t = test++;

}test(t);

console.log(t);

答案：10

6） var t = 10;

function test(test){

t = test++;

}test(t);

console.log(t);

答案：10

7） var t = 10;

function test(test){

t = t + test;//undefined+10=NaN

console.log(t);

var t = 3;

}test(t);

console.log(t);

答案：NaN 10

8）var a;

var b = a / 0;

if (b == b) {//b=NaN

console.log(!b * 2 + "2" - 0 + 4);

} else {

console.log(!b * 2 + "2" - 0 + 4);

}

答案：26

9）<script>

var a = 1;

</script>

var a;

var b = a / 0;

if (b == b) { //b=Infinity

console.log(b * 2 + "2" + 4);

} else {

console.log(!b * 2 + "2" + 4);

}

</script>

答案：Infinity24

233、用程序實現找到html中id名相同的元素？

<body>

<div id='div3'>id名重複的元素</div>

</form>

</body>

23四、下列JavaScript代碼執行後，運行的結果是

var btn = document.getElementById('btn');

var handler = {

id: '_eventHandler',

exec: function(){

alert(this.id);

}

btn.addEventListener('click', handler.exec);

答案：btn，由於handler.exec是由btn這個按鈕執行的

23五、☆☆☆下列JavaScript代碼執行後，依次alert的結果是

var obj = {proto: {a:1,b:2}};

function F(){};

F.prototype = obj.proto;

var f = new F();

obj.proto.c = 3;

obj.proto = {a:-1, b:-2};

alert(f.a);//1

alert(f.c);//3

delete F.prototype['a'];

alert(f.a);//undefined

alert(obj.proto.a);//-1

23六、下列JavaScript代碼執行後的效果是

</ul>

var items = document.querySelectorAll('#list>li');

for(var i = 0;i < items.length; i++){

setTimeout(function(){

items[i].style.backgroundColor = '#fee';

}, 5);

}

答案：異常

23七、下列JavaScript代碼執行後的li元素的數量是

<ul>

</ul>

var items = document.getElementsByTagName('li');

for(var i = 0; i< items.length; i++){

if(items[i].innerHTML == ''){

items[i].parentNode.removeChild(items[i]);

}

答案：4個

23八、程序中捕獲異常的方法？

window.error

try{}catch(){}finally{}

23九、將字符串」<tr><td>{$id}</td><td>{$name}</td></tr>」中的{$id}替換成10，{$name}替換成Tony （使用正則表達式）

答案：」<tr><td>{$id}</td><td>{$id}_{$name}</td></tr>」.replace(/{\$id}/g,’10′).replace(/{\$name}/g,‘Tony’);

240、給String對象添加一個方法，傳入一個string類型的參數，而後將string的每一個字符間價格空格返回，例如：

addSpace(「hello world」) // -> ‘h e l l o ?w o r l d’

String.prototype.spacify = function(){

return this.split('').join(' ');

};

24一、寫出函數DateDemo的返回結果，系統時間假定爲今天

function DateDemo(){

var d, s="今天日期是：";

d = new Date();

s += d.getMonth() + "/";

s += d.getDate() + "/";

s += d.getFullYear();

return s;

}

結果：今天日期是：7/17/2010

24二、輸出今天的日期，以YYYY-MM-DD的方式，好比今天是2014年9月26日，則輸出2014-09-26

var d = new Date();

// 獲取年，getFullYear()返回4位的數字

var year = d.getFullYear();

// 獲取月，月份比較特殊，0是1月，11是12月

var month = d.getMonth() + 1;

// 變成兩位

month = month < 10 ? '0' + month : month;

// 獲取日

var day = d.getDate();

day = day < 10 ? '0' + day : day;

alert(year + '-' + month + '-' + day);

24三、已知數組var?stringArray?=?[「This」,?「is」,?「Baidu」,?「Campus」]，Alert出」This?is?Baidu?Campus」。

答案：alert(stringArray.join(「」))

24四、已知有字符串foo=」get-element-by-id」,寫一個function將其轉化成駝峯表示法」getElementById」。

function combo(msg){

var arr=msg.split("-");

for(var i=1;i<arr.length;i++){

arr[i]=arr[i].charAt(0).toUpperCase()+arr[i].substr(1,arr[i].length-1);

}

msg=arr.join("");

return msg;

}

24五、.var numberArray=[3,6,2,4,1,5]; （考察基礎API）

1)實現對該數組的倒排，輸出[5,1,4,2,6,3]

2)實現對該數組的降序排列，輸出[6,5,4,3,2,1]

function combo(msg){

var arr=msg.split("-");

for(var i=1;i<arr.length;i++){

arr[i]=arr[i].charAt(0).toUpperCase()+arr[i].substr(1,arr[i].length-1);

}

msg=arr.join("");

return msg;

}

24六、把兩個數組合並，並刪除第二個元素。

var array1 = ['a','b','c'];

var bArray = ['d','e','f'];

var cArray = array1

答案：

array1=array1.concat(bArray)

array1.splice(1,1)

24七、如何消除一個數組裏面重復的元素？

var arr=[1,2,3,3,4,4,5,5,6,1,9,3,25,4];

function deRepeat(){

var newArr=[];

var obj={};

var index=0;

var l=arr.length;

for(var i=0;i<l;i++){

if(obj[arr[i]]==undefined)

{

obj[arr[i]]=1;

newArr[index++]=arr[i];

}

else if(obj[arr[i]]==1)

}

return newArr;

}

var newArr2=deRepeat(arr);

alert(newArr2); //輸出1,2,3,4,5,6,9,25

24八、用js實現隨機選取10–100之間的10個數字，存入一個數組，並排序。

var iArray = [];

funtion getRandom(istart, iend){

var iChoice = istart - iend +1;

return Math.floor(Math.random() * iChoice + istart;

}

for(var i=0; i<10; i++){

iArray.push(getRandom(10,100));

}

iArray.sort();

24九、正則表達式構造函數var reg=new RegExp(「xxx」)與正則表達字面量var reg=//有什麼不一樣？匹配郵箱的正則表達式？

答案：當使用RegExp()構造函數的時候，不只須要轉義引號（即\」表示」），而且還須要雙反斜槓（即\\表示一個\）。使用正則表達字面量的效率更高。?

250、1var regMail = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/;

正則表達式對象3 – 清除空格

寫一個function，清除字符串先後的空格。（兼容全部瀏覽器）

使用自帶接口trim()，考慮兼容性：

if (!String.prototype.trim) {

String.prototype.trim = function() {

return this.replace(/^\s+/, "").replace(/\s+$/,"");

} }

// test the function

var str = " \t\n test string ".trim();

alert(str == "test string"); // alerts "true"

25一、數組和字符串

function outPut(s) {

document.writeln(s);

}

var a = "lashou";

var b = a;

outPut(b);

a = "拉手";

outPut(a);

outPut(b);

var a_array = [1, 2, 3];

var b_array = a_array;

outPut(b_array);

a_array[3] = 4;

outPut(a_array);

outPut(b_array);

</script>

輸出結果：

答案：lashou 拉手 lashou 1,2,3 1,2,3,4 1,2,3,4

25二、下列控制檯都輸出什麼

第1題：

function setName(){

name="張三";

}

setName();

console.log(name);

答案："張三"

25三、第2題：

//考點：一、變量聲明提高二、變量搜索機制

var a=1;

function test(){

console.log(a);

var a=1;

}

test();

答案：undefined

25四、第3題：

var b=2;

function test2(){

window.b=3;

console.log(b);

}

test2();

答案：3

25五、第4題：

c=5;//聲明一個全局變量c

function test3(){

window.c=3;

console.log(c); //答案：undefined，緣由：因爲此時的c是一個局部變量c，而且沒有被賦值

var c;

console.log(window.c);//答案：3，緣由：這裏的c就是一個全局變量c

}

test3();

25六、第5題：

var arr = [];

arr[0] = 'a';

arr[1] = 'b';

arr[10] = 'c';

alert(arr.length); //答案：11

console.log(arr[5]); //答案：undefined

25七、第6題：

var a=1;

console.log(a++); //答案：1

console.log(++a); //答案：3

25八、第7題：

console.log(null==undefined); //答案：true

console.log("1"==1); //答案：true，由於會將數字1先轉換爲字符串1

console.log("1"===1); //答案：false，由於數據類型不一致

25九、第8題：

typeof 1; "number"

typeof "hello"; "string"

typeof /[0-9]/; "object"

typeof {}; "object"

typeof null; "object"

typeof undefined; "undefined"

typeof [1,2,3]; "object"

typeof function(){}; //"function"

260、第9題：

parseInt(3.14); //3

parseFloat("3asdf"); //3

parseInt("1.23abc456");

parseInt(true);//"true" NaN

26一、第10題：

//考點：函數聲明提早

function bar() {

return foo;

foo = 10;

function foo() {}

//var foo = 11;

}

alert(typeof bar());//"function"

26二、第11題：考點：函數聲明提早

var foo = 1;

function bar() {

foo = 10;

return;

function foo() {}

}

bar();

alert(foo);//答案：1

26三、第12題：

console.log(a);//是一個函數

var a = 3;

function a(){}

console.log(a);////3

26四、第13題：

//考點：對arguments的操做

function foo(a) {

arguments[0] = 2;

alert(a);//答案：2，由於：a、arguments是對實參的訪問，b、經過arguments[i]能夠修改指定實參的值

}

foo(1);

26五、第14題：

function foo(a) {

alert(arguments.length);//答案：3，由於arguments是對實參的訪問

}

foo(1, 2, 3);

26六、第15題

bar();//報錯

var foo = function bar(name) {

console.log("hello"+name);

console.log(bar);

};

//alert(typeof bar);

foo("world");//"hello"

console.log(bar);//undefined

console.log(foo.toString());

bar();//報錯

26七、第16題

function test(){

console.log("test函數");

}

setTimeout(function(){

console.log("定時器回調函數");

}, 0)

test();

function foo(){

var name="hello";

}

7、JS高級

一、 JQuery一個對象能夠同時綁定多個事件，這是如何實現的？

jQuery能夠給一個對象同時綁定多個事件，低層實現方式是使用addEventListner或attachEvent兼容不一樣的瀏覽器實現事件的綁定，這樣能夠給同一個對象註冊多個事件。

二、知道什麼是webkit麼? 知道怎麼用瀏覽器的各類工具來調試和debug代碼麼?

Webkit是瀏覽器引擎，包括html渲染和js解析功能，手機瀏覽器的主流內核，與之相對應的引擎有Gecko（Mozilla Firefox 等使用）和Trident（也稱MSHTML，IE 使用）。

對於瀏覽器的調試工具要熟練使用，主要是頁面結構分析，後臺請求信息查看，js調試工具使用，熟練使用這些工具能夠快速提升解決問題的效率

三、如何測試前端代碼? 知道BDD, TDD, Unit Test麼? 知道怎麼測試你的前端工程麼(mocha, sinon, jasmin, qUnit..)?

瞭解BDD行爲驅動開發與TDD測試驅動開發已經單元測試相關概念，

四、前端templating(Mustache, underscore, handlebars)是幹嗎的, 怎麼用?

Web 模板引擎是爲了使用戶界面與業務數據（內容）分離而產生的，

Mustache 是一個 logic-less （輕邏輯）模板解析引擎，它的優點在於能夠應用在 Javascript、PHP、Python、Perl 等多種編程語言中。

Underscore封裝了經常使用的JavaScript對象操做方法，用於提升開發效率。

Handlebars 是 JavaScript 一個語義模板庫，經過對view和data的分離來快速構建Web模板。

五、簡述一下 Handlebars 的基本用法？

沒有用過的話說出它是幹什麼的便可

官網：http://handlebarsjs.com/

參考：J:\代碼,PPT,筆記,電子書\面試題\handlebarDemo

六、簡述一下 Handlerbars 的對模板的基本處理流程，如何編譯的？如何緩存的？

學習技術不只要會用，還有熟悉它的實現機制，這樣在開發中遇到問題時才能更好的解決

七、用js實現千位分隔符?

原生js的熟練度，實踐經驗，實現思路

8、檢測瀏覽器版本版本有哪些方式？

IE與標準瀏覽器判斷，IE不一樣版本的判斷，userAgent var ie = /*@cc_on !@*/false;

九、咱們給一個dom同時綁定兩個點擊事件，一個用捕獲，一個用冒泡，你來講下會執行幾回事件，而後會先執行冒泡仍是捕獲

對兩種事件模型的理解

十、實現一個函數clone，能夠對JavaScript中的5種主要的數據類型（包括Number、String、Object、Array、Boolean）進行值複製

考察點1：對於基本數據類型和引用數據類型在內存中存放的是值仍是指針這一區別是否清楚
考察點2：是否知道如何判斷一個變量是什麼類型的
考察點3：遞歸算法的設計

// 方法一：

Object.prototype.clone = function(){

var o = this.constructor === Array ? [] : {};

for(var e in this){

o[e] = typeof this[e] === "object" ? this[e].clone() : this[e];

}

return o;

}

//方法二：

/**

* 克隆一個對象

* @param Obj

* @returns

function clone(Obj) {

var buf;

if (Obj instanceof Array) {

buf = [];//建立一個空的數組

var i = Obj.length;

while (i--) {

buf[i] = clone(Obj[i]);

}

return buf;

}else if (Obj instanceof Object){

buf = {};//建立一個空對象

for (var k in Obj) { //爲這個對象添加新的屬性

buf[k] = clone(Obj[k]);

}

return buf;

}else{ //普通變量直接賦值

return Obj;

}

十一、如何消除一個數組裏面重復的元素？

var arr=[1,2,3,3,4,4,5,5,6,1,9,3,25,4];

function deRepeat(){

var newArr=[];

var obj={};

var index=0;

var l=arr.length;

for(var i=0;i<l;i++){

if(obj[arr[i]]==undefined)

{

obj[arr[i]]=1;

newArr[index++]=arr[i];

}

else if(obj[arr[i]]==1)

continue;

}

return newArr;

}

var newArr2=deRepeat(arr);

alert(newArr2); //輸出1,2,3,4,5,6,9,25

十二、小賢是一條可愛的小狗(Dog)，它的叫聲很好聽(wow)，每次看到主人的時候就會乖乖叫一聲(yelp)。從這段描述能夠獲得如下對象：

function Dog() {

this.wow = function() {

alert(’Wow’);

}

this.yelp = function() {

this.wow();

}

小芒和小賢同樣，原來也是一條可愛的小狗，但是忽然有一天瘋了(MadDog)，一看到人就會每隔半秒叫一聲(wow)地不停叫喚(yelp)。請根據描述，按示例的形式用代碼來實。（繼承，原型，setInterval）

function MadDog() {

this.yelp = function() {

var self = this;

setInterval(function() {

self.wow();

}, 500);

}

MadDog.prototype = new Dog();

//for test

var dog = new Dog();

dog.yelp();

var madDog = new MadDog();

madDog.yelp();

1三、下面這個ul，如何點擊每一列的時候alert其index?（閉包）

<li>這是第一條</li>

<li>這是第二條</li>

<li>這是第三條</li>

</ul>

// 方法一：

var lis=document.getElementById('2223').getElementsByTagName('li');

for(var i=0;i<3;i++)

{

lis[i].index=i;

lis[i].onclick=function(){

alert(this.index);

};

}

//方法二：

var lis=document.getElementById('2223').getElementsByTagName('li');

for(var i=0;i<3;i++){

lis[i].index=i;

lis[i].onclick=(function(a){

return function() {

alert(a);

}

})(i);

}

1四、編寫一個JavaScript函數，輸入指定類型的選擇器(僅需支持id，class，tagName三種簡單CSS選擇器，無需兼容組合選擇器)能夠返回匹配的DOM節點，需考慮瀏覽器兼容性和性能。

/*** @param selector {String} 傳入的CSS選擇器。* @return {Array}*/

var query = function(selector) {

var reg = /^(#)?(\.)?(\w+)$/img;

var regResult = reg.exec(selector);

var result = [];

//若是是id選擇器

if(regResult[1]) {

if(regResult[3]) {

if(typeof document.querySelector === "function") {

result.push(document.querySelector(regResult[3]));

}else {

result.push(document.getElementById(regResult[3]));

}

//若是是class選擇器

else if(regResult[2]) {

if(regResult[3]) {

if(typeof document.getElementsByClassName === 'function') {

var doms = document.getElementsByClassName(regResult[3]);

if(doms) {

result = converToArray(doms);

}

//若是不支持getElementsByClassName函數

else {

var allDoms = document.getElementsByTagName("*") ;

for(var i = 0, len = allDoms.length; i < len; i++) {

if(allDoms[i].className.search(new RegExp(regResult[2])) > -1) {

result.push(allDoms[i]);

}

//若是是標籤選擇器

else if(regResult[3]) {

var doms = document.getElementsByTagName(regResult[3].toLowerCase());

if(doms) {

result = converToArray(doms);

}

return result;

}

function converToArray(nodes){

var array = null;

try{

array = Array.prototype.slice.call(nodes,0);//針對非IE瀏覽器

}catch(ex){

array = new Array();

for( var i = 0 ,len = nodes.length; i < len ; i++ ) {

array.push(nodes[i])

}

return array;

}

1五、請評價如下代碼並給出改進意見。

if(window.addEventListener){

var addListener = function(el,type,listener,useCapture){

el.addEventListener(type,listener,useCapture);

};

}

else if(document.all){

addListener = function(el,type,listener){

el.attachEvent("on"+type,function(){

listener.apply(el);

});

}

　不該該在if和else語句中聲明addListener函數，應該先聲明；
　不須要使用window.addEventListener或document.all來進行檢測瀏覽器，應該使用能力檢測；
　因爲attachEvent在IE中有this指向問題，因此調用它時須要處理一下

改進以下：

function addEvent(elem, type, handler){

　　if(elem.addEventListener){

　　　　elem.addEventListener(type, handler, false);

　　}else if(elem.attachEvent){

　　　　elem['temp' + type + handler] = handler;

　　　　elem[type + handler] = function(){

　　　　elem['temp' + type + handler].apply(elem);

　　};

　　elem.attachEvent('on' + type, elem[type + handler]);　

}else{

　　elem['on' + type] = handler;

　　}

1六、給String對象添加一個方法，傳入一個string類型的參數，而後將string的每一個字符間價格空格返回，例如：

addSpace(「hello world」) // -> ‘h e l l o w o r l d’

String.prototype.spacify = function(){

return this.split('').join(' ');

};

接着上述問題答案提問，1）直接在對象的原型上添加方法是否安全？尤爲是在Object對象上。(這個我沒能答出？但願知道的說一下。)　2）函數聲明與函數表達式的區別？

答案：在js中，解析器在向執行環境中加載數據時，對函數聲明和函數表達式並不是是一視同仁的，解析器會率先讀取函數聲明，並使其在執行任何代碼以前可用（能夠訪問），至於函數表達式，則必須等到解析器執行到它所在的代碼行，纔會真正被解析執行。

1七、定義一個log方法，讓它能夠代理console.log的方法。

可行的方法一：

function log(msg)　{

console.log(msg);

}

log("hello world!") // hello world!

若是要傳入多個參數呢？顯然上面的方法不能知足要求，因此更好的方法是：

function log(){

console.log.apply(console, arguments);

};

到此，追問apply和call方法的異同。

對於apply和call二者在做用上是相同的，便是調用一個對象的一個方法，以另外一個對象替換當前對象。將一個函數的對象上下文從初始的上下文改變爲由 thisObj 指定的新對象。

但二者在參數上有區別的。對於第一個參數意義都同樣，但對第二個參數： apply傳入的是一個參數數組，也就是將多個參數組合成爲一個數組傳入，而call則做爲call的參數傳入（從第二個參數開始）。如 func.call(func1,var1,var2,var3)對應的apply寫法爲：func.apply(func1,[var1,var2,var3]) 。

1八、在Javascript中什麼是僞數組？如何將僞數組轉化爲標準數組？

僞數組（類數組）：沒法直接調用數組方法或指望length屬性有什麼特殊的行爲，但仍能夠對真正數組遍歷方法來遍歷它們。典型的是函數的argument參數，還有像調用getElementsByTagName,document.childNodes之類的,它們都返回NodeList對象都屬於僞數組。能夠使用Array.prototype.slice.call(fakeArray)將數組轉化爲真正的Array對象。

假設接第八題題幹，咱們要給每一個log方法添加一個」(app)」前綴，好比’hello world!’ ->’(app)hello world!’。方法以下：

function log(){

var args = Array.prototype.slice.call(arguments); //爲了使用unshift數組方法，將argument轉化爲真正的數組

args.unshift('(app)');

console.log.apply(console, args);

};

1九、對做用域上下文和this的理解，看下列代碼：

var User = {

count: 1,

getCount: function() {

return this.count;

}

};

console.log(User.getCount()); // what?

var func = User.getCount;

console.log(func()); // what?

問兩處console輸出什麼？爲何？

答案是1和undefined。

func是在winodw的上下文中被執行的，因此會訪問不到count屬性。

繼續追問，那麼如何確保Uesr老是能訪問到func的上下文，即正確返回1。正確的方法是使用Function.prototype.bind。兼容各個瀏覽器完整代碼以下：

Function.prototype.bind = Function.prototype.bind || function(context){

var self = this;

return function(){

return self.apply(context, arguments);

};

}

var func = User.getCount.bind(User);

console.log(func());

20、原生JS的window.onload與Jquery的$(document).ready(function(){})有什麼不一樣？如何用原生JS實現Jq的ready方法？

window.onload()方法是必須等到頁面內包括圖片的全部元素加載完畢後才能執行。

$(document).ready()是DOM結構繪製完畢後就執行，沒必要等到加載完畢。

* 傳遞函數給whenReady()

* 當文檔解析完畢且爲操做準備就緒時，函數做爲document的方法調用

var whenReady = (function() { //這個函數返回whenReady()函數

var funcs = []; //當得到事件時，要運行的函數

var ready = false; //當觸發事件處理程序時,切換爲true

//當文檔就緒時,調用事件處理程序

function handler(e) {

if(ready) return; //確保事件處理程序只完整運行一次

//若是發生onreadystatechange事件，但其狀態不是complete的話,那麼文檔還沒有準備好

if(e.type === 'onreadystatechange' && document.readyState !== 'complete') {

return;

}

//運行全部註冊函數

//注意每次都要計算funcs.length

//以防這些函數的調用可能會致使註冊更多的函數

for(var i=0; i<funcs.length; i++) {

funcs[i].call(document);

}

//事件處理函數完整執行,切換ready狀態, 並移除全部函數

ready = true;

funcs = null;

}

//爲接收到的任何事件註冊處理程序

if(document.addEventListener) {

document.addEventListener('DOMContentLoaded', handler, false);

document.addEventListener('readystatechange', handler, false); //IE9+

window.addEventListener('load', handler, false);

}else if(document.attachEvent) {

document.attachEvent('onreadystatechange', handler);

window.attachEvent('onload', handler);

}

//返回whenReady()函數

return function whenReady(fn) {

if(ready) { fn.call(document); }

else { funcs.push(fn); }

}

})();

若是上述代碼十分難懂，下面這個簡化版：

function ready(fn){

if(document.addEventListener) {//標準瀏覽器

document.addEventListener('DOMContentLoaded', function() {

//註銷事件, 避免反覆觸發

document.removeEventListener('DOMContentLoaded',arguments.callee, false);

fn();//執行函數

}, false);

}else if(document.attachEvent) {//IE

document.attachEvent('onreadystatechange', function() {

if(document.readyState == 'complete') {

document.detachEvent('onreadystatechange', arguments.callee);

fn();//函數執行

}

});

}

};

2一、（設計題）想實現一個對頁面某個節點的拖曳？如何作？（使用原生JS）

回答出概念便可，下面是幾個要點

給須要拖拽的節點綁定mousedown, mousemove, mouseup事件
mousedown事件觸發後，開始拖拽
mousemove時，須要經過event.clientX和clientY獲取拖拽位置，並實時更新位置
mouseup時，拖拽結束
須要注意瀏覽器邊界的狀況

2二、請實現以下功能

function setcookie(name,value,days){ //給cookie增長一個時間變量

　　var exp = new Date();

　　exp.setTime(exp.getTime() + days*24*60*60*1000); //設置過時時間爲days天

　　document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();

}

function getCookie(name){

　　var result = "";

　　var myCookie = ""+document.cookie+";";

　　var searchName = "+name+"=";

　　var startOfCookie = myCookie.indexOf(searchName);

　　var endOfCookie;

　　if(satrtOfCookie != -1){

　　　　startOfcookie += searchName.length;

　　　　endOfCookie = myCookie.indexOf(";",startOfCookie);

　　　　result = (myCookie.substring(startOfCookie,endOfCookie));

　　}

　　return result;

}

(function(){

　　var oTips = document.getElementById('tips');//假設tips的id爲tips

　　var page = {

　　check: function(){//檢查tips的cookie是否存在而且容許顯示

　　　　var tips = getCookie('tips');

　　　　if(!tips || tips == 'show') return true;//tips的cookie不存在

　　　　if(tips == "never_show_again") return false;

　　hideTip: function(bNever){

　　　　if(bNever) setcookie('tips', 'never_show_again', 365);

　　　　oTips.style.display = "none";//隱藏

　　showTip: function(){

　　oTips.style.display = "inline";//顯示，假設tips爲行級元素

　　init: function(){

　　　　var _this = this;

　　　　if(this.check()){

　　　　_this.showTip();

　　　　setcookie('tips', 'show', 1);

　　}

　　oTips.onclick = function(){

　　　　_this.hideTip(true);

　　};

　　}

　　};

page.init();

})();

2三、說出如下函數的做用是？空白區域應該填寫什麼？

//define

(function(window){

function fn(str){

this.str=str;

}

fn.prototype.format = function(){

var arg = ______;

return this.str.replace(_____,function(a,b){

return arg[b]||"";

});

}

window.fn = fn;

})(window);

//use

(function(){

var t = new fn('<p><a href="{0}">{1}</a><span>{2}</span></p>');

console.log(t.format('http://www.alibaba.com','Alibaba','Welcome'));

})();

答案：訪函數的做用是使用format函數將函數的參數替換掉{0}這樣的內容，返回一個格式化後的結果：

第一個空是：arguments

第二個空是：/\{(\d+)\}/ig

2四、 Javascript做用域鏈?

理解變量和函數的訪問範圍和生命週期，全局做用域與局部做用域的區別，JavaScript中沒有塊做用域，函數的嵌套造成不一樣層次的做用域，嵌套的層次造成鏈式形式，經過做用域鏈查找屬性的規則須要深刻理解。

2五、談談this對象的理解。

理解不一樣形式的函數調用方式下的this指向，理解事件函數、定時函數中的this指向，函數的調用形式決定了this的指向。

2六、 eval是作什麼的？

它的功能是把對應的字符串解析成JS代碼並運行；應該避免使用eval，不安全，很是耗性能（2個步驟，一次解析成js語句，一次執行）

2七、關於事件，IE與火狐的事件機制有什麼區別？如何阻止冒泡？

[1].在IE中,事件對象是做爲一個全局變量來保存和維護的.全部的瀏覽器事件,無論是用戶觸發的，仍是其餘事件,都會更新window.event對象.因此在代碼中，只要調用window.event就能夠獲取事件對象，再event.srcElement就能夠取得觸發事件的元素進行進一步處理.

[2].在FireFox中，事件對象卻不是全局對象，通常狀況下，是現場發生，現場使用，FireFox把事件對象自動傳給事件處理程序.

關於事件的兼容性處理要熟練掌握，事件對象具體哪些屬性存在兼容性問題，IE與標準事件模型事件冒泡與事件捕獲的支持要理解

2八、什麼是閉包（closure），爲何要用它？

簡單的理解是函數的嵌套造成閉包，閉包包括函數自己已經它的外部做用域

使用閉包能夠造成獨立的空間，延長變量的生命週期，報存中間狀態值

2九、javascript 代碼中的"use strict";是什麼意思 ? 使用它區別是什麼？

意思是使用嚴格模式，使用嚴格模式，一些不規範的語法將再也不支持

嚴格模式

連接：http://www.ruanyifeng.com/blog/2013/01/javascript_strict_mode.html

全局變量顯式聲明

靜態綁定

禁止使用with語句

eval中定義的變量都是局部變量

禁止this關鍵字指向全局對象

禁止在函數內部遍歷調用棧

嚴格模式下沒法刪除變量。只有configurable設置爲true的對象屬性，才能被刪除

正常模式下，對一個對象的只讀屬性進行賦值，不會報錯，只會默默地失敗。嚴格模式下，將報錯。

嚴格模式下，對一個使用getter方法讀取的屬性進行賦值，會報錯。

嚴格模式下，對禁止擴展的對象添加新屬性，會報錯。

嚴格模式下，刪除一個不可刪除的屬性，會報錯。

正常模式下，若是對象有多個重名屬性，最後賦值的那個屬性會覆蓋前面的值。嚴格模式下，這屬於語法錯誤。

正常模式下，若是函數有多個重名的參數，能夠用arguments[i]讀取。嚴格模式下，這屬於語法錯誤。

正常模式下，整數的第一位若是是0，表示這是八進制數，好比0100等於十進制的64。嚴格模式禁止這種表示法，整數第一位爲0，將報錯。

不容許對arguments賦值

arguments再也不追蹤參數的變化

禁止使用arguments.callee

嚴格模式只容許在全局做用域或函數做用域的頂層聲明函數。也就是說，不容許在非函數的代碼塊內聲明函數

嚴格模式新增了一些保留字：implements, interface, let, package, private, protected, public, static, yield。

30、如何判斷一個對象是否屬於某個類(嚴格來講在ES6以前，js沒有類的概念)？

instanceof constructor

3一、new操做符具體幹了什麼呢?

一、建立一個空對象，而且 this 變量引用該對象，同時還繼承了該函數的原型。

二、屬性和方法被加入到 this 引用的對象中。

三、新建立的對象由 this 所引用，而且最後隱式的返回 this 。

3二、用原生JavaScript的實現過什麼功能嗎？

主要考察原生js的實踐經驗

3三、Javascript中，有一個函數，執行時對象查找時，永遠不會去查找原型，這個函數是？

HasOwnProperty

3四、對JSON的瞭解？

輕量級數據交互格式，能夠造成複雜的嵌套格式，解析很是方便

3五、js延遲加載的方式有哪些？

方案一：<script>標籤的async="async"屬性（詳細參見：script標籤的async屬性）

方案二：<script>標籤的defer="defer"屬性

方案三：動態建立<script>標籤

方案四：AJAX eval（使用AJAX獲得腳本內容，而後經過eval_r(xmlhttp.responseText)來運行腳本）

方案五：iframe方式

3六、模塊化開發怎麼作？

理解模塊化開發模式：瀏覽器端requirejs，seajs；服務器端nodejs；ES6模塊化；fis、webpack等前端總體模塊化解決方案；grunt、gulp等前端工做流的使用

3七、AMD（Modules/Asynchronous-Definition）、CMD（Common Module Definition）規範區別？

理解這兩種規範的差別，主要經過requirejs與seajs的對比，理解模塊的定義與引用方式

的差別以及這兩種規範的設計原則

參考連接1：https://www.zhihu.com/question/20351507/answer/14859415

參考連接2：https://github.com/seajs/seajs/issues/277

一、對於依賴的模塊，AMD 是提早執行，CMD 是延遲執行。不過 RequireJS 從 2.0 開始，也改爲能夠延遲執行（根據寫法不一樣，處理方式不一樣）。CMD 推崇 as lazy as possible.

二、CMD 推崇依賴就近，AMD 推崇依賴前置。

3. AMD 的 API 默認是一個當多個用，CMD 的 API 嚴格區分，推崇職責單一。好比 AMD 裏，require 分全局 require 和局部 require，都叫 require。CMD 裏，沒有全局 require，而是根據模塊系統的完備性，提供 seajs.use 來實現模塊系統的加載啓動。CMD 裏，每一個 API 都簡單純粹。

3八、requireJS的核心原理是什麼？（如何動態加載的？如何避免屢次加載的？如何緩存的？）

核心是js的加載模塊，經過正則匹配模塊以及模塊的依賴關係，保證文件加載的前後順序，根據文件的路徑對加載過的文件作了緩存

3九、讓你本身設計實現一個requireJS，你會怎麼作？

核心是實現js的加載模塊，維護js的依賴關係，控制好文件加載的前後順序

40、談一談你對ECMAScript6的瞭解？

ES6新的語法糖，類，模塊化等新特性

關於ES6參考連接：http://es6.ruanyifeng.com/

4一、ECMAScript6 怎麼寫class麼，爲何會出現class這種東西?

class Point {

constructor(x, y) {

this.x = x;

this.y = y;

}

toString() {

return '('+this.x+', '+this.y+')';

}

4二、異步加載的方式有哪些？

方案一：<script>標籤的async="async"屬性（詳細參見：script標籤的async屬性）

方案二：<script>標籤的defer="defer"屬性

方案三：動態建立<script>標籤

方案四：AJAX eval（使用AJAX獲得腳本內容，而後經過eval_r(xmlhttp.responseText)來運行腳本）

方案五：iframe方式

4三、documen.write和 innerHTML的區別?

document.write是重寫整個document, 寫入內容是字符串的html

innerHTML是HTMLElement的屬性，是一個元素的內部html內容

4四、DOM操做——怎樣添加、移除、移動、複製、建立和查找節點?

（1）建立新節點

createDocumentFragment() //建立一個DOM片斷

createElement_x() //建立一個具體的元素

createTextNode() //建立一個文本節點

（2）添加、移除、替換、插入

appendChild()

removeChild()

replaceChild()

insertBefore()

（3）查找

getElementsByTagName() //經過標籤名稱

getElementsByName() //經過元素的Name屬性的值

getElementById() //經過元素Id，惟一性

4五、call() 和 apply() 的含義和區別？

apply的參數是數組形式，call的參數是單個的值，除此以外在使用上沒有差異，重點理解這兩個函數調用的this改變

4六、數組和對象有哪些原生方法，列舉一下？

Array.concat( ) 鏈接數組

Array.join( ) 將數組元素鏈接起來以構建一個字符串

Array.length 數組的大小

Array.pop( ) 刪除並返回數組的最後一個元素

Array.push( ) 給數組添加元素

Array.reverse( ) 顛倒數組中元素的順序

Array.shift( ) 將元素移出數組

Array.slice( ) 返回數組的一部分

Array.sort( ) 對數組元素進行排序

Array.splice( ) 插入、刪除或替換數組的元素

Array.toLocaleString( ) 把數組轉換成局部字符串

Array.toString( ) 將數組轉換成一個字符串

Array.unshift( ) 在數組頭部插入一個元素

Object對象的經常使用方法

Object.hasOwnProperty( ) 檢查屬性是否被繼承

Object.isPrototypeOf( ) 一個對象是不是另外一個對象的原型

Object.propertyIsEnumerable( ) 是否能夠經過for/in循環看到屬性

Object.toLocaleString( ) 返回對象的本地字符串表示

Object.toString( ) 定義一個對象的字符串表示

Object.valueOf( ) 指定對象的原始值

4七、JS 怎麼實現一個類。怎麼實例化這個類

嚴格來說js中並無類的概念，不過js中的函數能夠做爲構造函數來使用，經過new來實例化，其實函數自己也是一個對象。

4八、JavaScript中的做用域與變量聲明提高？

理解JavaScript的預解析機制，js的運行主要分兩個階段：js的預解析和運行，預解析階段全部的變量聲明和函數定義都會提早，可是變量的賦值不會提早

4九、如何編寫高性能的Javascript？

使用 DocumentFragment 優化屢次 append

經過模板元素 clone ，替代 createElement

使用一次 innerHTML 賦值代替構建 dom 元素

使用 firstChild 和 nextSibling 代替 childNodes 遍歷 dom 元素

使用 Array 作爲 StringBuffer ，代替字符串拼接的操做

將循環控制量保存到局部變量

順序無關的遍歷時，用 while 替代 for

將條件分支，按可能性順序從高到低排列

在同一條件子的多（ >2 ）條件分支時，使用 switch 優於 if

使用三目運算符替代條件分支

須要不斷執行的時候，優先考慮使用 setInterval

50、那些操做會形成內存泄漏？

閉包，死循環

5一、javascript對象的幾種建立方式？

1. 工廠模式

2. 構造函數模式

3. 原型模式

4. 混合構造函數和原型模式

5. 動態原型模式

6. 寄生構造函數模式

7. 穩妥構造函數模式

5二、javascript繼承的 6 種方法？

1. 原型鏈繼承

2. 借用構造函數繼承

3. 組合繼承(原型+借用構造)

4. 原型式繼承

5. 寄生式繼承

6. 寄生組合式繼承

5三、eval是作什麼的？

1. 它的功能是把對應的字符串解析成JS代碼並運行

2. 應該避免使用eval，不安全，很是耗性能（2次，一次解析成js語句，一次執行）

5四、JavaScript 原型，原型鏈 ? 有什麼特色？

1. 原型對象也是普通的對象，是對象一個自帶隱式的 __proto__ 屬性，原型也有可能有本身的原型，若是一個原型對象的原型不爲 null 的話，咱們就稱之爲原型鏈

2. 原型鏈是由一些用來繼承和共享屬性的對象組成的（有限的）對象鏈

5五、事件、IE與火狐的事件機制有什麼區別？如何阻止冒泡？

1. 咱們在網頁中的某個操做（有的操做對應多個事件）。例如：當咱們點擊一個按鈕就會產生一個事件。是能夠被 JavaScript 偵測到的行爲

2. 事件處理機制：IE是事件冒泡、firefox同時支持兩種事件模型，也就是：捕獲型事件和冒泡型事件

3. ev.stopPropagation();

注意舊ie的方法：ev.cancelBubble = true;

5六、簡述一下Sass、Less，且說明區別？

他們是動態的樣式語言，是CSS預處理器,CSS上的一種抽象層。他們是一種特殊的語法/語言而編譯成CSS。

變量符不同，less是@，而Sass是$;

Sass支持條件語句，能夠使用if{}else{},for{}循環等等。而Less不支持;

Sass是基於Ruby的，是在服務端處理的，而Less是須要引入less.js來處理Less代碼輸出Css到瀏覽器

5七、關於javascript中apply()和call()方法的區別？

相同點:兩個方法產生的做用是徹底同樣的

不一樣點:方法傳遞的參數不一樣

Object.call(this,obj1,obj2,obj3)

Object.apply(this,arguments)

apply()接收兩個參數，一個是函數運行的做用域(this)，另外一個是參數數組。

call()方法第一個參數與apply()方法相同，但傳遞給函數的參數必須列舉出來。

5八、簡述一下JS中的閉包？

閉包用的多的兩個做用：讀取函數內部的變量值；讓這些變量值始終保存着(在內存中)。

同時須要注意的是：閉包慎用，不濫用，不亂用，因爲函數內部的變量都被保存在內存中，會致使內存消耗大。

5九、說說你對this的理解？

在JavaScript中，this一般指向的是咱們正在執行的函數自己，或者是，指向該函數所屬的對象。

全局的this → 指向的是Window

函數中的this → 指向的是函數所在的對象錯誤答案

對象中的this → 指向其自己

事件中this → 指向事件對象

60、分別闡述split(),slice(),splice(),join()？

join()用於把數組中的全部元素拼接起來放入一個字符串。所帶的參數爲分割字符串的分隔符，默認是以逗號分開。歸屬於Array

split()即把字符串分離開，以數組方式存儲。歸屬於Stringstring

slice() 方法可從已有的數組中返回選定的元素。該方法並不會修改數組，而是返回一個子數組。若是想刪除數組中的一段元素，應該使用方法 Array.splice()

splice() 方法向/從數組中添加/刪除項目，而後返回被刪除的項目。返回的是含有被刪除的元素的數組。

6一、事件委託是什麼？

讓利用事件冒泡的原理，讓本身的所觸發的事件，讓他的父元素代替執行！

6二、如何阻止事件冒泡和默認事件？(多記)

e.stopPropagation()
window.event.cancelBubble = true;
e.preventDefault()
window.event.returnValue = false;

1//阻止事件冒泡

function stopBubble(e) {

// 若是提供了事件對象，則這是一個非IE瀏覽器

if ( e && e.stopPropagation ) {
// 所以它支持W3C的stopPropagation()方法
e.stopPropagation();
} else {
// 不然，咱們須要使用IE的方式來取消事件冒泡
window.event.cancelBubble = true;
}

}

2 //阻止事件默認行爲
function stopDefault(e) {
// 阻止默認瀏覽器動做(W3C)
if ( e && e.preventDefault ) {
e.preventDefault();
} else {
// IE中阻止函數器默認動做的方式
window.event.returnValue = false;
}
return false;
}

阻止瀏覽器的默認行爲

window.event?window.event.returnValue=false:e.preventDefault();

中止事件冒泡

window.event?window.event.cancelBubble=true:e.stopPropagation();

原生JavaScript中，return false;只阻止默認行爲，不阻止冒泡，jQuery中的return false;既阻止默認行爲，又阻止冒泡

6四、你用過require.js嗎？它有什麼特性？

（1）實現js文件的異步加載，避免網頁失去響應；

（2）管理模塊之間的依賴性，便於代碼的編寫和維護。

6五、談一下JS中的遞歸函數，而且用遞歸簡單實現階乘？

遞歸便是程序在執行過程當中不斷調用自身的編程技巧，固然也必需要有一個明確的結束條件，否則就會陷入死循環。

6六、請用正則表達式寫一個簡單的郵箱驗證。

/^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;

6七、簡述一下你對web性能優化的方案？

一、儘可能減小 HTTP 請求

二、使用瀏覽器緩存

三、使用壓縮組件

四、圖片、JS的預載入

五、將腳本放在底部

六、將樣式文件放在頁面頂部

七、使用外部的JS和CSS

八、精簡代碼

6八、在JS中有哪些會被隱式轉換爲false

Undefined、null、布爾值false、NaN、零、空字符串

6九、定時器setInterval有一個有名函數fn1，setInterval（fn1,500）與setInterval（fn1(),500）有什麼區別？

第一個是重複執行每500毫秒執行一次，後面一個只執行一次。

70、外部JS文件出現中文字符，會出現什麼問題，怎麼解決？

會出現亂碼，加charset=」GB2312」;

另外一種解決方式：網頁文件和外部JS文件都是UTF8編碼

7一、談談瀏覽器的內核，而且說一下什麼是內核？

Trident (['traɪd(ə)nt])--IE，Gecko (['gekəʊ])--Firefox, Presto (['prestəʊ])--opera,webkit—谷歌和Safari

瀏覽器內核又能夠分紅兩部分：渲染引擎和 JS 引擎。它負責取得網頁的內容（HTML、XML、圖像等等）、整理訊息（例如加入 CSS 等），以及計算網頁的顯示方式，而後會輸出至顯示器或打印機。JS 引擎則是解析 Javascript 語言，執行 javascript 語言來實現網頁的動態效果。

7二、JavaScript原型，原型鏈 ? 有什麼特色？

* 原型對象也是普通的對象，是對象一個自帶隱式的 __proto__ 屬性，原型也有可能有本身的原型，若是一個原型對象的原型不爲null的話，咱們就稱之爲原型鏈。

* 原型鏈是由一些用來繼承和共享屬性的對象組成的（有限的）對象鏈。

* JavaScript的數據對象有那些屬性值？

　　writable：這個屬性的值是否能夠改。

　　configurable：這個屬性的配置是否能夠刪除，修改。

　　enumerable：這個屬性是否能在for…in循環中遍歷出來或在Object.keys中列舉出來。

　　value：屬性值。

* 當咱們須要一個屬性的時，Javascript引擎會先看當前對象中是否有這個屬性，若是沒有的話，就會查找他的Prototype對象是否有這個屬性。

function clone(proto) {

　　function Dummy() { }

　　Dummy.prototype = proto;

　　Dummy.prototype.constructor = Dummy;

　　return new Dummy(); //等價於Object.create(Person);

}

function object(old) {

function F() {};

F.prototype = old;

return new F();

}

var newObj = object(oldObject);

7三、寫一個通用的事件偵聽器函數

`// event(事件)工具集，來源：https://github.com/markyun

markyun.Event = {

// 頁面加載完成後

readyEvent : function(fn) {

if (fn==null) {

fn=document;

}

var oldonload = window.onload;

if (typeof window.onload != 'function') {

window.onload = fn;

} else {

window.onload = function() {

oldonload();

fn();

};

}

// 視能力分別使用dom0||dom2||IE方式來綁定事件

// 參數：操做的元素,事件名稱 ,事件處理程序

addEvent : function(element, type, handler) {

if (element.addEventListener) {

//事件類型、須要執行的函數、是否捕捉

element.addEventListener(type, handler, false);

} else if (element.attachEvent) {

element.attachEvent('on' + type, function() {

handler.call(element);

});

} else {

element['on' + type] = handler;

}

// 移除事件

removeEvent : function(element, type, handler) {

if (element.removeEnentListener) {

element.removeEnentListener(type, handler, false);

} else if (element.datachEvent) {

element.detachEvent('on' + type, handler);

} else {

element['on' + type] = null;

}

// 阻止事件 (主要是事件冒泡，由於IE不支持事件捕獲)

stopPropagation : function(ev) {

if (ev.stopPropagation) {

ev.stopPropagation();

} else {

ev.cancelBubble = true;

}

// 取消事件的默認行爲

preventDefault : function(event) {

if (event.preventDefault) {

event.preventDefault();

} else {

event.returnValue = false;

}

// 獲取事件目標

getTarget : function(event) {

return event.target || event.srcElement;

// 獲取event對象的引用，取到事件的全部信息，確保隨時能使用event；

getEvent : function(e) {

var ev = e || window.event;

if (!ev) {

var c = this.getEvent.caller;

while (c) {

ev = c.arguments[0];

if (ev && Event == ev.constructor) {

break;

}

c = c.caller;

}

return ev;

}

};

7四、事件、IE與火狐的事件機制有什麼區別？如何阻止冒泡？

1. 咱們在網頁中的某個操做（有的操做對應多個事件）。例如：當咱們點擊一個按鈕就會產生一個事件。是能夠被 JavaScript 偵測到的行爲。

2. 事件處理機制：IE是事件冒泡、火狐是事件捕獲；

3. ev.stopPropagation();

7五、什麼是閉包（closure），爲何要用？

執行say667()後,say667()閉包內部變量會存在,而閉包內部函數的內部變量不會存在.使得Javascript的垃圾回收機制GC不會收回say667()所佔用的資源，由於say667()的內部函數的執行須要依賴say667()中的變量。這是對閉包做用的很是直白的描述.

function say667() {

// Local variable that ends up within closure

var num = 666;

var sayAlert = function() { alert(num); }

num++;

return sayAlert;

}

var sayAlert = say667();

sayAlert()//執行結果應該彈出的667

7六、如何判斷一個對象是否屬於某個類？

使用instanceof （待完善）

if(a instanceof Person){

alert('yes');

}

7七、new操做符具體幹了什麼呢?

一、建立一個空對象，而且 this 變量引用該對象，同時還繼承了該函數的原型。

二、屬性和方法被加入到 this 引用的對象中。

三、新建立的對象由 this 所引用，而且最後隱式的返回 this 。

var obj = {};

obj.__proto__ = Base.prototype;

Base.call(obj);

7八、JSON 的瞭解

JSON(JavaScript Object Notation) 是一種輕量級的數據交換格式。它是基於JavaScript的一個子集。數據格式簡單, 易於讀寫, 佔用帶寬小

{'age':'12', 'name':'back'}

7九、js延遲加載的方式有哪些

defer和async、動態建立DOM方式（用得最多）、按需異步載入js

80、模塊化怎麼作？

當即執行函數,不暴露私有成員

一、使用字面量實現命名空間(YUI)：

Itcast.common.dom={};

Itcast.common.css={};

Itcast.common.event={};

二、使用閉包

var module1 = (function(){

　　　　var _count = 0;

　　　　var m1 = function(){

　　　　　　//...

　　　　};

　　　　var m2 = function(){

　　　　　　//...

　　　　};

　　　　return {

　　　　　　m1 : m1,

　　　　　　m2 : m2

　　　　};

　　})();

8一、異步加載的方式

(1) defer，只支持IE

(2) async：

(3) 建立script，插入到DOM中，加載完畢後callBack

documen.write和 innerHTML的區別

document.write只能重繪整個頁面

innerHTML能夠重繪頁面的一部分

8二、告訴我答案是多少？

(function(x){

delete x;

alert(x);

})(1+5);

函數參數沒法delete刪除，delete只能刪除經過for in訪問的屬性。

固然，刪除失敗也不會報錯，因此代碼運行會彈出「6」。

8三、JS中的call()和apply()方法的區別？

例子中用 add 來替換 sub，add.call(sub,3,1) == add(3,1) ，因此運行結果爲：alert(4);

注意：js 中的函數實際上是對象，函數名是對 Function 對象的引用。

function add(a,b){

alert(a+b);

}

function sub(a,b){

alert(a-b);

}

add.call(sub,3,1);

8四、Jquery與jQuery UI 有啥區別？

*jQuery是一個js庫，主要提供的功能是選擇器，屬性修改和事件綁定等等。

*jQuery UI則是在jQuery的基礎上，利用jQuery的擴展性，設計的插件。

提供了一些經常使用的界面元素，諸如對話框、拖動行爲、改變大小行爲等等

8五、jquery 中如何將數組轉化爲json字符串，而後再轉化回來？

jQuery中沒有提供這個功能，因此你須要先編寫兩個jQuery的擴展：

$.fn.stringifyArray = function(array) {

return JSON.stringify(array)

}

$.fn.parseArray = function(array) {

return JSON.parse(array)

}

而後調用：

$("").stringifyArray(array)

8六、JavaScript中的做用域與變量聲明提高？

其餘部分

（HTTP、正則、優化、重構、響應式、移動端、團隊協做、SEO、UED、職業生涯）

*基於Class的選擇性的性能相對於Id選擇器開銷很大，由於需遍歷全部DOM元素。

*頻繁操做的DOM，先緩存起來再操做。用Jquery的鏈式調用更好。

好比：var str=$("a").attr("href");

*for (var i = size; i < arr.length; i++) {}

for 循環每一次循環都查找了數組 (arr) 的.length 屬性，在開始循環的時候設置一個變量來存儲這個數字，可讓循環跑得更快：

for (var i = size, length = arr.length; i < length; i++) {}

8七、前端開發的優化問題。

參考資料：J:\代碼,PPT,筆記,電子書\面試題\雅虎14條優化規則.docx

（1）減小http請求次數：CSS Sprites, JS、CSS源碼壓縮、圖片大小控制合適；網頁Gzip，CDN託管，data緩存，圖片服務器。

（2）前端模板 JS+數據，減小因爲HTML標籤致使的帶寬浪費，前端用變量保存AJAX請求結果，每次操做本地變量，不用請求，減小請求次數

（3）用innerHTML代替DOM操做，減小DOM操做次數，優化javascript性能。

（4）當須要設置的樣式不少時設置className而不是直接操做style。

（5）少用全局變量、緩存DOM節點查找的結果。減小IO讀取操做。

（6）避免使用CSS Expression（css表達式)又稱Dynamic properties(動態屬性)。

（7）圖片預加載，將樣式表放在頂部，將腳本放在底部加上時間戳。

（8）避免在頁面的主體佈局中使用table，table要等其中的內容徹底下載以後纔會顯示出來，顯示比div+css佈局慢。

8八、http狀態碼有那些？分別表明是什麼意思？

100-199 用於指定客戶端應相應的某些動做。

200-299 用於表示請求成功。

300-399 用於已經移動的文件而且常被包含在定位頭信息中指定新的地址信息。

400-499 用於指出客戶端的錯誤。

400 語義有誤，當前請求沒法被服務器理解。

401 當前請求須要用戶驗證

403 服務器已經理解請求，可是拒絕執行它。

500-599 用於支持服務器錯誤。

503 – 服務不可用

8九、一個頁面從輸入 URL 到頁面加載顯示完成，這個過程當中都發生了什麼？（流程說的越詳細越好）

要熟悉先後端的通訊流程，最好把動態網站的背後細節也介紹一遍

下面以訪問baidu頁面來作一個過程分析

輸入 URL：http://www.baidu.com
DNS 域名解析
計算機沒法識別域名，計算機與計算機之間要想進行通訊，必須經過ip地址用來定位該計算機所在的位置
在瀏覽器中，輸入的ip地址或者域名，默認給你加了一個80端口號（對方的服務器監聽的就是80端口）
158.12.25.652 域名就是爲了好記
爲了好記，因此咱們的萬維網提供了一個域名這樣的概念
當你輸入了 ip 地址後，瀏覽器會自動去找DNS域名解析服務器，
創建 TCP 鏈接（Socket）：三次握手,確保這個必定是一個有效的請求和響應，這個三次握手在業界相信大多數人都不陌生，雖然它是提升了傳輸的有效性，可是這個致使的直接問題就是整個傳輸過程是很耗時的，也就是說每次http請求都會經歷三次握手這個過程，消耗的時間也是不言而喻，而且傳統的http協議規定一次請求只能請求一個文件，因此一些頂級網站想方設法的採起一些減小http請求的策略，大多數就是採起一次http請求可以請求多個文件這樣的實現，欣喜的是，http2.0已經支持可以一次http可以請求多個文件，這個仍是值得期待所有推行開來的，只不過確定須要過上一段時間，慢慢去等待推行吧。
將用戶輸入的地址封裝成 HTTP Request 請求報文發送到服務器
瀏覽器將用戶輸入的 URL 地址根據HTTP協議封裝成了 http 請求報文（請求頭+請求行+請求體）
該報文說白了也就是字符串而已，最終也要被轉成了二進制數據再發送到服務器
後臺服務器接收到用戶HTTP Request 請求報文
後臺服務器接收到客戶端發送給本身的數據（二進制數據）
- 首先把二進制數據按照編碼解析成字符，（人類能夠識別的）
- 解析成字符以後，再按照 HTTP 協議規範中定義的格式解析出來

後臺服務器處理用戶請求信息

當獲得用戶請求報文以後，根據請求報文中的 get、port或者 URL、或者URL中的查詢字符串或者請求體中的數據

根據用戶的特定的請求數據作特定的處理

後臺服務器將相應結果封裝到 HTTP Response 響應報文中發送給客戶端

當咱們解析和處理完用戶請求報文消息以後

服務器開始將具體的要發送給客戶端的數據根據 HTTP 協議規範封裝成 HTTP協議響應報文

響應頭、響應字段、響應體

該數聽說白了也是具備特定格式的字符串而已，最終這個字符串也要轉換成二進制數據發送到客戶端

發送到客戶端也是經過 Socket（ip地址、端口號）發送到了該客戶單

用戶瀏覽器接收到響應後開始渲染html、css，解析和執行 JavaScript 代碼

當客戶端解析到服務器發送過來的二進制數據

客戶端瀏覽器也會將二進制數據根據編碼類型解析成字符串

而後根據 HTTP 協議，解析服務器發送過來的響應報文

而後根據響應報文中的報文內容（報文頭、報文體）作具體的解析

當瀏覽器在解析的過程當中遇到一些靜態資源時，會再次重複上面的步驟

6：當一個DOM節點被點擊時候，咱們但願可以執行一個函數，應該怎麼作？

------------------------------------------------------------------------------

7：Javascript的事件流模型都有什麼？

------------------------------------------------------------------------------

8.IE和DOM事件流的區別?

------------------------------------------------------------------------------

9.IE和標準下有哪些兼容性的寫法?

------------------------------------------------------------------------------

10.ajax請求的時候get 和post方式的區別?

------------------------------------------------------------------------------

11.call和apply的區別?

------------------------------------------------------------------------------

12.ajax請求時，如何解釋json數據?

------------------------------------------------------------------------------

13：Ajax同步和異步的區別，如何解決跨域問題?

------------------------------------------------------------------------------

14.寫一個獲取非行間樣式的函數?

------------------------------------------------------------------------------

15.事件委託是什麼?

------------------------------------------------------------------------------

16.閉包是什麼，有什麼特性，對頁面有什麼影響?

------------------------------------------------------------------------------

17.如何阻止事件冒泡和默認事件?

------------------------------------------------------------------------------

18. 添加、移除、移動、複製、建立和查找節點的方法?

------------------------------------------------------------------------------

19.解釋jsonp的原理，以及爲何不是真正的ajax?

------------------------------------------------------------------------------

20.javascript的本地對象，內置對象和宿主對象?

------------------------------------------------------------------------------

21.document load 和document ready的區別?

------------------------------------------------------------------------------

22.」==」和「===」的不一樣?

------------------------------------------------------------------------------

23.javascript的同源策略?

------------------------------------------------------------------------------

24.編寫一個數組去重的方法?

------------------------------------------------------------------------------

26.排序算法?

------------------------------------------------------------------------------

27：但願獲取到頁面中全部的checkbox怎麼作？(不使用第三方框架) ?

------------------------------------------------------------------------------

28：什麼是Ajax和JSON，它們的優缺點?

------------------------------------------------------------------------------

29：有這樣一個URL：

http://item.taobao.com /item.htm?a=1&b=2&c=&d=xxx&e，

請寫一段JS程序提取URL中的各個GET參數(參數名和參數個數不肯定)，將其按key-value形式返回到一個json結構中，如{a:’1′, b:’2′ , c:」, d:’xxx’, e:undefined}?

------------------------------------------------------------------------------

30：正則表達式構造函數var reg=new RegExp(「xxx」)與正則表達字面量var reg=//有什麼不一樣？匹配郵箱的正則表達式？

------------------------------------------------------------------------------

31：.Javascript中callee和caller的做用？

------------------------------------------------------------------------------

32： 下面這個ul，如何點擊每一列的時候alert其index?（閉包）？

<ul id=」test」>

<li>這是第一條</li>

<li>這是第二條</li>

<li>這是第三條</li>

</ul>

33： 給String對象添加一個方法，傳入一個string類型的參數，而後將string的每一個字符間價格空格返回，例如：

addSpace(「hello world」) // -> ‘h e l l o w o r l d’

------------------------------------------------------------------------------

34：函數聲明與函數表達式的區別？

function show(){
//聲明式函數
}
var show = function{
//函數表達式
}

二者的區別：

// 正常調用到函數

alert(sum(2, 6));

function sum(a, b) {
return a + b;
}

執行了聲明式函數，在預編譯期聲明函數及被處理了，因此即便sum( )調用函數放在聲明函數前也能執行。

// 不能正常調用到函數，瀏覽器報錯

alert(sum(2, 6));
var sum = function (a, b) {
return a + b;
}

解析：聲明式函數與函數表達式的區別在於：在JS的預編譯期，聲明式函數將會先被提取出來，而後才按順序執行js代碼；函數表達式，則必須等到解析器執行到它所在的代碼行，纔會真正被解釋執行。

------------------------------------------------------------------------------

35：在Javascript中什麼是僞數組？如何將僞數組轉化爲標準數組？

------------------------------------------------------------------------------

36：想實現一個對頁面某個節點的拖曳？如何作？（使用原生JS）?

------------------------------------------------------------------------------

37：var numberArray = [3,6,2,4,1,5]; （考察基礎API）?

1) 實現對該數組的倒排，輸出[5,1,4,2,6,3]

2) 實現對該數組的降序排列，輸出[6,5,4,3,2,1]

------------------------------------------------------------------------------

38：.將字符串」<tr><td>{$id}</td><td>{$name}</td></tr>」中的{$id}替換成10，{$name}替換成Tony （使用正則表達式）?

------------------------------------------------------------------------------

39：foo = foo||bar ，這行代碼是什麼意思？爲何要這樣寫？

------------------------------------------------------------------------------

40：爲了保證頁面輸出安全，咱們常常須要對一些特殊的字符進行轉義，請寫一個函數escapeHtml，將<, >, &, 「進行轉義?

------------------------------------------------------------------------------

41：寫一個function，清除字符串先後的空格。（兼容全部瀏覽器）?

------------------------------------------------------------------------------

42：Javascript中callee和caller的做用？

------------------------------------------------------------------------------

43：談一談你對javascript的理解，javascript能作什麼?

------------------------------------------------------------------------------

44：在javascript中如何檢測客戶端的瀏覽器和操做系統類型?

------------------------------------------------------------------------------

45：Cookie在客戶機上是如何存儲的?

------------------------------------------------------------------------------

46：Prompt box是什麼？它的返回值有什麼用？

------------------------------------------------------------------------------

47：如何獲取javascript所能表示的最大值和最小值？

------------------------------------------------------------------------------

48：Null和Undefined有和區別與聯繫?

------------------------------------------------------------------------------

49：如何理解javascript中的variable typing，試用代碼說明?

------------------------------------------------------------------------------

50：如何理解javascript中的對象?

------------------------------------------------------------------------------

1．請簡要說明jQuery框架的顯著特色。

答：jQuery強調的理念是寫的少，作的多(write less，do more)。其主要特色有：輕量級、強大的選擇器、漂亮的DOM操做封裝、可靠的事件處理機制、完善的Ajax處理、出色的瀏覽器兼容性、鏈式操做方式、豐富的插件支持、開源產品。

2．eval是作什麼的？

答：eval功能是把對應的字符串解析成JS代碼並運行；但不安全，很是耗性能。

3．null與undefined的區別？

答：Undefined類型只有一個值，即undefined，當聲明的變量還未被初始化時，變量的默認值爲undefined。Null類型也只有一個值，即null，null用來表示還沒有存在的對象，經常使用來表示函數企圖返回一個不存在的對象。

4．談談對this對象的理解。

答：this是js的一個關鍵字，隨着函數使用場合不一樣，this的值會發生變化。可是有一個總原則，那就是this指的是調用函數的那個對象。

5．use strict是什麼意思？

答：表示代碼標誌爲「嚴格模式」，則其中運行的全部代碼都必然是嚴格模式下的。若是在語法檢測時發現語法問題，則整個代碼塊失效，並致使一個語法異常。若是在運行期出現了違反嚴格模式的代碼，則拋出執行異常。

6．簡述new操做符的功能。

答：

（1）建立一個空對象，使用this變量引用該對象，同時還繼承了該函數的原型

（2）屬性和方法被加入到this引用的對象中。

（3）新建立的對象由this所引用，而且最後隱式的返回this。

7．描述typeof關鍵字的功能。

答：typeof可用來判斷一個變量是否爲空或是什麼類型的變量。typeof通常只能返回以下幾個結果：number、boolean、string、function、object、undefined。

8．描述instanceof關鍵字的功能。

答：instanceof可用來判斷一個變量是否爲空或是什麼類型的變量。若是想判斷一個變量是否某個對象的實例建議使用instanceof關鍵字。

9．簡述hasOwnProperty函數的功能。

答：hasOwnProperty函數是用來判斷一個對象是否有你給出名稱的屬性或對象。不過須要注意的是，此方法沒法檢查該對象的原型鏈中是否具備該屬性，該屬性必須是對象自己的一個成員。

10．簡述一下isPrototypeOf函數的功能。

答：isPrototypeOf函數是用來判斷要檢查其原型鏈的對象是否存在於指定對象實例中，是則返回true，不然返回false。

11．談談對JSON的瞭解。

答：JSON(JavaScript Object Notation)是一種輕量級的數據交換格式。其是基於JavaScript的一個子集，具備數據格式簡單，易於讀寫，佔用空間小的特色。

12．Ajax是什麼？

答：AJAX即「Asynchronous Javascript+XML」（異步JavaScript和XML），是指一種建立交互式網頁應用的網頁開發技術。經過在後臺與服務器進行少許數據交換，AJAX能夠使網頁實現異步更新。這意味着能夠在不從新加載整個網頁的狀況下，對網頁的某部分進行更新。

13．同步請求和異步請求的區別？

答：

l 同步：提交請求→等待服務器處理→處理完畢返回，這個期間客戶端瀏覽器不能幹任何事。

l 異步：請求經過事件觸發→服務器處理（這是瀏覽器仍然能夠做其餘事情）→處理完畢。

14．jQuery如何解決跨域問題？

答：藉助JSONP這個非官方的協議，其容許在服務器端集成script tags返回至客戶端，經過callback的形式實現跨域訪問JSONP即JSON with Padding。若是要進行跨域請求，咱們能夠經過使用html的script標記來進行跨域請求，並在響應中返回要執行的script代碼，其中能夠直接使用JSON傳遞javascript對象。

15．異步加載的方式有哪些？

答：

（1）defer，只支持IE；

（2）async；

（3）建立script，插入到DOM；

16．如何編寫高性能的jQuery代碼？

答：定義jQuery變量的時候添加var關鍵字；DOM操做請務必記住緩存（cache）；儘可能使用鏈式操做；儘可能把一些代碼都整合到一塊兒；避免使用全局類型的選擇器；儘可能使用.on方法，由於其它任何方法都是最終使用.on方法來實現的；儘可能使用最新版本的jQuery框架類庫。

17．jQuery與jQuery UI有啥區別？

答：

（1）jQuery是一個js庫，主要提供的功能是選擇器，屬性修改和事件綁定等等。

（2）jQuery UI則是在jQuery的基礎上，利用jQuery的擴展性，設計的插件。提供了一些經常使用的界面元素，諸如對話框、拖動行爲、改變大小行爲等等。

18．描述基於class的選擇器與基於id選擇器在性能上的區別。

答：基於class的選擇性的性能相對於基於id選擇器開銷很大，由於其須要遍歷全部DOM元素。

19．jQuery鏈式調用的最大優勢是什麼？

答：避免頻繁操做的DOM，鏈式調用能夠實現先緩存再操做。

20．一句話說明內存泄漏的定義。

答：內存泄漏指任何對象在您再也不擁有或須要它以後仍然存在。

21．那些操做會形成內存泄漏？

答：

l 給DOM對象添加的屬性是一個對象的引用。

l DOM對象與JS對象相互引用。

l 給DOM對象用attachEvent綁定事件。

l 從外到內執行appendChild，這時即便調用removeChild也沒法釋放。

l 反覆重寫同一個屬性會形成內存大量佔用。

22．描述垃圾回收器的功能。

答：垃圾回收器按期掃描對象，並計算引用了每一個對象的其餘對象的數量。若是一個對象的引用數量爲0（沒有其餘對象引用過該對象），或對該對象的唯一引用是循環的，那麼該對象的內存便可回收。

23．documen.write和innerHTML的區別？

答：document.write只能重繪整個頁面，innerHTML能夠重繪頁面的一部分。

24．jQuery框架的源碼看過嗎？能不能簡單說一下它的實現原理？

答：jQuery框架經過改變javascript編碼方式來建立了全新的編程理念。譬如關於jQuery聲明的流程：先查找（建立）jQuery對象，而後調用jQuery對象的方法完成咱們須要完成的工做。jQuery就是以這種能夠說是最簡單的編碼邏輯來改變javascript編碼方式的，這個流程就是jQuery的編碼邏輯核心。

25．jQuery中如何將對象轉化爲json字符串，而後再轉化回來？

答：能夠經過JSON.stringify方法把一個對象轉換成json字符串，再經過JSON.parse方法把一個json字符串解析成對象。

26．描述一下.get()、[]和.eq()方法的區別。

答：eq返回原生jQuery對象，截取某些el元素生成jQuery新對象；get和[]返回的都是原生的DOM對象，原理一致；get和[]區別是get是經過jQuery對象的方法獲取，[]是根據jQuery是一個數組對象獲取。

27．描述一下context的概念。

答：context就是限定查找的範圍，context必須是一個DOM元素，context底層仍是用了.find()方法來實現的。

28．描述一下.delegate()和.live()方法的區別。

答：delegate方法指定了委託對象，live方法委託給了jQuery的context，1.9版本之後用on方法代替了。

29．描述一下.attr()和.prop()方法的區別。

答：.attr()方法是操做屬性節點，.prop()方法是操做獲取到的對應js對象的屬性。在遇到要獲取或設置checked、selected、readonly和disabled等屬性時，用prop方法顯然更好。.prop()方法更高效，由於.attr()方法要訪問DOM。

30．jQuery中的load方法通常怎麼用的？

答：load方法通常在載入遠程HTML代碼並插入到DOM中的時候用，一般用來從Web服務器上獲取靜態的數據文件。若是要傳遞參數的話，能夠使用$.get()或$.post()方法。

一、documen.write和 innerHTML的區別

答案：

document.write只能重繪整個頁面

innerHTML能夠重繪頁面的一部分

二、瀏覽器檢測經過什麼？

答案：

（1） navigator.userAgent

（2）不一樣瀏覽器的特性，如addEventListener

三、JavaScript有哪幾種數據類型？

答案：

簡單，Number，Boolean，String，Null，Undefined

複合，Object，Array，Function

四、截取字符串「abcdefghi」的「fghi」

答案：

var myvalue=」abcdefghi」;

var jiequ=myvalue.substring(myvalue.length-4,myvalue.length);

alert(jiequ);

五、寫出下面的運算結果

答案：

alert(typeof(null)); // object
alert(typeof(undefined)); // undefined
alert(typeof(NaN)); // number
alert(NaN==undefined); // false
alert(NaN==NaN); // false
var str="123abc";
alert(typeof(str++)); // number
alert(str);// NaN

六、問執行完畢後 x, y, z 的值分別是多少？

var x = 1, y = z = 0;

function add(n) {

n = n+1;

}

y = add(x);

function add(n) {

n = n + 3;

}

z = add(x);

答案：一、undefined、undefined

七、push()、pop()、shift()、unshift()分別是什麼功能?

答案：

/*push 方法

將新元素添加到一個數組中，並返回數組的新長度值。*/

var a=[1,2,3,4];

a.push(5);

/*pop 方法

移除數組中的最後一個元素並返回該元素。*/

var a=[1,2,3,4];

a.pop();

/*shift 方法

移除數組中的第一個元素並返回該元素。*/
var a=[1,2];

alert(a.shift());

/*unshift 方法

將指定的元素插入數組開始位置並返回該數組。*/

八、如何阻止事件的冒泡?

答案：

//阻止冒泡的方法

function stopPP(e)

{

var evt = e|| window.event;

//IE用cancelBubble=true來阻止而FF下須要用stopPropagation方法

evt.stopPropagation ?evt.stopPropagation() : (evt.cancelBubble=true);

}

九、寫出程序運行的結果?

for(var i=0, j=0; i<10, j<6; i++, j++){

k = i + j;

}

答案：10

十、編寫一個方法求一個字符串的字節長度

答案：

/*假設：

一個英文字符佔用一個字節，一箇中文字符佔用兩個字節*/

function getBytes(str){

var len = str.length,

bytes = len,

i = 0;

for(; i<len; i++){

if (str.charCodeAt(i) > 255) bytes++;

}

return bytes;

}

alert(getBytes("玩,as"));

十一、JavaScript中如何對一個對象進行深度clone？

答案：

function cloneObject(o) {

if(!o || 'object' !== typeof o) {

return o;

}

var c = 'function' === typeof o.pop ? [] : {};

var p, v;

for(p in o) {

if(o.hasOwnProperty(p)) {

v = o[p];

if(v && 'object' === typeof v) {

c[p] = Ext.ux.clone(v);

}

else {

c[p] = v;

}

return c;

};

十二、如何控制alert中的換行？

答案：

\n alert(「p\np」);

1三、請編寫一個JavaScript函數 parseQueryString，它的用途是把URL參數解析爲一個對象，如：

var url = 「http://witmax.cn/index.php?key0=0&key1=1&key2=2″;

答案：

function parseQueryString(url){

var params = {},

arr = url.split("?");

if (arr.length <= 1)

return params;

arr = arr[1].split("&");

for(var i=0, l=arr.length; i<l; i++){

var a = arr[i].split("=");

params[a[0]] = a[1];

}

return params;

}

var url = "http://witmax.cn/index.php?key0=0&key1=1&key2=2",

ps = parseQueryString(url);

console.log(ps["key1"]);

1四、如何控制網頁在網絡傳輸過程當中的數據量?

答案：啓用GZIP壓縮

保持良好的編程習慣，避免重複的CSS，JavaScript代碼，多餘的HTML標籤和屬性

1五、如下代碼運行結果

function say() {

// Local variable that ends up within closure

var num = 888;

var sayAlert = function() { alert(num); }

num++;

return sayAlert;

}

var sayAlert = say();

sayAlert()

答案：889

1六、請實現ECMAScript 5中的Object.getPrototypeOf() 函數

答案：

function proto(object) {

return !object? null

: '__proto__' in object? object.__proto__

: /* not exposed? */ object.constructor.prototype

}

1七、如何實現Array.prototype.forEach？

答案：

if (!Array.prototype.forEach) {

Array.prototype.forEach = function(fn){

for ( var i = 0; i < this.length; i++ ) {

fn( this[i], i, this );

}

};

}

["a", "b", "c"].forEach(function(value, index, array){

assert( value, "Is in position " + index + " out of " + (array.length - 1) );

});

1八、如何將arguments轉爲數組？

答案：

Object.prototype.slice.call(arguments);

1九、如下程序運行結果？

var ninja = function myNinja(){

alert(ninja == myNinja);

};

ninja();

myNinja();

答案：true、報錯（error - myNinja is not defined.）

20、如何獲取光標的水平位置？

答案：

function getX(e){

e = e || window.event;

//先檢查非IE瀏覽器，在檢查IE的位置

return e.pageX || e.clentX + document.body.scrollLeft;

}

2一、兼容瀏覽器的獲取指定元素（elem）的樣式屬性（name）的方法

答案：

function getStyle(elem, name){

if(elem.style[name]){//若是屬性存在於style[]中，直接取

return elem.style[name];

}

else if(elem.currentStyle){//不然嘗試IE的方法

return elem.currentStyle[name];

}//嘗試W3C的方式

else if(document.defaultView && document.defaultView.getComputedStyle){

name = name.replace(/([A-Z])/g, "-$1");//W3C中爲textAlign樣式，轉爲text-align

name = name.toLowerCase();

var s = document.defaultView.getComputedStyle(elem, "");

return s && s.getPropertyValue(name);

}else{

return null;

}

2二、Javascript中實現相似PHP的print_r函數

答案：

function print_r(theObj) {

var retStr = '';

if (typeof theObj == 'object') {

retStr += '<div style="font-family:Tahoma; font-size:7pt;">';

for (var p in theObj) {

if (typeof theObj[p] == 'object') {

retStr += '<div><b>['+p+'] => ' + typeof(theObj) + '</b></div>';

retStr += '<div style="padding-left:25px;">' + print_r(theObj[p]) + '</div>';

} else {

retStr += '<div>['+p+'] => <b>' + theObj[p] + '</b></div>';

}

retStr += '</div>';

}

return retStr;

}

2三、如下程序運行結果？

var b = parseInt("01");

alert("b="+b);

var c = parseInt("09/08/2009");

alert("c="+c);

答案：是b=一、c=9。

2四、如下程序的運行結果？？？？

&&：找假 ||：找真

var foo = 'hello';

(function() {

var foo = foo || 'world'; //foo 爲undefined未定義

console.log(foo);

})();

答案：world

2五、

答案：10

2六、如何規避javascript多人開發函數重名問題？

答案：

(1) 能夠開發前規定命名規範，根據不一樣開發人員開發的功能在函數前加前綴

(2) 將每一個開發人員的函數封裝到類中，調用的時候就調用類的函數，即便函數重名只

要類名不重複就行

2七、前端開發有哪些優化問題？

l 減小http請求次數：css spirit,data uri

l JS，CSS源碼壓縮

l 前端模板 JS+數據，減小因爲HTML標籤致使的帶寬浪費，前端用變量保存AJAX請求結果，每次操做本地變量，不用請求，減小請求次數

l 用innerHTML代替DOM操做，減小DOM操做次數，優化javascript性能

l 用setTimeout來避免頁面失去響應

l 用hash-table來優化查找

l 當須要設置的樣式不少時設置className而不是直接操做style

l 少用全局變量

l 緩存DOM節點查找的結果

l 避免使用CSS Expression

l 圖片預載

l 避免在頁面的主體佈局中使用table，table要等其中的內容徹底下載以後纔會顯示出來，顯示比div+css佈局慢

2八、什麼是ajax，爲何要使用Ajax（請談一下你對Ajax的認識）?

答案：AJAX是「Asynchronous JavaScript and XML」的縮寫。他是指一種建立交互式網頁應用的網頁開發技術。

Ajax包含下列技術：

l 基於web標準（standards-based presentation）XHTML+CSS的表示；

l 使用 DOM（Document Object Model）進行動態顯示及交互；

l 使用 XML 和 XSLT 進行數據交換及相關操做；

l 使用 XMLHttpRequest 進行異步數據查詢、檢索；

l 使用 JavaScript 將全部的東西綁定在一塊兒。

爲何要用ajax：Ajax應用程序的優點在於：

l 經過異步模式，提高了用戶體驗

l 優化了瀏覽器和服務器之間的傳輸，減小沒必要要的數據往返，減小了帶寬佔用

l Ajax引擎在客戶端運行，承擔了一部分原本由服務器承擔的工做，從而減小了大用戶量下的服務器負載。

2九、AJAX請求總共有多少種CALLBACK

答案：Ajax請求總共有八種Callback

l onSuccess

l onFailure

l onUninitialized

l onLoading

l onLoaded

l onInteractive

l onComplete

l onException

30、請給出異步加載js方案，很多於兩種

答案：默認狀況javascript是同步加載的，也就是javascript的加載時阻塞的，後面的元素要等待javascript加載完畢後才能進行再加載，對於一些意義不是很大的javascript，若是放在頁頭會致使加載很慢的話，是會嚴重影響用戶體驗的。

異步加載方式：

l defer，只支持IE

l async：

l 建立script，插入到DOM中，加載完畢後callBack，見代碼：

function loadScript(url, callback){

var script = document.createElement("script")

script.type = "text/javascript";

if (script.readyState){ //IE

script.onreadystatechange = function(){

if (script.readyState == "loaded" ||

script.readyState == "complete"){

script.onreadystatechange = null;

callback();

}

};

} else { //Others: Firefox, Safari, Chrome, and Opera

script.onload = function(){

callback();

};

}

script.src = url;

document.body.appendChild(script);

}

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。

JS面試題

2例舉3種強制類型轉換和2種隱式類型轉換?

四、數組方法pop() push() unshift() shift()

五、事件綁定和普通事件有什麼區別 2 ???

六、IE和DOM事件流的區別

七、IE和標準下有哪些兼容性的寫法

八、call和apply的區別

九、如何實現js中的繼承

十、JavaScript this、閉包、做用域

十一、事件委託是什麼

十二、閉包是什麼，有什麼特性，對頁面有什麼影響

1三、如何阻止事件冒泡和默認事件

1四、添加 刪除 替換 插入到某個節點的方法

1五、javascript的本地對象，內置對象和宿主對象(有網電腦在查)

1六、Document load 和document ready的區別

1七、」==」和「===」的不一樣

1八、javascript的同源策略 ×

1九、編寫一個數組去重的方法

20、JavaScript是一門什麼樣的語言，它有哪些特色？

2一、JavaScript的數據類型都有什麼？

2二、已知ID的Input輸入框，但願獲取這個輸入框的輸入值，怎麼作？(不使用第三方框架)

2三、但願獲取到頁面中全部的checkbox怎麼作？(不使用第三方框架)

2四、設置一個已知ID的DIV的html內容爲xxxx，字體顏色設置爲黑色(不使用第三方框架)

2五、當一個DOM節點被點擊時候，咱們但願可以執行一個函數，應該怎麼作？

2六、看下列代碼輸出爲什麼？解釋緣由。

2七、看下列代碼,輸出什麼？解釋緣由。

2八、看下列代碼,輸出什麼？解釋緣由。

28.二、看下列代碼會有什麼樣的輸出？ （不用再看）

2九、看代碼給答案。（不用再看）

30、已知數組var stringArray = [「This」, 「is」, 「Baidu」, 「Campus」]，alert出」This is Baidu Campus」。

30.二、已知有字符串foo=」get-element-by-id」,寫一個function將其轉化成駝峯表示法」getElementById」。

3一、var numberArray = [3,6,2,4,1,5];

1) 實現對該數組的倒排，輸出[5,1,4,2,6,3]

2) 實現對該數組的降序排列，輸出[6,5,4,3,2,1]

3二、輸出今天的日期，以YYYY-MM-DD的方式，好比今天是2014年9月26日，則輸出2014-09-26

3三、將字符串」<tr><td>{$id}</td><td>{$name}</td></tr>{$id}」中的{$id}替換成10，{$name}替換成Tony （使用正則表達式）

3四、爲了保證頁面輸出安全，咱們常常須要對一些特殊的字符進行轉義，請寫一個函數escapeHtml，將<, >, &, 「進行轉義

3五、foo = foo||bar ，這行代碼是什麼意思？爲何要這樣寫？

3六、看下列代碼，將會輸出什麼?（不用看）

3七、用js實現隨機選取10–100之間的10個數字，存入一個數組，並排序。

3八、把兩個數組合並，並刪除第二個元素。

3九、怎樣添加、移除、移動、複製、建立和查找節點（使用原生JS）

40、有這樣一個URL：http://item.taobao.com/item.htm?a=1&b=2&c=&d=xxx&e，請寫一段JS程序提取URL中的各個GET參數(參數名和參數個數不肯定)，將其按key-value形式返回到一個json結構中，如{a:’1′, b:’2′, c:」, d:’xxx’, e:undefined}。

4一、正則表達式構造函數var reg=new RegExp(「xxx」)與正則表達字面量var reg=//有什麼不一樣？匹配郵箱的正則表達式？

41.二、.看下面代碼，給出輸出結果。

4二、寫一個function，清除字符串先後的空格。（兼容全部瀏覽器）

4三、Javascript中callee和caller的做用？

44、Javascript中, 如下哪條語句必定會產生運行錯誤？ 答案( BC )

4五、如下兩個變量a和b，a+b的哪一個結果是NaN？ 答案( C )

46、var a=10; b=20; c=4; ++b+c+a++ 如下哪一個結果是正確的？答案( B )

4七、下面的JavaScript語句中，（ D ）實現檢索當前頁面中的表單元素中的全部文本框，並將它們所有清空

4八、要將頁面的狀態欄中顯示「已經選中該文本框」，下列JavaScript語句正確的是（ A ）

4九、如下哪條語句會產生運行錯誤：（A、D）

50、如下哪一個單詞不屬於javascript保留字：（B）

5一、請選擇結果爲真的表達式：（C）

5二、Javascript中, 若是已知HTML頁面中的某標籤對象的id=」username」，用____document.getElementById(‘username’)___ _方法得到該標籤對象。

5三、typeof運算符返回值中有一個跟javascript數據類型不一致，它是________」function」________。

5四、定義了一個變量，但沒有爲該變量賦值，若是alert該變量，javascript彈出的對話框中顯示___undefined______ 。

5五、分析代碼，得出正確的結果。

5六、寫出函數DateDemo的返回結果，系統時間假定爲今天

5七、寫出程序運行的結果？

5八、閱讀如下代碼，請分析出結果：

5九、補充按鈕事件的函數，確認用戶是否退出當前頁面，確認以後關閉窗口； <html>

60、寫出簡單描述html標籤（不帶屬性的開始標籤和結束標籤）的正則表達式，並將如下字符串中的html標籤去除掉

6一、完成foo()函數的內容，要求可以彈出對話框提示當前選中的是第幾個單選框。

6二、完成函數showImg()，要求可以動態根據下拉列表的選項變化，更新圖片的顯示

6三、截取字符串abcdefg的efg

6四、列舉瀏覽器對象模型BOM裏經常使用的至少4個對象，並列舉window對象的經常使用方法至少5個

6五、簡述列舉文檔對象模型DOM裏document的經常使用的查找訪問節點的方法並作簡單說明

6六、但願獲取到頁面中全部的checkbox怎麼作？(不使用第三方框架)

6八、javascript中有哪幾種數據類型，分別寫出中文和英文。

6九、javascript中==和===的區別是什麼？舉例說明。

70、簡述建立函數的幾種方式

7一、Javascript如何實現繼承？

7二、Javascript建立對象的幾種方式？

7三、把 Script 標籤 放在頁面的最底部的body封閉以前 和封閉以後有什麼區別？瀏覽器會如何解析它們？

7四、iframe的優缺點？

7五、請你談談Cookie的弊端？

7六、DOM操做——怎樣添加、移除、移動、複製、建立和查找節點。3-4-3

7七、js延遲加載的方式有哪些？

1四、添加刪除替換插入到某個節點的方法

28.二、看下列代碼會有什麼樣的輸出？（不用再看）

44、Javascript中, 如下哪條語句必定會產生運行錯誤？答案( BC )

4五、如下兩個變量a和b，a+b的哪一個結果是NaN？答案( C )

5二、Javascript中, 若是已知HTML頁面中的某標籤對象的id=」username」，用__document.getElementById(‘username’)_ _方法得到該標籤對象。

5三、typeof運算符返回值中有一個跟javascript數據類型不一致，它是」function」。

5四、定義了一個變量，但沒有爲該變量賦值，若是alert該變量，javascript彈出的對話框中顯示_undefined____ 。

7三、把 Script 標籤放在頁面的最底部的body封閉以前和封閉以後有什麼區別？瀏覽器會如何解析它們？

100、將數字 12345678 轉化成 RMB形式如： 12,345,678

**10三、階乘函數；987*65…1**

10八、什麼是閉包？寫一個簡單的閉包？；

13一、JS中的簡單繼承（使用call方法實現！）

13六、解析URL成一個對象？

16五、HTTP協議中，GET和POST有什麼區別？分別適用什麼場景？