一個大四前端實習生的2018年總結

這是2018年的最後一個小時，此刻我正在改着個人畢業設計開題報告，坐在電腦前突然有點感慨，因而打算作個年終總結，順便把今年所學所想作個梳理和回顧。

年初

回想今年，
彷佛走了不少路，
嘗試了不少東西，
在年初二月份左右選擇了考研，
嘗試着想去讀華南師範大學的軟件工程，
可是在不少緣由的影響下，在七月初放棄了這個目標，
終是選擇走上了前端的道路。
雖然彷佛前半年的努力彷佛是化做烏有，
可是那段時間的專一多是我大學三年以來絕無僅有，
因此彷佛也不算是浪費。

年中

在七月底決定放棄考研後找到了一份js軟件工程師的工做，
前端技術棧是基於VUE的nuxt.js，
後端是Egg.js。
兩個月的工做時間內負責的都是前端的內容，包括頁面，debugger和舊項目的維護。
可是由於公司須要常常出差而且離家遠，
天天早上須要六點鐘起牀才能保證不遲到，
而且還要擠那條四五趟才能擠得上去的廣州地鐵三號線，
因而乎在九月底的時候面試瞭如今的公司並順利收到了offer。

年末

目前在如今的公司中寫react，
感受負責的內容是我感興趣和喜歡的，
環境和大佬都很nice。
說實話今年折騰得挺厲害的，
在決定放棄考研以後，從新拾起代碼，
去找了幾份VUE的項目去模仿和學習，
買了阿里雲的學生服務器，
搭建了本身的博客  
寫了一些基礎算法的JS可視化的實現，
寫了一個網頁版的我的簡歷，學會了挺多東西。
如今回想起剛開始面試的時候，
沒日沒夜地擼文檔，
一般是下午收到了面試通知，
熬夜地去讀文檔，看項目，刷面試題，
次日去面試完回到家大概是下午四五點左右，
整我的一會去直接灘在牀上一覺睡到次日的一兩點，
那段時間感受本身真的像是快要死了同樣。
這段時間一共面試了大概六七家公司
（若是不包括3家培訓機構和2家外包公司，
培訓機構的電話其實很好識別，
面試的時候若是你能帶着面試官的節奏走，
而且他們聊到和涉及的技術都是大概是十年前的技術的話，
例如還在談SSH、jsp之類的話十有八九都是培訓機構了），

收到了四個offer，也算是不枉努力。

下面是今年學習和複習到的技術內容以及碰到的一些坑的總結

基礎內容

Html部分

1.標籤基礎
2.HTML5的新特性
3.HTML事件
4.Canvas （不太熟悉）
5.MathML
6.Html表單
7.Html的語義化
8.Web SQL 數據庫，使用 SQL 操做客戶端數據庫的 APIs。
9.Web Workers
10.meta 標籤
11.Get和Post的差異
12.HTTP 狀態消息
13.Html中塊註釋

CSS部分

1.CSS基礎內容
2.CSS 2D 3D
3.CSS 動畫
4.純CSS實現分頁
5.CSS經常使用動態效果
6.佈局
         - Flex佈局
         - 柵格佈局
         - 使用BFC隱藏屬性
         - float + margin
         - absolute + margin
         - 聖盃佈局
         - 雙飛翼佈局
7.CSS媒體查詢
8.CSS 絕對定位和相對定位的深刻了解
9.transform 
10.字體圖標的使用
11.8種清除浮動的方式（手動滑稽，實際上只有觸發BFC和非觸發BFC兩種，不過有個新的方法）
12.各類垂直居中和水平居中的方式 ，包括
         - 文字圖片垂直居中
         - 塊級元素水平居中
         - 居中, 不肯定尺寸, 不兼容 IE6
         - 居中, 肯定尺寸, 兼容 IE6
         - 居中, CSS3 平移方式, 兼容性不行
         - 居中, Flex 方式, 兼容性不行
         - 定寬居中頁面佈局
13.響應式佈局的實現方式
14.僞類和僞元素
15.瀏覽器如何解析CSS
16.瀏覽器渲染html,css,js過程
17.IE兼容性問題總結
18.less基礎
19.less的混入問題
20.less如何優雅地封裝
21.stylus

