前端面試總結(秋招篇)

HTML篇

HTML標簽

<i><em>都表示斜體,如果這種斜體字對該瀏覽器不可用的話,可以使用高亮、反白或加下劃線等樣式。

lable中的for屬性

lable的for屬性指向的是表單元素的 id 屬性。

表單提交的方法和路徑

表單提交的方法和路徑

CSS篇

position中的static、fixed、relative、absolute

static相當于沒有定位 absolute定位尋找已絕對定位的父元素找不到就html

CSS選擇器

選中類名為menu和open的li標簽的子元素a的css選擇器是 li.menu.open>a

垂直居中的總結

height = line-height
  • position absolute relative 使用margin-top:-一半子元素的高度;margin-left:-一半子元素的寬度
  • 在子元素的高度未知的情況下
.box span {
    position:absolute;
    width:100%;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    text-align:center;
}
  • display:table-cell
.box{
    display:table-cell;
    vertical-align:middle;
    text-align:center;
}
  • display:flex
.box{
    display:flex;
    justify-content:center;
    align-items:center;
}

transform

sknew rotate scale translate

響應式布局相關

<meta name="view-port" content = "width = device-width,initial-scale = 1 ,user-scalable=no">
  • 使用百分比width
  • 使用rem
  • 媒體查詢
@media screen and (max-device-width:500px)

transition

transition:all 0.5s ease-in-out 1s;/*  css屬性  第二個動畫的時間   動畫效果   延遲加載時間   */

兩列布局

  • 浮動布局,左邊浮動,右邊使用margin-left
  • absolute+margin
position:absolute; 
top:0px;
left:0px;


margin-left:200px;
  • 使用BFC,不與浮動元素重疊的特性
float:left;
overflow:hidden;

JavaScript篇

常見的正則表達式

  • 電話號碼
/^1\d{10}$/
  • 賬號,字母、數(shù)字,下劃線組成,但是要以字母開頭,四到十六位
/^[a-zA-Z]\w{3,15}$/

常用Math對象方法的總結

  • ceil(x) 對傳入的數(shù)值進行上取舍
Math.ceil(0.1);//1
  • floor(x)對傳入的數(shù)值進行下取舍
  • max(x,y)取x,y中的最大值
  • min(x,y)
  • random()返回的是0到1之間的隨機數(shù)
  • valueOf() 返回math對象的原始值

另注:
parseFloat()將傳入的字符轉換成為浮點數(shù)
parseInt()轉換成為整數(shù)

布爾操作符

邏輯與不僅僅可以運用于布爾值,可以應用于各種類型的操作數(shù)

邏輯與應用于各種類型

邏輯或類似

邏輯或運用于其他類型

事件代理

將事件添加到父節(jié)點,讓父節(jié)點代替它們去觸發(fā)函數(shù),而不用自己去觸發(fā)函數(shù)。比如動態(tài)添加進li節(jié)點的時候,每次都要觸發(fā)函數(shù),使用事件代理可以很好的解決這個問題

jquery中綁定事件的方法

  • bind——unbind,與delegate類似
  • delegate——undelegate
$("div").delegate("p",click,function(){})
  • live——die,與delegate類似
  • on——off
$("div p").on("click",function(){})

窗口的高度、寬度

clientX + scrollLeft = pageX
clentY  +scrollTop = pageY

typeof

對于null和Array,使用typeof返回的是Object

object擁有的方法

  • hasOwnProperty(peopertyName)用于檢測該對象有沒有包含該屬性,這個屬性不是原型鏈中的
o.hasOwnProperty("name")
  • isPrototypeOf(object)用于檢測傳入的對象是不是這個對象的原型
  • toString()
  • valueOf()


    object擁有的方法

常見的引用類型

object function Date 正則表達式(RegExp) Array

判斷對象是否是數(shù)組的方法

  • isArray
Array isArray a
  • 利用原型判斷
Object.prototype.toString.call(obj)==='[object Array]'
  • instanceof操作符
obj instanceOf Array
a instanceOf Array
  • 利用constructor判斷
a.constructor  == Array

字符串常用方法總結

  • concat——注意就是不會影響a和b


    concat
  • charCodeAt(index)表示指定位置的Unicode編碼,在統(tǒng)計字符串的字節(jié)長度的時候要用到
function getLen(str){
    var len = str.length;
    var bytes = len;

    for(var i=0;i<len;i++){
        if(str.charCodeAt(i)>255){
            bytes++;
        }
    }

    console.log(bytes);
}

getLen("馮光平123");
  • charAt(index)指定位置的字符
var str = "ABC"; 
str.charAt(1); //B
  • slice和substring()方法比較類似哦~
  • indexOf(),lastIndexOf()和下面數(shù)組的很類似,不再累贅
  • split([separator[,limit]]) 將一個字符串分割為子字符串,然后將結果作為字符串數(shù)組返回。
var str = "AA BB CC DD EE FF"; 
alert(str.split(" ",3)); 
  • toLowerCase()
  • toUpperCase()

apply()和call()

都是將另一個對象代替當前對象
apply()參數(shù)是一個數(shù)組
call()參數(shù)是多個參數(shù)

數(shù)組常用方法總結

  • join()注意原數(shù)組沒有改變
  • sort()方法中會調用每個數(shù)組項的toString()方法,然后得到比較的字符串,所以會出現(xiàn)下面的問題,也要注意sort()方法會改變原數(shù)組
arr2 = [13, 24, 51, 3];
console.log(arr2.sort()); // [13, 24, 3, 51]
console.log(arr2); // [13, 24, 3, 51](元數(shù)組被改變)

