1. 程式人生 > 其它 >前端"基礎面試題"

前端"基礎面試題"

前端基礎題

選擇題

1.網頁尾本語言中最為常用的是(A)

  • A. javascript
  • B. VB
  • C. Perl
  • D. JSP

2.下面不屬於CSS引入的形式是(C)

  • A. 行內式
  • B. 內嵌式
  • C. 載入式
  • D. 外鏈式

3.body元素用於背景顏色的屬性是(C)

  • A. alink
  • B. vlink
  • C. bgcolor
  • D. background

4.在HTML中,要定義一個空連結使用什麼標記(A)

5.下列表達式結果為真的是(B)

  • A. 5 > "5"
  • B. 1 == true
  • C. Math.round(10.5) = 11 > 12
  • D. NaN == NaN

6.定義JavaScript陣列的正確方法是( A )

  • A. var txt = new Array("tim","kim","jim")
  • B. var txt = new Array(1:"tim",2:"kim",3:"jim")
  • C. var txt = new Array="tim","kim","jim"
  • D. var txt = newArray:1=("tim")2=("kim")3=("jim")

7.下列宣告自定義函式getRandomColor()的格式正確的是( B )

  • A. function : getRandomColor (){}
  • B. function getRandomColor (){ }
  • C. function =getRandomColor (){}
  • D. function{getRandomColor ()}

8.分析下面的javascript程式碼段,輸出結果是( C )

var   mystring="I am a good student"; 
a=mystring.indexOf("good");
document.write(a); 
  • A. 5
  • B. 6
  • C. 7
  • D. 8

9.下列簡寫和對應的全稱不正確的是?( B )

  • A 檔案傳輸協議FTP
  • B 超文字傳輸協議HTML
  • C 超文字標記語言HTML
  • D 統一資源定位符URL

10.在新視窗中開啟連結的HTML程式碼是 ( B )

  • A. <a href="url" target="_top">
  • B. <a href="url" target="_blank">
  • C. <a href="url" target="new">
  • D. <a href="url" target="_main">

判斷題

1.Math物件只能實現向上取整和向下取整。( ×)

2.""是HTML註釋標記,“//”是JavaScript註釋標記。( √ )

3.函式如果需要返回一個特定型別的值,必須使用return語句。( √ )

4.只有絕對定位可以使元素脫離原來的文件流。( × )

5.在引用外部的css檔案和js檔案時採用絕對路徑的方式比相對路徑更加穩定簡潔。( × )

6.在JavaScript中,要獲取字串的長度就呼叫length方法。( × )

7.id選擇器使用“#”進行標識,後面緊跟id名。( √ )

8.email.IndexOf(“@”)==-1表示的是email物件中不含有@這個字元。( √ )

9.網路安全的特徵不包括可用性。( × )

10.對元素應用“overflow:visible;”樣式,可清除浮動對該元素的影響。(×)

簡答題(Vue)

v-show 與 v-if 區別

v-hsow和v-if的區別:
v-show是css切換,v-if是完整的銷燬和重新建立。
使用:
頻繁切換時用v-show,執行時較少改變時用v-if
v-if=‘false’ v-if是條件渲染,當false的時候不會渲染

元件間的通訊

1.父子 props/event $parent/$children ref provide/inject
2.兄弟 bus vuex
3.跨級 bus vuex provide.inject

路由的跳轉方式

一般有兩種
<router-link to='home'> router-link標籤會渲染為<a>標籤,咋填template中的跳轉都是這種;
另一種是程式設計是導航 也就是通過js跳轉 比如 router.push('/home')

Vue的優點?

1.輕量級框架:只關注檢視層,是一個構建資料的檢視集合
2.簡單易學:國人開發,中文文件,不存在語言障礙 ,易於理解和學習;
3.雙向資料繫結:保留了angular的特點,在資料操作方面更為簡單;
4.元件化:保留了react的優點,實現了html的封裝和重用,在構建單頁面應用方面有著獨特的優勢;
5.檢視,資料,結構分離:使資料的更改更為簡單,不需要進行邏輯程式碼的修改,只需要操作資料就能完成相關操作;

v-show和v-if指令的共同點和不同點?

共同點:
都能控制元素的顯示和隱藏;
不同點:
實現本質方法不同,v-show本質就是通過控制css中的display設定為none,控制隱藏,只會編譯一次;v-if是動態的向DOM樹內新增或者刪除DOM元素,若初始值為false,就不會編譯了。而且v-if不停的銷燬和建立比較消耗效能。

說出幾種vue當中的指令和它的用法

v-model雙向資料繫結;
v-for迴圈;
v-if v-show 顯示與隱藏;
v-on事件;v-once: 只繫結一次。

v-modal的使用

v-model用於表單資料的雙向繫結,其實它就是一個語法糖,這個背後就做了兩個操作:
v-bind繫結一個value屬性;
v-on指令給當前元素繫結input事件。

請說出vue.cli專案中src目錄每個資料夾和檔案的用法

assets資料夾是放靜態資源;
components是放元件;
router是定義路由相關的配置; 
app.vue是一個應用主元件;
main.js是入口檔案。

什麼是MVVM?

MVVM是Model-View-ViewModel的縮寫。MVVM是一種設計思想。
Model 層代表資料模型,也可以在Model中定義資料修改和操作的業務邏輯;View 代表UI 元件,它負責將資料模型轉化成UI 展現出來,ViewModel 是一個同步View 和 Model的物件(橋樑)。

談談你對 Vue 生命週期的理解?

(1)生命週期:
Vue 例項有一個完整的生命週期,也就是從開始建立、初始化資料、編譯模版、掛載 Dom -> 渲染、更新 -> 渲染、解除安裝等一系列過程,我們稱這是 Vue 的生命週期。
(2)各個生命週期的作用:
beforeCreate	元件例項被建立之初,元件的屬性生效之前
created	元件例項已經完全建立,屬性也繫結,但真實 dom 還沒有生成,$el 還不可用
beforeMount	在掛載開始之前被呼叫:相關的 render 函式首次被呼叫
mounted	el 被新建立的 vm.$el 替換,並掛載到例項上去之後呼叫該鉤子
beforeUpdate	元件資料更新之前呼叫,發生在虛擬 DOM 打補丁之前
update	元件資料更新之後
activited	keep-alive 專屬,元件被啟用時呼叫
deactivated	keep-alive 專屬,元件被銷燬時呼叫
beforeDestory	元件銷燬前呼叫
destoryed	元件銷燬後呼叫

操作題

1.使用VSCode隨意編寫一個Vue

https://www.cnblogs.com/jaolvv/p/14676203.html

2.使用vue-cli腳手架構建一個Vue專案

https://www.cnblogs.com/jaolvv/p/14676203.html