css選擇器以及優先級，你遇到的前端面試題都有什么？

1. cookie session 的用途和區別，以及有效期

1、cookie數據存放在客戶的瀏覽器上，session數據放在服務器上。

2、cookie不是很安全，別人可以分析存放在本地的COOKIE并進行COOKIE欺騙

考慮到安全應當使用session。

3、session會在一定時間內保存在服務器上。當訪問增多，會比較占用你服務器的性能

考慮到減輕服務器性能方面，應當使用COOKIE。

4、單個cookie保存的數據不能超過4K，很多瀏覽器都限制一個站點最多保存20個cookie。

2. vue的數據綁定原理，mvvm與mvc的區別

MVVM：

m:model數據模型層 v:view視圖層 vm:ViewModelvue中采用的是mvvm模式，這是從mvc衍生過來的MVVM讓視圖與viewmodel直接的關系特別的緊密，就是為了解決mvc反饋不及時的問題

圖片說明一下：

說到MVVM就要說一下雙向綁定和數據劫持的原理，

MVC：

m:model數據模型層 v:view視圖層 c:controller控制器

原理：c層需要控制model層的數據在view層進行顯示

MVC兩種方式，圖片說明：

總結：

mvvm與mvc最大的區別：MVVM實現了view與model的自動同步，也就是model屬性改變的時候， 我們不需要再自己手動操作dom元素去改變view的顯示，而是改變屬性后該屬性對應的view層會自動改變。

不懂得可以復制鏈接查看：

https://www.pianshen.com/article/3716256399/

3. storage 的區別 sessionStorage localStorage

localStorage的生命周期是永久性的。假若使用localStorage存儲數據，即使關閉瀏覽器，也不會讓數據消失，除非主動的去刪除數據，使用的方法如上所示。localStorage有length屬性

sessionStorage 的生命周期是在瀏覽器關閉前。也就是說，在整個瀏覽器未關閉前，其數據一直都是存在的。sessionStorage也有length屬性，其基本的判斷和使用方法和localStorage的使用是一致的

4.v-model雙向數據原理

有一個文本框 通過v-bind綁定了value屬性 值為myname 是我們在vue實例中定義的屬性傳統我們獲取文本框值方法 可能通過getElementById找到文本框 然后獲取其value屬性但是vue中直接通過v-bind綁定了value屬性 所以不需要像之前那樣獲取值所以在后面的按鈕中獲取name值 直接獲取vue實例對象data里面的myname屬性即可

【數據為尊 ----數據映射到瀏覽器 如果數據v-model后修改（肯定input）然后到數據在有數據映射到瀏覽器頁面 ----映射關系統稱】

5.keepAlive用過嗎？什么作用？

緩存路由組件

使用的是vue的一個組件，參考vue的官方文檔

使用這個東西可以保證我們在切換組件的時候，原來顯示的組件不被銷毀

-----【保障組件的數據不會被切換路由而銷毀數據】

<keep-alive include="Home"> Home是對應的組件對象的名字，不是路由的名字

<router-view></router-view>

</keep-alive>

6.多維數組拍平

數組拍平也稱數組扁平化，就是將數組里面的數組打開，最后合并為一個數組

一紅六種方法吧……

了解的請看：https://www.cnblogs.com/guan-shan/p/10165737.html

7.跨域的原因 解決方案

跨域是指一個域下的文檔或腳本試圖去請求另一個域下的資源，這里跨域是廣義的。

這樣就可以說同源策略----協議---端口---域名

原生的src和href可以解決跨域

代理可以解決

請求頭也可以攜帶瀏覽器提示的也可以解決

一般都是后端解決跨域問題

【別的需要了解看下方鏈接】

https://blog.csdn.net/qq_41604383/article/details/100770100

8.uniApp兼容問題

§ 如果你使用cli創建項目（即項目根目錄是package.json），不管用什么ide，即便是用HBuilderX，切記cli項目的編譯器是在項目下的，HBuilderX不管怎么升級都不會影響編譯器版本。你需要手動npm update來升級編譯器。以及如果你想要安裝less、scss等預編譯器，也需要自己npm安裝在項目下，而不是在HBuilderX的插件管理里安裝。

§ 如果你使用離線打包，請注意HBuilderX升級后，真機運行基座和云打包對應引擎跟隨HBuilderX升級，而你的sdk需要手動升級。sdk的版本升級一般滯后HBuilderX正式版升級一兩天。

§ 如果你使用自定義基座，之前制作的自定義基座是不會跟隨HBuilderX升級的，升級HBuilderX后你應該重新制作新版自定義基座。

§ 如果你使用wgt升級，新版HBuilderX編譯的wgt，運行到之前的runtime上，一定要先測試好，看有沒有兼容性問題。如果有問題，就不要wgt升級，整包升級。

