前端JS知識點總結基礎篇(一)

在浩瀚的人生中,興趣是人們通往成功的踏腳石,興趣是人們前進路上的路標。所以,興趣是我們最好的老師。

大家好,歡迎大家看我的第一篇文章,我是一名剛開始學習前端的小白:李海洋。

在這里我會分享一些日常學習的總結供大家一起學習,之后也會一直更新。


首先,我們需要搞清楚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



“學而時習之,不亦說乎”出自于孔子的《論語》

譯文:孔子說:“學到知識后按時溫習并實踐練習,不是一件令人心生喜悅的事嗎?”

做到勤復習,多實踐,溫故而知新,相信每個人都是潛力股,只要肯努力就一定可以成功.

?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 33、JS中的本地存儲 把一些信息存儲在當前瀏覽器指定域下的某一個地方(存儲到物理硬盤中)1、不能跨瀏覽器傳輸:在...
    萌妹撒閱讀 2,098評論 0 2
  • 1、新的聲明方式 以前我們在聲明時只有一種方法,就是使用var來進行聲明,ES6對聲明的進行了擴展,現在可以有三種...
    令武閱讀 1,031評論 0 7
  • 歡迎大家來看我的文章,這里都是一些關于js的知識,我會將我每天學習的內容進行總結,供大家參考,知識是累積出來的大家...
    小晨的世界閱讀 482評論 0 7
  • 一、你不知道的JavaScript 1、作用域 作用域 LHS RHS RHS查詢與簡單地查找某個變量的值別無二...
    頂兒響叮當閱讀 351評論 0 0
  • es6總結 往期文章 ES5總結 1.es6簡介 回顧javascrip組成:核心(ECMAScript)由ECM...
    理想三旬7閱讀 602評論 0 5