---
tags: 第一章
---
# 前端基礎知識
## VScode
### VScode插件
Chinese (Traditional) Language Pack for Visual Studio Code
Live Server
open in browser
### VScode快捷鍵
ctrl+s 保存
alt+z 畫面上自動換行
tab 縮排
shift+tab 倒退縮排
alt+↑ 將這一行文字向上平移
alt+↓ 將這一行文字向下平移
ctrl+shift+x 搜尋插件
alt+b 從瀏覽器打開(要裝插件)
ctrl+b 暫時關閉VS code 側邊檔案欄
==!+ENTER 生成HTML基本骨架==
ctrl+/ 將選取的地方註釋或取消註釋
alt+shift+a 多行註釋
alt+shift+f 程式碼排版格式化
ctrl+d 找出相同的單字/選取一個段落文字
ctrl+d+d 將相同單字都選取並可以一次全部刪改
ctrl+shift+L 瞬間將相同單字都選取並可以一次全部刪改
alt+shift+↑ (先選取一段落)直接複製貼上在上方
alt+shift+↓ (先選取一段落)直接複製貼上在下方
alt+shift+滑鼠左鍵點終點 輸入游標變超長垂直線
alt+滑鼠左鍵 滑鼠焦點影分身之術
ctrl+shift+P 打開附加功能選單
ctrl+k+0 將HTML標籤全摺起來
ctrl+k+j 將HTML標籤全打開來
### 快捷鍵
ctrl+r 網頁重新整理
F5 網頁重新整理
## HTML
網頁的基本組成:文字、圖片、音訊、影片、超連結
五大瀏覽器:
渲染引擎
IE:Trident
firefox:Gecko
chrome:Blink
safari:Webkit
opera:Blink
結構:HTML頁面元素
表現:CSS頁面樣式
行為:JavaScript頁面交互的動態效果
HTML:超文本標記語言
標籤與標籤的關係有兩種
嵌套關係:例如head和title
並列關係:例如head和body
## CSS
css:層疊樣式表
名詞解釋:連續寫相同屬性，後面的會覆蓋前面的

p html說法為p標籤
p{} css說法為標籤選擇器

# JavaScript
## 基礎知識
計算機語言:機器語言、匯編語言、高級語言
編程語言:匯編語言、高級語言
機器語言:就是0和1
匯編語言:本質跟機器語言一樣，只是有用英文縮寫和標識符
高級語言:C、C++、C#、Java、Python、PHP、JavaScript、Go、Objective-C、Swift
編程語言->翻譯器->機器語言
編程語言:主動的，有很強的邏輯和行為能力，有很多if else、for、while
標記語言:被動的，不向計算機發出指令，常用於格式化和鏈接，它的存在是用來被讀取的

計算機硬件:輸入設備、輸出設備、CPU、硬盤、內存
計算機軟件:系統軟件、應用軟件
bit=1
1Byte=8bit
1kb=1024b
1mb=1024kb
1gb=1024mb
1tb=1024gb
硬盤(機械)->內存條(電)->CPU

JavaScript:在客戶端的腳本語言(Script就是腳本)
腳本語言:不需要編譯，由JS引擎解釋執行，特性是逐行
Node.js在服務器端進行編成
JS作用:表單校驗(最初目的)、網頁特效、服務端開發(Node.js)、桌面程序、APP、控制硬件-物聯網、遊戲開發

渲染引擎:解析HTML和CSS，俗稱內核，例如chrome裡的blink
JS引擎:例如chrome裡的V8

JavaScript組成
ECMAscript:JavaScript語法
DOM:頁面文檔對象模型
BOM:瀏覽器對象模型
## 額外知識
編譯型語言Java
與
解釋型語言JavaScript
Java->Java編譯器->中間代碼文件->運行時編譯->機器語言->執行
JavaScript->JavaScript引擎->機器語言->執行

表達式與返回值
2 = 1 + 1
1 + 1 表達式
2 返回值