JavaScript部分

1. javascript基礎內容
2. js如何去實現封裝和繼承
3. js處理事件機制
4. js事件委託
5. 如何去優雅地操縱dom
6. cookie、sessionStorage、globalStorage、localStorage
7. 表單處理
8. 正則
9. 閉包的深刻理解
10. this的深刻理解
11. 回調函數的理解以及如何去處理回調地獄問題
12. Json
13. Ajax
14. Xml
15. Xpath
16. ES6的新特性，用得比較多的是下面這些（好像基本都用到了= =）
        - let和const
        - 變量的解構賦值
        - 字符串擴展
        - 數值的擴展
        - 函數的擴展（巨喜歡class和箭頭函數，終於讓我有種在寫java的感受了）
        - 數組的擴展
        - 對象的擴展及其新增方法
        - Set和Map
        - Promise對象
        - Generator和async 
        - Class及其繼承
17. 移動端js實現拖拽效果
18. JavaScript代碼規範
19. 淺拷貝和深拷貝的區別
20. 原型鏈的深刻理解
21. Js的柯里化
22. 如何實現無限級菜單
23. JavaScript性能優化
24. Js中的document和windows對象
25. 本地緩存和瀏覽器緩存的區別
26. 經常使用js方法總結
27. Json數組對象中鍵值重複判斷的方法
28. SetTimeout和setInterval
29. 跨域獲取json數據
30. 調試與異常處理
31. Js異步解決方案

Node.js部分

1.Squelize
2.Proxy
3.Process對象
4.egg

前端優化部分

1. webpack
2. CDN
3. GoPng雪碧圖
4. 避免直接操縱dom
5. 不使用IE的Filter
6. 樣式表放頭部，js放底部
7. Js 方面
8. 引入資源的域名不要包含cookie
9. 減小cookie的大小
10. 避免空src的img標籤
11. 合理設計事件監聽器
12. 優化css精靈
13. 不要在html中拉伸圖片
14. 添加Expires或者Cache-Control響應頭
15. 按需加載和延遲加載
16. 避免重定向
17. 減小DNS查詢
18. 減小HTTP請求

框架部分

前端

1.jQuery
2.VUE.js
3.NUXT.js
4.React
5.Dva.js

開箱即用的UI框架

1.bootstrap
2.MUI
3.amazeUI
4.tree.js
5.Quasar.js
6.Element
7.Swiper
8.Ant design
9.Ant design Mobile
10.Kendo UI
11.Animate.css
12.WOW.js
13.AUI

一些經常使用或者用過的插件庫

1. axios    (一個基於 promise 的 HTTP 庫，能夠用在瀏覽器和 node.js 中。)
2. babel-polyfill  (一個將ES6語法轉換爲ES5的庫)
3. classnames.js   (解決可引入多類名問題的庫)
4. echarts （一個用於數據可視化的圖表庫）
5. Mock.js （Mock系統是一個簡單、高效、能夠快速生成模擬數據的mock服務）
6. redux-connect （異步路由跳轉）
7. react-virtual-list （長列表渲染）
8. Ramda.js ( JavaScript 函數式編程庫。)
9. immer （以帶反作用的方式修改數據並返回新引用的數據，不會影響原始數據）
10. react-content-loader （內容佔位的loading）
11. PropTypes （用於類型檢測的庫）
12. vue全家桶
13. react全家桶
14. js-cookie.js
15. js-base64.js
16. vue-countup-v2.js
17. XLSX.js
18. Sequelize.js
19. Electron.js
20. Lodash.js
21. Animate.css
22. Anime.js
23. Hover.css
24. wow.js
25. Velocity.js
26. move.js
27. iscroll
28. Swiper
29. layer
30. Bootbox.js
31. ustbhuangyi/picke
32. Bootstrap Colorpicker 2
33. Moment.js
34. timeago.js
35. validator.js
36. Editor.md
37. UEditor
38. Masonry
39. barcode
40. jquery.qrcode.js
41. vue-i18n
42. store.js
43. ustbhuangyi/storage
44. jsonp
45. Zooming
46. FastClick
47. better-scroll
48. history.js
49. Numeral.js
50. react-native-scrolltotop
51. react-router-cache-route