為了解決上面的問題,sort()接受一個函數(shù)作為參數(shù)

function compare(value1, value2) {
if (value1 < value2) {
return -1;
} else if (value1 > value2) {
return 1;
} else {
return 0;
}
}
arr2 = [13, 24, 51, 3];
console.log(arr2.sort(compare)); // [3, 13, 24, 51]
  • reverse(),原數(shù)組會改變
var arr = [13, 24, 51, 3];
console.log(arr.reverse()); //[3, 51, 24, 13]
console.log(arr); //[3, 51, 24, 13](原數(shù)組改變)
  • slice()是淺復制
  • splice(start,deleteCount,items)
  • indexOf() lastIndexOf()返回的都是查找的項在數(shù)組中的位置,接受兩個參數(shù),第一個參數(shù)是要查找的字符,第二個則是從哪里開始查找
  • forEach() 接受三個參數(shù),第一個遍歷的數(shù)組內容,第二個是索引,第三個是數(shù)組本身
  • map()——映射
var arr = [1, 2, 3, 4, 5];
var arr2 = arr.map(function(item){
return item*item;
});
console.log(arr2); //[1, 4, 9, 16, 25]
  • filter()——過濾
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
var arr2 = arr.filter(function(x, index) {
return index % 3 === 0 || x >= 8;
}); 
console.log(arr2); //[1, 4, 7, 8, 9, 10]
  • every() 每一項都符合才返回true
var arr = [1, 2, 3, 4, 5];
var arr2 = arr.every(function(x) {
return x < 10;
}); 
console.log(arr2); //true
var arr3 = arr.every(function(x) {
return x < 3;
}); 
console.log(arr3); // false
  • some()只要一個符合條件就返回true
var arr = [1, 2, 3, 4, 5];
var arr2 = arr.some(function(x) {
return x < 3;
}); 
console.log(arr2); //true
var arr3 = arr.some(function(x) {
return x < 1;
}); 
console.log(arr3); // false

繼承

原型繼承

核心:讓一原型去繼承另一個類型的實例

sub.prototype = new super();

prototype:是每個函數(shù)都會有的一個屬性,是一個指針,可以指向一個對象,而這個對象的用途可以包含由特定類型的所有實例共享的方法和屬性

constructor:是原型對象自動獲得的屬性。這個屬性包含一個指向prototype屬性所在的函數(shù)的指針
缺點:
1.實例共享原型對象上的引用屬性時,一個改變會影響所有實例的屬性
2.在創(chuàng)建子類型的實例時,不能向超類型的構造函數(shù)中傳遞參數(shù)

構造函數(shù)繼承

子類構造函數(shù)中的內部調用父類的構造函數(shù)

apply   call

superType.call(this);//核心代碼

缺點:只是繼承了父類的屬性,繼承不了原型上的方法。

組合繼承

使用原型鏈實現(xiàn)原型屬性和方法的繼承,使用構造函數(shù)實現(xiàn)實例屬性的繼承

原型式繼承

function object(o){
      function F(){};
      F.prototype = o;
      return new F();
}

跨域

同源策略下,當前客戶端無法訪問與自身不同協(xié)議、不同域名、不同端口的資源。三者只要出現(xiàn)一種不同,就是跨域

jsonp

原理:利用的是script標簽中的src沒有跨域的限制,通過在src中的URL后面的參數(shù)上添加一個回調函數(shù)的名稱(頁面首先聲明好回調函數(shù)),然后服務器接收回調函數(shù)的名字,并返回一個包含數(shù)據(jù)的回調函數(shù),供客戶端使用

CORS

自定義HTTP頭部,讓瀏覽器和服務器進行溝通,從而決定請求響應是true還是false

計算機網絡篇

從瀏覽器輸入地址后到顯示頁面的步驟

總結:

算法篇

快速排序

快速排序的博客

Javascript獲取字符串字節(jié)數(shù)

qa+

學科基礎篇

C語言的數(shù)據(jù)類型總結

short的長度:兩個字節(jié)

兩個字節(jié),每個字節(jié)8比特,每個比特只有0或1兩個值.
有符號型的最高比特位用于表示正負號.(0是正號,1是負號)
所以最大的數(shù)據(jù)是:正號+15個比特的1 (2^15)
最小的數(shù)據(jù)是:負號+15個比特的1 (-2^15)

數(shù)據(jù)庫事務四大特性

分別為:一致性、原子性、分離性、持久性

將持續(xù)更新.....

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

  • 第5章 引用類型(返回首頁) 本章內容 使用對象 創(chuàng)建并操作數(shù)組 理解基本的JavaScript類型 使用基本類型...
    大學一百閱讀 3,679評論 0 4
  • 第5章 引用類型 引用類型的值(對象)是引用類型的一個示例。在ECMAScript 中,引用類型是一種數(shù)據(jù)結構,用...
    力氣強閱讀 815評論 0 0
  • 偶有聽到朋友說為什么現(xiàn)在很多人開始關閉自己的朋友圈,僅對外開放了3天或者是半年 我深感這種變化 因為自己也是這么關...
    低語小邵閱讀 432評論 0 1
  • 集結了吳彥祖,張孝全,張若昀三大型男。小編表示的確是沖著顏值舔屏去的。就吳彥祖帥氣,張孝全型男氣質,以及軍裝美男張...
    小北的糖閱讀 452評論 5 1
  • 第五十六章 徐艾和劉輝站在那里發(fā)呆,徐艾正欲往前走,劉輝一把拉住徐艾的胳膊說:“咱們別往前走了,我回去請你吃冰激凌...
    chief風閱讀 592評論 1 7

友情鏈接更多精彩內容