§ 考慮到向下兼容，uni-app編譯器在升級為新的自定義組件模式后，同時保留了對老編譯模式的向下兼容。在HBuilderX alpha版中，App端一定會使用新編譯器，不理會manifest配置。在HBuilderX 正式版中，新創建的項目會使用新編譯器，老項目不會強制使用，而是開發者自己在manifest里配置開啟。

§ 如果你使用其他ide開發uni-app，會經常因為拼錯單詞而運行失敗，因為經過webpack編譯一道，很多錯誤反應的不夠直觀，排錯時間很長，不如從開始就依賴有良好提示的HBuilderX，避免敲錯單詞。

§ 云打包的引擎版本說明HBuilderX Alpha，只有1套云打包機，不管你的HBuilderX alpha版本多少，對應的打包機一定是最新的alpha版的客戶端引擎。HBuilderX正式版，有2套打包機，一個是最新正式版，一個是次新正式版。中間的緊急更新版本沒有獨立打包機。舉個例子：HBuilderX 有1.8.0、1.8.1、1.8.2、1.9.0、1.9.1這幾個正式版。那么當前可用的打包機有1.9.1和1.8.2這2臺。（即每個大版本的最后一個版本）除了這2個HBuilderX版本外，其他版本的云打包都指向最新的1.9.1版對應的打包機。（即只保留2個大版本的云打包機）

【詳情請看】

https://ask.dcloud.net.cn/article/35845

Java程序員面試中容易被問哪些問題？

謝邀~

從第二家單位開始，就負責社招的面試工作（技術方面），近兩兩年，也開始負責校招的工作，和大家分享一下我一般會問的問題，和一些我比較看重的地方，大家可以借鑒。

校招

其實說實話，我們單位校招沒有什么優勢，一般來面試我們公司開發崗位的，最好也就是中等偏上的985學校（最低要求是一本）。所以一般來說，只要不是溝通能力特別差的，基本都會通過。但是面試流程還是要走的，我一般問的都特別簡單：

基本的數據結構和算法的問題，都是大學課程里面涵蓋的內容。一些Java的基礎知識，基礎到Java的基本類型有哪些，String是基本類型么，諸如此類。簡單的SQL語法。最難的可能就是簡單的編程問題，基本上就是一個main函數搞定的，輸入幾個值，經過計算得到結果。初級

我主要是面試乙方（外包），初級基本上要兩年以上工作經驗；基本上簡歷上寫什么，我就問什么，所以我建議，如果你不會的東西，不要隨便寫在簡歷上。

先做自我介紹，主要看一下表達能力和第一印象，所以我建議大家面試之前都準備一套自我介紹的詞兒。

基本上還是從項目出發，先問一下業務上的流程，這個階段的開發，我對整個項目的流程問的少，還是主要問單個模塊的業務流程。

技術方面主要以使用為主，就是看看你是否到底使用過。比如寫了使用過Mybatis，那么我可能會問#和$的區別，如果寫了使用過Spring的話，那么我可能會問依賴注入有幾種方式，諸如此類。

SQL方面會問一些復雜SQL的寫法，比如一些數據庫函數，左連接右連接之類的。

中級

工作三到五年的。

還是從項目出發，問的可能會稍微的多一些，希望對方可以對整個項目甚至是某一個行業有著整體的了解。

技術方面不僅僅要求是使用過了，我的要求可能會更高一些。如果還是Mybatis，那么我就可能會問到一級二級緩存，甚至是自定義緩存，如果是Spring的話，可能就會問到Bean是如何被管理的。

一些主流技術和框架，可能你沒寫在簡歷上，但是我也會問一問。比如現在很常見的內存數據庫、Spring Boot等。

Java基礎知識可能會問，比如JVM相關、Java的集合等。

SQL方面，優化是我主要問的，比如索引失效的問題。

高級的一般都招不來，哈哈，沒有面試過。

我將持續分享Java開發、架構設計、程序員職業發展等方面的見解，希望能得到你的關注。

前端說改個東西要兩天？

我也是后端開發，但是想強答一波 （手動斜眼）

后端開發主要是理清楚邏輯，在框架內將所需要的的數據提供給前端展示出來。其中所有的目標是明確的。我就是需要這部分的數據，所選擇的技術類型在框架內也會有明確的要求。所以后臺開發的時間基本是在對業務邏輯的整理上面。

