前端開發(fā)最基本的3個語言

時間：2023-08-29 20:48:01 | 來源：網(wǎng)站運營

時間：2023-08-29 20:48:01 來源：網(wǎng)站運營

前端開發(fā)最基本的3個語言：做軟件開發(fā)，是從事編程開發(fā)工作，必須先從語法基礎(chǔ)開始學(xué)習(xí)，通過語法組成產(chǎn)品效果。

前端開發(fā)的基礎(chǔ)語法，由HTML+CSS+JavaScript組成，這是前端開發(fā)最基本的3個語言。

網(wǎng)頁布局基礎(chǔ)：HTML+CSS

HTML就是超文本標記語言，組成網(wǎng)頁內(nèi)容的最基本語言。你可以直接說他是網(wǎng)頁的骨架，網(wǎng)頁的圖片、文字、視頻、音頻、程序都需要他引入到網(wǎng)頁中體現(xiàn)。

光是HTML做網(wǎng)頁，只是有了內(nèi)容，當然是遠遠不夠的。因為只是HTML的話，只能用Table做布局才能勉強做出個成型的網(wǎng)頁來。但是從Web2.0時代開始，都是盒子模型布局法了，也就是用DIV+CSS來實現(xiàn)布局了。

CSS就是層疊樣式表。通過樣式屬性來對標簽進行布局規(guī)范，在不再使用table布局的時候，只要CSS樣式對網(wǎng)頁標簽進行對應(yīng)的布局實現(xiàn)才是正確的開發(fā)方式了。

HTML(div)+CSS布局，是基礎(chǔ)入門的基本步驟，在這個階段，你需要學(xué)習(xí)的內(nèi)容，包括有：

1.標簽語義化，SEO

2.頁面加載的流程和原理

3.網(wǎng)頁結(jié)構(gòu)

4.盒子模型（W3C盒子模型和IE盒子模型）

5.CSS選擇器

6.CSS布局浮動、定位

在剛剛開始的階段，大家學(xué)習(xí)的布局方式基本都是以px為單位的靜態(tài)布局方法。熟悉好布局方法，先給自己一個小目標，做一個簡單的電商網(wǎng)頁的基本結(jié)構(gòu)出來，不用特效，不需要交互。

瀏覽器腳本語言：JavaScript

JavaScript是我們學(xué)習(xí)前端開發(fā)中非常重要的一個內(nèi)容，也是一個大家經(jīng)常掉坑里的難點。JavaScript現(xiàn)在可以說是互聯(lián)網(wǎng)時代使用率最高的腳本語言了，在網(wǎng)頁中，所有的數(shù)據(jù)渲染，特效的交互都需要利用JavaScript，來影響瀏覽器的顯示。

JavaScript不只是開發(fā)網(wǎng)頁特效和渲染數(shù)據(jù)的重要內(nèi)容，在學(xué)習(xí)前端開發(fā)的后期，大量使用算法和框架的時候，對JavaScript基礎(chǔ)的考驗也是很多的。

在基礎(chǔ)階段，我們學(xué)習(xí)JavaScript需要注意：

1.基本關(guān)鍵字指令

2.基本數(shù)據(jù)類型、數(shù)組

3.函數(shù)

4.面向?qū)ο缶幊?br>
5.原型鏈、閉包

6.JSON

7.Ajax

8.DOM(文檔對象模型 原生DOM操作)

9.事件捕獲、冒泡、代理

10.常用函數(shù)方法

11.ES5、6、7

在JavaScript部分學(xué)習(xí)，主要還是要去理解好交互的原理，把原理分析清楚，真的理解語法，那寫出多復(fù)雜的邏輯也是手到擒來。

這些就是零基礎(chǔ)學(xué)習(xí)必備的一些基本內(nèi)容，在入門前端開發(fā)最基本需要掌握的東西，把基礎(chǔ)理解好，才能為后面的學(xué)習(xí)做更多的準備。

多終端進階學(xué)習(xí)

除了基礎(chǔ)的PC端，目前移動端可以說是非?；鸬牧?。

比PC端單一的網(wǎng)頁不同，在移動端的技術(shù)可以應(yīng)用到WEB-APP,小程序，Hybrid-App等等。

Web-App

也就是我們常見的瀏覽器（以及內(nèi)置瀏覽器，比如微信）打開的大型移動端網(wǎng)頁。比如我們常見的電商網(wǎng)站，功能性網(wǎng)站，管理網(wǎng)站，在布局和功能上都有APP的效果。

