在浩瀚的人生中,興趣是人們通往成功的踏腳石,興趣是人們前進路上的路標。所以,興趣是我們最好的老師。
大家好,歡迎大家看我的第一篇文章,我是一名剛開始學習前端的小白:李海洋。
在這里我會分享一些日常學習的總結供大家一起學習,之后也會一直更新。
首先,我們需要搞清楚JS在整個前端中是干嘛的,一個網頁是由HTML,CSS和JS三大部分組成,HTML搭建的是頁面結構,CSS是編寫頁面的樣式,而JS是完成人機交互效果比如基本的人機交互效果/頁面中具體效果的實現/頁面中動態數據的獲取和綁定/可能會操作瀏覽器的一些功能...等等,所以說我們的JS是用來操作DOM和操作瀏覽器的
JS組成的三大部分
ECMAScript(ES3 / ES6~9):? 定義了JS的語法規范:定義了語言本身的變量、數據值、操作語句、內存管理...等內容
DOM(document object model):? 文檔對象模型:提供對應的屬性和方法,可以讓JS操作頁面中的DOM元素
BOM(browser object model):? 瀏覽器對象模型:提供操作瀏覽器的屬性和方法
注意:當代項目開發,一般都是基于Vue/React完成的,基于這兩個框架,我們已經不去操作DOM了,我們操作數據
JS中的變量 variable
> 變量:可變的量(其存儲的值是可變的),設置一個變量(起個名字),讓其代表和指向某一個具體的值
JS中創建變量的幾種方式
- ES3:var
- ES6:let 、const
- function 創建函數
- class 創建一個類
- import / require 基于ES6Module或者Common.js規范導入模塊
1.基于var創建
var n = 10;
var m;
console.log(n, m);? ? ?=> 10 undefined
2.基于ES6中的LET創建
let a = 100;
a = 200;
console.log(a);? ?=> 200
3.基于ES6中的CONST創建(基于CONST定義的變量一般也被成為常量);
const b = 1000;
console.log(b);? ? => Uncaught TypeError: Assignment to constant variable.
4.創建一個函數
function func() {}
console.log(func);
5.創建一個類
class Parent {}
console.log(Parent);
6.基于模塊規范來導入具體的某個模塊
import axios from './axios';
let axios = require('./axios');
命名規范:嚴格區分大小寫!!
編寫代碼的時候一定要區分大小寫問題
let Test = 100;
console.log(test); //=>Uncaught ReferenceError: test is not defined
使用駝峰命名法
由有意義英文組成一個名字,第一個單詞首字母小寫,其余每一個有意義的單詞首字母大寫
例如:let studentInfo = {};
項目中常見的有特殊含義的端詞組
add / insert / create? 新增/插入/創建
del / delete / remove? 刪除/移除
update 修改
select / query / get? 查詢/獲取
info 信息
命名規則:使用 “$、_、英文字母、數字” 命名,數字不能作為開頭
想要分隔單詞,可以使用_或者駝峰,但是不能是-
中文命名雖然不報錯,但是強烈不建議!
不能使用關鍵字和保留字
關鍵字:在JS中有特殊含義的
保留字:未來可能會成為關鍵字的
一些知識點補充:
基于$開頭:一般代表使用JQ或者其它使用$的類庫獲取的內容
基于_開頭:一般代表是全局或者公共的變量
基于數字區分相似名稱的變量
JS中的數據類型
1.基本數據類型(值類型 / 原始值)
數字 number????????字符串 string????????布爾 boolean???????
空對象指針 null????????未定義 undefined????????ES6新增的唯一值類型 symbol
2.引用數據類型
①對象數據類型 object
普通對象 {}????????普通對象 {}????????正則對象 /^$/????????日期對象 new Date????????數學函數對象 Math? ? ...等等
②函數數據類型 function
“學而時習之,不亦說乎”出自于孔子的《論語》
譯文:孔子說:“學到知識后按時溫習并實踐練習,不是一件令人心生喜悅的事嗎?”
做到勤復習,多實踐,溫故而知新,相信每個人都是潛力股,只要肯努力就一定可以成功.