web面試筆試題摘取

一、css js 壓縮工具

  1. JavaScript Minifier
  2. JSMIni
  3. JSCompress
  4. Minifier
  5. Gulp.js
  6. Uglifyjs
  7. Grunt
  8. Koala
  9. Prepros
  10. Ajax Minifier
  11. Smaller
  12. Ultra Minifier
  13. Require JS
  14. Online JavaScript/CSS Compressor
  15. Minify

二、javascript和jquery修改a標簽的href屬性
document.getElementById("myId").setAttribute("href","www.xxx.com");
document.getElementById("myId").href = "www.xxx.com";
$("#myId").attr("href","www.xxx.com");

三、[理解HTTP/304響應(HTTP原理中的緩存機制)]
(http://blog.csdn.net/soonfly/article/details/50953814)

四、react 生命周期
實例化
首次實例化

getDefaultProps
getInitialState
componentWillMount
render
componentDidMount
實例化完成后的更新

getInitialState
componentWillMount
render
componentDidMount
存在期
組件已存在時的狀態改變

componentWillReceiveProps
shouldComponentUpdate
componentWillUpdate
render
componentDidUpdate
銷毀&清理期
componentWillUnmount
說明
生命周期共提供了10個不同的API。

1.getDefaultProps

作用于組件類,只調用一次,返回對象用于設置默認的props,對于引用值,會在實例中共享。

2.getInitialState

作用于組件的實例,在實例創建時調用一次,用于初始化每個實例的state,此時可以訪問this.props。

3.componentWillMount

在完成首次渲染之前調用,此時仍可以修改組件的state。

4.render

必選的方法,創建虛擬DOM,該方法具有特殊的規則:

只能通過this.props和this.state訪問數據
可以返回null、false或任何React組件
只能出現一個頂級組件(不能返回數組)
不能改變組件的狀態
不能修改DOM的輸出
5.componentDidMount

真實的DOM被渲染出來后調用,在該方法中可通過this.getDOMNode()訪問到真實的DOM元素。此時已可以使用其他類庫來操作這個DOM。

在服務端中,該方法不會被調用。

6.componentWillReceiveProps

組件接收到新的props時調用,并將其作為參數nextProps使用,此時可以更改組件props及state。

componentWillReceiveProps: function(nextProps) {
    if (nextProps.bool) {
        this.setState({
            bool: true
        });
    }
}

7.shouldComponentUpdate

組件是否應當渲染新的props或state,返回false表示跳過后續的生命周期方法,通常不需要使用以避免出現bug。在出現應用的瓶頸時,可通過該方法進行適當的優化。

在首次渲染期間或者調用了forceUpdate方法后,該方法不會被調用

8.componentWillUpdate

接收到新的props或者state后,進行渲染之前調用,此時不允許更新props或state。

9.componentDidUpdate

完成渲染新的props或者state后調用,此時可以訪問到新的DOM元素。

10.componentWillUnmount

組件被移除之前被調用,可以用于做一些清理工作,在componentDidMount方法中添加的所有任務都需要在該方法中撤銷,比如創建的定時器或添加的事件監聽器。

五、JavaScript判斷變量是否為數組的方法(Array)
1.typeof

//首先看代碼
var ary = [1,23,4];
console.log(typeof ary); //輸出結果是Object

2.instanceof 判斷

var ary = [1,23,4];
console.log(ary instanceof Array)//true;

3.原型鏈方法

var ary = [1,23,4];
console.log(ary.__proto__.constructor==Array);//true
console.log(ary.constructor==Array)//true 這兩段代碼是一樣的

這個辦法開起來好高大上哦~,利用了原型鏈的方法,但是但是,這個是有兼容的哦,在IE早期版本里面__proto__是沒有定義的哦而且,這個仍然有局限性,我們現在就來總結一下第2種方法和第3種方法局限性
總結一下第2種方法和第3種方法局限性
instanceof 和constructor 判斷的變量,必須在當前頁面聲明的,比如,一個頁面(父頁面)有一個框架,框架中引用了一個頁面(子頁面),在子頁面中聲明了一個ary,并將其賦值給父頁面的一個變量,這時判斷該變量,Array == object.constructor;會返回false;
原因:
1、array屬于引用型數據,在傳遞過程中,僅僅是引用地址的傳遞。
2、每個頁面的Array原生對象所引用的地址是不一樣的,在子頁面聲明的array,所對應的構造函數,是子頁面的Array對象;父頁面來進行判斷,使用的Array并不等于子頁面的Array;切記,不然很難跟蹤問題!

4.通用的方法

var ary = [1,23,4];
function isArray(o){
return Object.prototype.toString.call(o)=='[object Array]';
}
console.log(isArray(ary));

具體Object.prototype.toString 的用法,請參照 Object.prototype.toString的用法

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 原教程內容詳見精益 React 學習指南,這只是我在學習過程中的一些閱讀筆記,個人覺得該教程講解深入淺出,比目前大...
    leonaxiong閱讀 2,860評論 1 18
  • 做React需要會什么? react的功能其實很單一,主要負責渲染的功能,現有的框架,比如angular是一個大而...
    蒼都閱讀 14,818評論 1 139
  • 介紹 React.js是什么 React是由工作在Facebook開發出來的用于開發用戶交互界面的JS庫。其源碼由...
    bravin閱讀 1,348評論 3 1
  • 其實在看昨天一些同學的留言就看到了接近答案的留言。有同學說王某一天工作十小時月薪12000,而另外一位李某一天工作...
    RexsonXie閱讀 399評論 0 0
  • 酒干倘賣無 文/董麗 “多么熟悉的聲音,陪我多少年風和雨,從來不需要想起,永遠也不會忘記,沒有天哪有地,沒有地哪有...
    漣漪dl閱讀 266評論 0 1