做好Web-App開發(fā)，最基本的很多人肯定會說響應(yīng)式布局，但是前端開發(fā)是又5種布局法的，除了出名的響應(yīng)式，還有在移動端最重要的彈性布局法，也就是很多人頭疼的rem布局

除了布局方法之外，在H5新特性和觸屏事件和設(shè)備兼容性問題也是需要信手拈來。

小程序

這個也不用多說，現(xiàn)在可以說是非常火的，各大平臺都有在做自己的小程序，各種砍價，搶票，電商，游戲都有運用。這個以微信小程序為例，主要是微信團隊基于前端基礎(chǔ)來做的封裝語法，主要的還是ES語法。小程序目前很多公司都是招聘前端開發(fā)，目前還沒有獨立的小程序開發(fā)工程師，所以小程序可以說是前端工程師高薪就業(yè)的加分技能，換句話說就是成熟開發(fā)必備了。

Hybrid-App

又稱混合式APP，可能聽說的人很少，但是18年是越來越多人去開發(fā)了，這種是能直接產(chǎn)出下載到終端的APP的，在體驗感上可以說已經(jīng)具備傳統(tǒng)APP的大部分功能了。這種開發(fā)門檻較低，也就是前端開發(fā)就可以完成。多數(shù)都是大包平臺就能做，這個你可以后面了解一下。

前端主流技術(shù)框架

前面的都是基礎(chǔ)東西，現(xiàn)在去就業(yè)前端開發(fā)，不是只靠個基礎(chǔ)東西，搞個移動端頁面就可以算成熟了。前端3大框架，VUE、Angular、React這3個可以說是現(xiàn)在非?；馃岬牧?。

基礎(chǔ)語法都可以寫的前端，為什么還要框架？

很多小白朋友是不懂什么是框架的，只聽過jQuery這些東西，以為就是框架。或者認為框架就是加速開發(fā)，覺得這些庫、插件就能完成框架的工作了。

其實框架的出現(xiàn)，是改變前端地位的重要標志。最重要的表現(xiàn)，就是前后端分離，在前后端分離之前，很多后端開發(fā)都是又當?shù)之攱尩?，效果不好效率也不高，我就是在后端出身，深知痛苦?br>
現(xiàn)在的前端項目，比以前是更加復(fù)雜化、多樣化了。項目復(fù)雜了，問題也多了。

那框架到底解決了什么問題？

解決重復(fù)引用外部js，以用jQuery開發(fā)為例，很多時候都是不能單一完成一個項目的，還需要引用很多的第三方插件和庫，導(dǎo)致會一個項目引入很多外部JS文件。

這樣不僅讓代碼變得雜亂，而且很影響打開速度。但是用框架呢，以VUE為例，一般會和構(gòu)建工具配合，然后就是一個入口文件就可以完成了，在運行時候就在入口引入一次，一勞永逸。

使用組件化開發(fā)，組件是前端框架里非常強大的功能之一，它可以擴展你的HTML，封裝可以重用的代碼塊，比如你的輪播圖、tab切換、頁面頭部、頁面底部等等。

這種獨立的組件具有了結(jié)構(gòu)（html），表現(xiàn)（css）和行為（js）完整的功能，很大程度的節(jié)省了代碼量，提高了代碼的復(fù)用性。特別是團隊合作的時候，可以很好的提高使用效率。

減少開發(fā)周期，如果你覺得jQuery可以減少開發(fā)周期了，那其實框架可以比庫更快。比如說使用jQuery開發(fā)的時候，很多時候是需要頻繁去操作DOM，每次效果都要去查找DOM，這樣就顯得很繁瑣了。使用框架的時候，很多功能都得到了封裝，比如說很多指令都有數(shù)據(jù)綁定，數(shù)據(jù)格式化這些功能。這樣更多時候，我們開發(fā)的時候只需要關(guān)注數(shù)據(jù)的邏輯就行了。

最后

這些也就是我們學(xué)會網(wǎng)頁制作，web app開發(fā)，學(xué)習(xí)前端開發(fā)必備的一些知識點了。學(xué)習(xí)路線放一下給大家。

---

如果你是前端小白或者打算轉(zhuǎn)行進入前端這個行業(yè)，不知道未來該怎么學(xué)習(xí)，都可以加入我組建的自學(xué)團，每天一起打卡學(xué)習(xí)，分享學(xué)習(xí)資料，定期組織實戰(zhàn)項目，匹配學(xué)習(xí)伙伴，我會嚴格監(jiān)督你們的。

作者：IT界小南瓜

原文鏈接：前端開發(fā)最基本的3個語言_IT-編程資訊-CSDN博客_前端開發(fā)語言