1.寫一個深度克隆方法(es5)? 2. es6中let,const,var的區別是什麼? 3. 對數組[1,2,3,8,2,8]進行去重,es5或者es6方法? 4. 說說對es6中=>的理解? 5. 點擊一個按鈕,發出ajax請求,如何防止用戶在此請求方式返回之前再次點擊? ...
1.寫一個深度克隆方法(es5)?
/** * 深拷貝 * @param {object}fromObj 拷貝的對象 * @param {object}toObj 目標對象 */ function deepCopyObj2NewObj(fromObj, toObj) { for(var key in fromObj){ // 1. 取出鍵值對 var fromValue = fromObj[key]; // 2. 檢查當前的屬性值是什麼類型 if(!isObj(fromValue)){ // 如果是值類型,那麼就直接拷貝賦值 toObj[key] = fromValue; }else { // 如果是引用類型, // 那麼就再調用一次這個方法, // 去內部拷貝這個對象的所有屬性 var tempObj = new fromValue.constructor; console.log(fromValue.constructor); deepCopyObj2NewObj(fromValue, tempObj); toObj[key] = tempObj; } } } /** * 輔助函數, 判斷是否是對象 * @param {object}obj * @returns {boolean} */ function isObj(obj) { return obj instanceof Object; }
2. es6中let,const,var的區別是什麼?
var :聲明全局變數; let :聲明塊級變數,即局部變數, 定義後可以修改; const :用於聲明常量,就是定義後 不能再修改值或者引用值的常量, 也具有塊級作用域
3. 對數組[1,2,3,8,2,8]進行去重,es5或者es6方法?
es四種方式: Array.prototype.unique1 = function() { // 1. 定義數組 var temp = []; // 2. 遍歷當前數組 for(var i = 0; i < this.length; i++) { // 3.如果當前數組的第i已經保存進了臨時數組, // 那麼跳過,否則把當前項push到臨時數組裡面 if (-1 === temp.indexOf(this[i])) { temp.push(this[i]); } } return temp; }; Array.prototype.unique2 = function() { //1. hash為hash表,r為臨時數組 var hash = {}, temp=[]; // 2.遍歷當前數組 for(var i = 0; i < this.length; i++) { // 3. 如果hash表中沒有當前項 if (!hash[this[i]]) { // 4.存入hash表 hash[this[i]] = true; // 5.把當前數組的當前項 // push到臨時數組裡面 temp.push(this[i]); } } return temp; }; Array.prototype.unique3 = function() { var n = [this[0]]; for(var i = 1; i < this.length; i++){ if (this.indexOf(this[i]) === i) { n.push(this[i]); } } return n; }; Array.prototype.unique4 = function() { this.sort(); var re=[this[0]]; for(var i = 1; i < this.length; i++) { if( this[i] !== re[re.length-1]) { re.push(this[i]); } } return re; }; es6: Array.prototype.unique = Array.prototype.unique || function () { return [...new Set(this)]; };
4. 說說對es6中=>的理解?
箭頭函數相當於匿名函數, 並且簡化了函數定義, 箭頭左邊是參數, 右邊是返回值。 箭頭函數看上去 是匿名函數的一種簡寫, 但實際上,箭頭函數和 匿名函數有個明顯的區別: 箭頭函數內部的this是詞法作用域, 由上下文確定。
5. 點擊一個按鈕,發出ajax請求,如何防止用戶在此請求方式返回之前再次點擊?
// 點擊提交按鈕的時候, // 把這個提交這個處理函數給解綁掉, // 請求完成的時候在綁定回來 function clickHandler(){ $(this).unbind('click', clickHandler); $.ajax({ url : 'url', dataType : 'json', type : 'post', success : function (data) { if (data.success) { //提交成功做跳轉處理 } else { //處理失敗,重新綁定點擊事件 $(self).click(clickHandler); } } }); } $('#itlike').click(clickHandler); // 可以點擊後讓按鈕不可用, // 如果提交失敗可以再次設置為可用 // 1.讓按鈕不可用 $("#itlike").attr("disabled","disabled"); $.ajax({ url : 'url', dataType : 'json', type : 'post', success : function (data) { if (data.success) { // 提交成功做跳轉處理 } else { // 處理失敗,重新綁定點擊事件 // 讓按鈕可用 $("#itlike").removeAttr("disabled"); } } });