前端的需求則是對數據的展示。獲取到數據后，他們需要考慮的展示效果包括展示界面的大小是否合適，顏色調整，界面功能圖標選擇，選擇的圖標，原型是否符合審美，對整理的風格是否統一等都需要考慮。有的一個圖標選擇困難癥就會糾結很久。而且有一個眾所周知的點，產品經理與程序員的 矛盾。他看著簡單的問題，但是實現起來很復雜。有可能后端覺得前端展示非常簡單，其實也是一種片面的看法。

前端的展示對一個產品有著十分重要的作用。 前后端分離，也是為了更好的成品。

如何學習Web開發？

web framework層出不窮，特別是ruby/python,各有10+個,php/java也是一大堆 根據我自己的經驗寫了一個to do list,按照這個清單，一條一條的學習，事半功倍，很快就能掌握 一共25條，即便很磨蹭，2小時也能搞定一條，25*2=50。只需要50小時就能掌握任意一種web框架各類web框架大同小異:現代web開發框架的6大元素，把握主線，就不會迷路

建議把本文打印到一張A4紙，搞定一條打個勾

web框架學習列表 如何定義 url router如何組織 request handler 函數寫一個最簡單的request handler 函數如何從get/post請求中取出參數如何定義全局url 攔截函數如何獲取/修改/存儲 cookie,session數據如何修改/輸出 http header 數據如何部部署app 程序服務器部署可以參考讀python web 程序的9種部署方式如何配置開發環境如何配置靜態文件訪問如何訪問數據庫是否支持ORM支持orm如何維護表結構的變更如何定義/組織/初始化 數據表如何對接orm系統和現有的表結構掌握最基本的add/delete/按字段查詢/count/slice/order by如何直接使用sql 訪問數據庫不支持orm (這樣的web框架，不用也罷)如何使用模板系統如何組織/訪問 模板文件的目錄結構如何在模板中嵌入代碼模板是否支持繼承結構模板之間如何include如何自定義模板函數如何通過http get/post 獲取遠程數據如何parse json如何parse xml如何輸出為 json如何處理狀態碼:404和50x如何處理文件上傳可選的學習項目 發送emaillog圖片處理誤區 表單驗證輔助函數，很多框架的表單驗證部分實現的特別復雜，初學者完全不需要，手寫代碼處理就夠用ORM中的hasone,manytomany,onetomany關系,概念很復雜，其實只是多寫/少寫一個查詢字段的關系，學習成本太高，初學者完全不需要理會，直接跳過。

如何快速學習一個WEB開發框架http://www.pcpob.com/article/view/1939-how-to-study-a-web-framework

如果已經學會了一個PHP框架，再去學習其他php框架，那么會很容易上手。但是如果還沒有php框架基礎，想去學習php框架，往往是一頭霧水，不知道從哪里下手，從我學習php框架的經驗，給大家分享一下，如何快速的去學習并掌握一個框架。一，選擇一個合適的php框架 在國內，使用zf,ci和tp框架的人比較多，新手可以從中選一個去學習,新手不建議一開始就去學習zf，功力還不夠深，學習zf會讓你更迷茫。如果php基礎實在太差，學習ci和tp都覺得有點難度，那么建議去學習一下我做的框架--canphp框架（簡稱cp，qq群：74781204），cp=ci+tp的結晶，更為簡單，更容易理解。二，選定一個php框架之后，如何去學習第一步，把下載回來的框架壓縮包解壓，然后把每個目錄和文件名，大致的瀏覽一遍。這樣可以大概看出，這個php框架中大致布局和具有哪些功能。第二步，學習輸出hello world，hello world很簡單，但是對于學習一門新的語言或框架，很重要。第三步，學習理解單一入口和網址解析（即網址路由），單一入口，對于新手來說，可能有點不太好理解。第四步，學習php框架的內置的模板操作，主要學習程序是怎么賦值給模板，怎么加載模板和常用的模板標簽第五步，學習數據庫的添加，修改，刪除，查詢，學會簡單的數據庫操作。第六步，學習php框架常用的函數和類庫，php框架中一般會帶一些常用的函數和類，可以稍微看一下，此時還沒有必要深入研究，等用到的時候再詳細的去看手冊和樣例。第七步，下載基于此框架開源的項目系統下來學習，了解了php框架的執行流程，模板操作，和數據庫操作，下載一個開源的系統，下來去學習，學習別人的代碼，學得更快。第八步，做項目學習，要熟練掌握一個的框架，需要大量的實踐，通過做項目，去深入學習。第九步，閱讀框架代碼，了解其實現原理

第十步，到這一步，你已經學會了這個php框架。

在StackExchange上有人問了這樣一個問題：What should every programmer know about web development?（關于Web開發，什么是所有程序員需要知道的？）里面給出的答案非常不錯，所以，我翻譯轉載過來。 順便說一下，StackExchange真是非常好，大家可以對同一個答案做貢獻和修訂，看看這個問題的修訂過程你就知道了——專業的問答網站應該怎么去做。這就是我在這篇文章中也說過真正的用戶體驗是什么樣的。