碰過的一些坑

1.margin-top和margin-bottom失效問題
2.display:inline-block;後margin失效問題
3.元素坍塌問題
4.塊級元素與行內元素之間轉換
5.外邊距塌陷問題
6.React的傳值問題
7.跨域獲取數據失敗問題
8.Iframe跨域通信問題 
9.React 和react-router ,實現回退的時候，如何使頁面回退到之前的狀態
10.多行文本框拖動問題解決
11.List-style-type屬性失效
12.Rem和em問題
13.react如何記錄頁面前的狀態，在不用redux的狀況下
14.緩存致使的問題
15.React如何去渲染HTML代碼
16.如何解決跨域問題
17.浮點數的問題
18.react實現搜索結果高亮顯示
19.js的dom獲取曾祖父節點或者玄孫節點的辦法

不少之前碰過的坑都忘了，或者已經不是坑的坑就省略了…

下面從幾個方面總結一下今年我的的狀況

學習

雖然放棄了考研是一大遺憾，

可是今年在學習方面起碼不會讓本身以爲羞愧，

也算無愧於本身了。

事業

雖然仍是一個實習生，

可是從大二以來就在一直問本身，

我是否是真的十分熱愛技術，真的喜歡擼代碼，

是否真的把這件事做爲我日後的職業規劃，

哪怕是如今我也不太敢確定，

可是起碼我在擼代碼的時候並不會反感

也不會抗拒去學習新的技術

在解決一個難題以後也會感到十分開心

會由於本身作了一點好玩和有趣的東西而感到沾沾自喜，

這樣就夠了

哪怕前路未定，

可是這樣走下去就夠了。

身體

自從高中以來，個人身體素質是一直在降低的，

這是能夠明顯而且能夠直接感覺到的事情，

體重也在不斷地上漲，

彷佛有一發不可收拾的趨勢，

今年的體重在增減中不斷地重複，

鍛鍊也在斷斷續續地進行，

可是總的來講是確定不夠的，

但願明年可以真正地，系統地鍛鍊本身的身體。

畢竟一切東西都創建在身體健康的前提下。

愛好

唱歌仍然是爲數很少的愛好之一

美食和烹飪也是不可放棄的東西

很高興今年本身的唱歌水平有所提高（雖然還不是很好聽就是了，哈哈哈）

有時間能夠去精心烹飪同樣事物，

而後慢慢地品嚐，

或者去尋遍大街小巷的美食，

也是爲數很少的樂趣了吧

今年閱讀的有趣書籍並很少，

不少打算看的書並無去看，

這算是今年的遺憾了吧

愛情

終於有一天，性再也不是羞恥和禁忌，

而是像吃飯喝水同樣簡單，

愛卻成爲了勇敢者的遊戲。

大多數人都相信愛情的存在

可是他們並不相信這種東西會落到本身頭上

這個世界上即便是本身也很難明白本身

又怎麼能奢求有另一我的互相理解？

至少目前爲止這件事情並不在個人規劃範圍以內

我沒有嘗試過那種一顆送的巧克力能夠保留好幾年的感受

除了年少不更事時的當心翼翼的心動，

也少有爲誰心動的感受，

可是我不想由於這種事情變得如此卑微、敏感和當心翼翼的樣子

那樣的我不該該是我

見識過大多數的人，

哪怕是對陌生人也不是這般

卻能理所固然地對身邊人施以此般

不少人彷佛連作人都還不會

就已經急着去談戀愛和結婚生子

只但願我不是其中一個。

平分秋色或許纔是感情最好的狀態。

明年計劃和目標

1.鍛鍊身體
2.看各種書籍，至少包括10本計算機領域經典書籍和10本其餘領域的書籍
3.每週至少能刷2題LeetCode
4.學會注意形象，學會衣服搭配
5.有時間能去處處走走，或者來一場長途騎行
6.學會同樣樂器
7.研究各類美食作法
8.去找到幾家不錯的小店嘗試它的事物
9.注意做息，避免熬夜
10.填幾首歌的詞