當前位置 博文首頁 > 信息技術智庫:?JavaScript系列6部曲:語法篇(萬字長文)?

    信息技術智庫:?JavaScript系列6部曲:語法篇(萬字長文)?

    作者:[db:作者] 時間:2021-09-13 19:02

    🎈 作者:不吃西紅柿

    🎈 簡介:CSDN博客專家🏆、藍橋簽約作者、Python領域優質創作者、信息技術智庫公眾號創建者?。技術交流、面試刷題盡管關注咨詢我。

    熱門專欄推薦:

    🥇?知識集錦專欄:大數據生態硬核學習資料 & 面試真題集錦?
    🥈?數據倉庫專欄:數倉發展史、建設方法論、實戰經驗、面試真題?
    🥉?Python專欄:Python相關黑科技:爬蟲、算法、小工具?

    (優質好文持續更新中……)?

    創作不易,點贊👍 關注💪 鼓勵「不吃西紅柿」吧~

    CSDN私信回復「資料」驚喜等你!!


    目錄

    01 JavaScript (簡稱:js)

    02 操作符

    03?JS變量

    04?JS變量作用

    05?JS變量的交換

    06?注釋

    07?JS的數據類型

    08?JS的數字類型

    09?進制

    10 NaN

    11?類型轉換

    12?JS基本的代碼規范


    01 JavaScript (簡稱:js)

    js分三個部分:

    • ECMAScript?標準----js的基本的語法

    • DOM------Document Object Model 文檔對象模型

    • BOM------Browser Object Model 瀏覽器對象模

    JavaScript是什么?

    • 是一門腳本語言(不需要編譯,直接執行,常見的腳本語言:t-sql,cmd)

    • 是一門解釋性語言

    • 是一門動態類型的語言

    • 是一門基于對象的語言

    ?

    注意:

    1.編譯語言是需要把代碼翻譯成計算機所認知的二進制語言,才能夠執行

    2.前端基礎是HTML(標記語言,展示數據的)、CSS(美化頁面)、

    JavaScript(用戶和瀏覽器交互)這三大塊。

    js原名不是JavaScript,而是LiveScript

    js的作用?解決用戶和瀏覽器之間的交互的問題

    js的代碼可以分三個地方寫:

    1.在html的文件中,script的標簽中寫js代碼

    2.js代碼可以在html的標簽中寫

    <script> //js代碼????alert("好好學習,天天向上"); //在頁面中彈出對話框?? </script> <input?type="button"?value="按鈕"?onclick="alert('被點了');"/> 

    3.在js文件中可以寫js代碼,但是需要在html的頁面中引入?script的標簽中的src="js的路徑"

    02 操作符

    操作符:一些符號-----用來計算

    • 算數運算符: + - * / %

    • 算數運算表達式:由算數運算符連接起來的表達式

    • 一元運算符: 這個操作符只需要一個操作數就可以運算的符號 ++ –

    • 二元運算符: 這個操作符需要兩個操作數就可以運算,

    • 三元運算符: 條件表達式?表達式1:表達式2

    • 復合運算符: += -= *= /= %=

    • 復合運算表達式:由復合運算符連接起來的表達式

     var num=10;  num+=10;------>就是:num=num+10;  console.log(num);20 

    賦值運算符: =

    關系運算符:?

    • > < >= <=?

    • ==不嚴格的?

    • ===嚴格的?

    • !=不嚴格的不等?

    • !==嚴格的不等

    關系運算表達式:由關系運算符連接起來的表達式

    關系運算表達式的結果是布爾類型

    邏輯運算符:

    • &&—邏輯與–并且

    • ||—邏輯或—或者

    • !—邏輯非—取反–取非

    邏輯運算表達式:由邏輯運算符連接起來的表達式

    • 表達式1&&表達式2

    如果有一個為false,整個的結果就是false

    • 表達式1||表達式2

    如果有一個為true,整個的結果為true

    • !表達式1

    表達式1的結果是true,整個結果為false

    表達式1的結果是false,整個結果為true

    var num1=10; var num2=20; ?console.log(num1==num2&&5>6 )var num=20; console.log(num>10||5<0?)var flag=false; console.log(!flag )var num=10; var sum=(num+10)*5; console.log(sum var result = (4 >= 6 || '人' != '狗' && !(12 * 2 == 144) && true) ;console.log(result);var?num?=?10;?var result2 =( 5 == num / 2 && (2 + 2 * num).toString() === '22') ;console.log(result2);??var num=20; var result=num/3;//num變量與3取余--->10/3的余數 console.log(parseInt(result) var num=20; var result=num%3;//num變量與3取余--->10/3的余數 console.log(result )var num=10; var sum=(num+10)+1 var num = 20;        num %= 5; //    num=num-5; console.log(num?)var str="5"; var num=5;console.log(str===num )console.log(5>10);//false console.log(5>=5);//true console.log(5>3);//true console.log(5==10);//false

    03?JS變量

    變量名的注意問題—變量名的命名:

    1.要遵循駝峰命名法(第一個單詞的首字母是小寫的,后面的所有的單詞的首字母都是大寫的)

    2.變量名要有意義

    3.變量名要規范

    4.不能使用關鍵字(系統自帶的一些單詞,不能使用)

    聲明變量并初始化—變量的初始化----聲明變量賦值

    聲明了一個num的變量存儲了一個數字100

    ?var?num=110;

    輸出這個變量的值

     alert(num);//彈框

    瀏覽器的控制臺在瀏覽器中的開發人員工具中(快捷鍵:F12)的console的選項中

    console.log(num);//把內容輸出在瀏覽器的控制臺中

    聲明多個變量然后一個一個的賦值?

    var num1,num2,num3;//聲明  //依次的賦值num1=10;   num2=20;   num3=30;

    聲明多個變量并且賦值

    var?num1=10,num2=20,num3=30; var num=10;var $break=10;var shuZi=10;

    注意:操作的數據都是在內存中操作

    js中存儲數據使用變量的方式(名字,值—>數據)

    js中聲明變量都用var---->存儲數據,數據應該有對應的數據類型

    js中的字符串類型的值都用雙引號或者單引號

    04?JS變量作用

    ?變量的作用是存儲數據的或者是操作數據

    變量聲明(有var 有變量名字,沒有值)

    變量初始化(有var 有變量名字,有值)

    變量聲明的方式:

    var 變量名字;

    var number;//變量的聲明,此時是沒有賦值的, //一次性聲明多個變量????var?x,y,z,k,j;//都是聲明,沒有賦值 //變量的初始化(變量聲明的同時并且賦值了)//   = 的意義:賦值的含義//存儲一個數字10var number = 10; //存儲一個5var number2 = 5; //存儲一個人的名字var name = "小黑"; //存儲真(true)var flag = true; //存儲一個null--->相當于是空var nll = null; //存儲一個對象????var?obj?=?new?Object();

    05?JS變量的交換

    使用第三方的變量進行交換

    var num1=10; var num2=20; ??// 把num1這個變量的值取出來放在temp變量中var temp=num1; //  把num2這個變量的值取出來放在num1變量中   num1=num2; //  把temp變量的值取出來放在num2變量中   num2=temp;console.log(num1);//20 console.log(num2);//10

    第二種方式交換:一般適用于數字的交換

    var num1 = 10;  var num2 = 20; // 把num1的變量中的值和num2變量中的值,取出來相加,重新賦值給num1這個變量        num1 = num1 + num2;//30 ???//?num1變量的值和num2變量的值取出來,相減的結果重新賦值給num2        num2 = num1 - num2;//10 //   num1變量的值和num2變量的值取出來,相減的結果重新賦值給num1        num1 = num1 - num2;//20console.log(num1, num2);?
    

    注意;變量的名字是不能重名,因為后面的會覆蓋 前面的

    var num1=10; var num1=20; console.log(num1);

    擴展的變量的交換:只需要看代碼,不需要理解(位運算)

    var num1 = 10;  var num2 = 20;  num1 = num1 ^ num2;  num2 = num1 ^ num2;  num1 = num1 ^ num2;  console.log(num1, num2);

    06?注釋

    注釋的方式:

    1.單行注釋 //

    2.多行注釋 /★★/

    //單行注釋:一般用在一行代碼的上面

    /多行注釋:一般是用在函數或者是一段代碼的上面/

    //注釋后的代碼不執行了?//console.log("哈哈,我又變漂亮了"); //console.log("第二行"); //聲明變量并初始化//    var num=10;

    07?JS的數據類型

    值類型(基本類型):

    • 字符串(String)

    • 數字-整數和小數(Number)

    • 布爾(Boolean)

    • 對空(Null)

    • 未定義(Undefined)

    • Symbol

    引用數據類型:

    • 對象(Object)

    • 數組(Array)

    • 函數(Function)。

    var num; console.log(num+10);//NaN-----not an number---->不是一個數字 var num; console.log(num);如何獲取這個變量的數據類型是什么? 使用typeof 來獲取????//typeof?的使用的語法     * 都可以獲取這個變量的數據類型是什么!     * typeof 變量名     * typeof(變量 名)     * var num = 10; var str = "小白"; var flag = true; var nll = null; var undef; var obj = new Object();//是使用typeof 獲取變量的類型console.log(typeof num);//number console.log(typeof str);//string console.log(typeof flag);//boolean console.log(String(nll));//是null console.log(typeof nll);//不是null console.log(typeof undef);//undefined console.log(typeof obj);//object console.log(typeof(num));

    08?JS的數字類型

    ?// 數字類型:整數和小數?var?num?=?12; ?num=20; // 整數  num=98.76; // 小數(其他的語言中,浮點型---單精度,雙精度浮點) ?// 所有的數字都是屬于number類型

    09?進制

    js中可以表示哪些進制呢?

    • var num=10;//十進制

    • var num2=012;//八進制

    • var num3=0x123;//十六進制

    var num=12;//十進制 console.log(num); var num2=012;//八進制 console.log(num2); var num3=0x1a;//十六進制 console.log(num3); var num=0x1f; ???console.log(num);

    注意:

    想要表示十進制:就是正常的數字
    想要表示八進制:以0開頭
    想要表示十六進制:0x開頭

    10 NaN

    不要用NaN驗證是不是NaN?

    var num;  console.log(num+10==NaN); console.log("您好"=="我好");

    如何驗證這個結果是不是NaN,應該使用isNaN()

    var num;//-----變量聲明了,沒有賦值,結果是:undefined  是不是不是一個數字----->不是一個數字嗎?NaN--->不是一個數字 console.log(isNaN(10));

    判斷結果不是一個數字可以使用isNaN(變量名)

    var str="您好"; var num;  var sum=num+10;//NaN console.log(sum); console.log(isNaN(sum));//不是數字為true,是數字結果為false

    注意:不要使用NaN判斷是不是NaN,應該使用isNaN(值或者是變量)

    11?類型轉換

    1.parseInt();//轉整數

    console.log(parseInt("10"));//10 console.log(parseInt("10afrswfdsf"));//10 console.log(parseInt("g10"));//NaN console.log(parseInt("1fds0"));//1 console.log(parseInt("10.98"));//10 console.log(parseInt("10.98fdsfd"));//10

    ?2.parseFloat()//轉小數

    console.log(parseFloat("10"));//10  console.log(parseFloat("10afrswfdsf"));//10  console.log(parseFloat("g10"));//NaN console.log(parseFloat("1fds0"));//1 console.log(parseFloat("10.98"));//10.98 console.log(parseFloat("10.98fdsfd"));//10.98

    3.Number();//轉數字

    console.log(Number("10"));//10  console.log(Number("10afrswfdsf"));//NaN console.log(Number("g10"));//NaN console.log(Number("1fds0"));//NaN console.log(Number("10.98"));//10.98 console.log(Number("10.98fdsfd"));//NaN

    注意:想要轉整數用parseInt(),想要轉小數用parseFloat()

    想要轉數字:Number();要比上面的兩種方式嚴格

    其他類型轉字符串類型

    1 .toString()

    //    var num=10; //    console.log(num.toString());//字符串類型 //    //2  String(); ////    var num1=20; //    console.log(String(num1));

    如果變量有意義調用.toString()使用轉換
    如果變量沒有意義使用String()轉換

    var num2; console.log(num2.toString()); var num3=null; console.log(num3.toString()); ????//這個可以var num2; console.log(String(num2)); var num3=null; console.log(String(num3));?

    其他類型轉布爾類型

    console.log(Boolean(1));//true console.log(Boolean(0));//false console.log(Boolean(11));//true console.log(Boolean(-10));//true console.log(Boolean("哈哈"));//true console.log(Boolean(""));//false console.log(Boolean(null));//false console.log(Boolean(undefined));//false?

    12?JS基本的代碼規范

    js中聲明變量用var

    js中的每一行代碼結束都應該有分號;(寫代碼有分號的習慣)

    js中的大小寫是區分的: var N=10; n

    js中的字符串可以使用單引號,也可以使用雙引號,目前我們暫時使用雙引號

    cs
hallobike的博客:圖像分類中的深度學習網絡匯總 hallobike的博客:一文看懂網絡中間層特征矩陣和卷積層參數 hallobike的博客:python移動文件到新的文件夾并重命名 hallobike的博客:解決OpenCV讀取視頻結束后報錯的問題 貓耳山在天邊:《Linux命令行與shell腳本編程大全》(第三版)讀 英雄哪里出來:??13萬字《C語言動漫對話教程(入門篇)》??(建議收 lyndon:CPU 上下文切換 lyndon:printf()、printk()、消息級別、日志級別 lyndon:gcc 添加 -MD 選項依然不依賴 .h 問題解決 qq1113673178的博客:[學習][筆記] qt5 從入門到入墳:<11>繪制 大番薯:編程術語英漢對照 HashFlag的博客:Python基礎 風信子的貓Redamancy的快樂星球:PRML - Chapter 02 Probability g5703129的博客:java學習筆記總結,持續更新中 晴天的專欄:怎樣規劃你畢業以后的人生 程序員cxuan的個人主頁:這篇 Java 基礎,我吹不動了 小小張自由―>張有博:軟件工程――編碼、測試、維護 小小張自由―>張有博:淺談面向對象方法學 小小張自由―>張有博:UML――概述(事物、關系、圖) 小小張自由―>張有博:UML――用例圖 小小張自由―>張有博:UML――活動圖和狀態圖 小小張自由―>張有博:UML――交互圖(順序圖與協作圖) 小小張自由―>張有博:UML――實現圖(構件圖與部署圖) 小小張自由―>張有博:C#編程基礎――C#與.NET的關系 小小張自由―>張有博:C#編程基礎――數據類型 小小張自由―>張有博:C#編程基礎――常量與變量 小小張自由―>張有博:C#編程基礎――運算符與表達式 小小張自由―>張有博:C#編程基礎――循環語句 小小張自由―>張有博:C#編程基礎――跳轉語句 小小張自由―>張有博:C#編程基礎――類 小小張自由―>張有博:C#編程基礎――方法 小小張自由―>張有博:初始三層架構(超超超詳細) 小小張自由―>張有博:C#連接數據庫之Connection、Command、D 小小張自由―>張有博:System.ArgumentOutOfRangeException: 小小張自由―>張有博:機房重構之單例模式的應用 小小張自由―>張有博:機房重構之備忘錄模式的應用 小小張自由―>張有博:機房重構之職責鏈模式的應用 小小張自由―>張有博:HTML基礎――標簽 小小張自由―>張有博:div+css的入門知識 小小張自由―>張有博:CSS核心內容:標準流、盒子模型、浮動 小小張自由―>張有博:asp.net生成驗證碼并提交驗證 小小張自由―>張有博:XML基礎 小小張自由―>張有博:各種計算機語言簡短簡介 小小張自由―>張有博:2020年10月自考總結 小小張自由―>張有博:vs2019利用gitee(碼云)協作開發 小小張自由―>張有博:1024程序員節 小小張自由―>張有博:IDEA2020.3詳細安裝教程 小小張自由―>張有博:JavaWeb之Request與Response詳解 小小張自由―>張有博:JavaWeb之Filter和Listener 小小張自由―>張有博:Vue插件報錯:Vue.js is detected on t .net平臺的rabbitmq使用封裝demo詳解 C++類的特種函數生成機制詳解 Python調用百度AI實現圖片上表格識別功能 node自定義安裝更改npm全局模塊默認安裝路徑的步驟 帶你用C語言實現strtok和字符串分割函數 靜態網頁和靜態網頁性能比較 網頁標題優化原則和描述優化原則 php 怎么設置cookie記住密碼 php設置時區無效怎么辦 php __autoload 失效怎么辦 有關PHP調試的小技巧,看看吧! 從0開始:教你微信小店怎么開! 成本5元竟然賣50元 微信朋友圈賣面膜真黑啊 HashMap原理及put方法與get方法的調用過程 基于IDEA 的遠程調試 Weblogic的操作過程 UTC時間、GMT時間、本地時間、Unix時間戳的具體使用 如何利用SwiftUI實現可縮放的圖片預覽器 網站怎么利用內容更新雙重境界快速提高網站權重? php顯示繁體亂碼怎么辦 php不能開啟php_curl怎么辦
A级免费视频