好了，下面是正文（我對原文做了一些批注，也許不對或有誤導，請大家指正）

下面的這些東西可能對于大多數人并不陌生，但是可能會有些東西你以前并沒有看過，或是沒有完全搞懂，甚至都沒有聽說過。（陳皓注：我相信當你看完這個列表后，你會覺得對于我國的Web開發有點弱了，還是那句話，表面上的東西永遠是膚淺的）

接口和用戶體驗

小心瀏覽器的實現標準上的不一致，確信讓你的網站能夠適當地跨瀏覽器。至少，你的網站需要測試一下下面的瀏覽器：最新的 Gecko 引擎 (Firefox)，一個 Webkit 引擎 (Safari,Chrome, 或是其它的移動設備上的瀏覽器)IE 瀏覽器 (測試IE的兼容性你可以使用微軟IE的Application Compatibility VPC Images)Opera 瀏覽器。

最后，你可以使用一下這個工具 來看看你的網頁在不同的瀏覽器下是怎么被顯示出來的（陳皓注：這個工具就是以前本站介紹過的在不同瀏覽器和平臺上檢查你的網站的兼容性）

多考慮一下人們是怎么來訪問你的網站而不是那些主流的瀏覽器：手機，讀屏軟件和搜索引擎，例如：一些Accessibility的東西： WAI 和 Section508, 移動設備開發：MobiForge.部署Staging：怎么部署網站的更新而不會影響用戶的訪問。 Ed Lucas的答案 可以讓你了解一些（陳皓注：Ed說了一些如版本控制，自動化build，備份，回滾等機制）。千萬不要直接給用戶顯示不友好的錯誤信息。千萬不要把用戶的郵件地址以明文顯示出來，這樣會被爬蟲爬走并被讓用戶的郵箱被垃圾郵件搞死。為用戶的鏈接加上 rel="nofollow" 的屬性以 避免垃圾網站的干擾。（陳皓注：nofollow是HTML的一個屬性，用于通知搜索引擎“這個鏈接所指向的網頁非我所能控制，對其內容不予置評”，或者簡單地說，該鏈接不是對目標網站或網頁的“投票”，這樣搜索引擎不會再訪問這個鏈接。這個是用來減少一些特定垃圾頁面對原網站的影響，從而可以改善搜索結果的質量，并且防止垃圾鏈接的蔓延。）為網站建立一些的限制 - 這個屬于安全性的范疇。（陳皓注：比如你在Google注冊郵箱時，你一口氣注冊超過兩個以上的郵箱，gmail要求給你發短信或是給你打電話認證，比如Discuz論壇的會限制你發貼或是搜索的間隔時間等等，更多的網站會用CAPTCHA來確認是人為的操作。 這些限制都是為了防止垃圾和惡意攻擊）學習如何做 Progressive Enhancement. （陳皓注：Progressive Enhancement是一個Web Design的理念，如：1）基礎的內容和功能應該可以被所有的瀏覽器存取，2）頁面布局的應該使用外部的CSS鏈接，3）Javascript也應該是外部鏈接還應該是unobtrusive 的，4）應該讓用戶可以設置他們的偏好）如果POST成功，要在POST方法后重定向網址，這樣可以阻止用戶通過刷新頁面重復提交。嚴重關注Accessibility。因為這是法律上的需求（陳皓注：Section 508是美國的508法案，其是美國勞工復健法的改進，它是一部聯邦法律，這個法律要求所有技術要考慮到殘障人士的應用，如果某個大眾信息傳播網站，如果某些用戶群體（如殘疾人）瀏覽該網站獲取信息時，如果他們無法正常獲得所期望的信息（如無法正常瀏覽），那可以依據相關法規，可以對該網站依法起訴）。WAI-ARIA 為這方面的事提供很不錯的資源.

安全

在網上有很多關于安全的文章，但是 OWASP 開發指導 涵蓋了幾乎所有關于Web站點安全的東西。（陳皓注：OWASP(開放Web應用安全項目- Open Web Application Security Project)是一個開放的非營利性組織，目前全球有130個分會近萬名會員，其主要目標是研議協助解決Web軟體安全之標準、工具與技術文件，長期 致力于協助政府或企業了解并改善網頁應用程式與網頁服務的安全性。OWASP被視為Web應用安全領域的權威參考。2009年下列發布的美國國家和國際立法、標準、準則、委員會和行業實務守則參考引用了OWASP。美國聯邦貿易委員會(FTC)強烈建議所有企業需遵循OWASP十大WEB弱點防護守則）