js基礎知識入門總結

2022-04-07 02:37:38 字數 4425 閱讀 1571

1、第乙個js程式

乙個專案包括三部分:前端(html、css、js)、資料庫、後端技術

引入方式:頁面中直接寫,script標籤引入

js事件繫結:

<

input

type

="button"

value

="按鈕"

onclick

="myclick()"

/>

<

input

type

="button"

value

="按鈕"

id="btn"

/>

function

myclick()

document.getelementbyid('btn').onclick=function

(ev)

2、js變數宣告規則

var inum1 = 10;

var sstring = "abceelf";

var bflag = true

;var anum = [1,2,3,4,5];

var oobject = ;

var fnumber = 10.3;

變數命名規範:

1)變數的第乙個字元必須是字母、下劃線_、或$

2)其餘的字元必須是 下劃線_ 、字母、數字、或$

3)不能用js的關鍵字

4)駝峰命名法

3、變數轉換

var  inum1 = 10;

var sstring = "baude";

//+ 作拼接作用,使數字轉換成字串瀏覽器自動轉換的,取tostring()方法

inum1 +sstring

//而 -號、*號、/號只能作運算,即將所有資料轉換為數字,取number()方法,如果不能轉換則為nan

var bflag = true;//

布林值轉換為數字1或0

inum1 +bflag

//把資料轉換成數字

var sstring2 =「20djaog」;

number(sstring2)

//將數字的字串轉換為數字

parseint(sstring2)//

將不能轉換為止

parsefloat("10.2ajofg")//

可以轉換浮動型

4、js字串操作

var  sstring = "hello world";

sstring.length

//獲取字串長度

sstring.charat(2) //

獲取字串指定索引的字元

sstring.substring(start,end) //

擷取字串從start位置到end位置,如果end預設則到結尾

sstring.substr(start,length) //

擷取字串從start位置擷取length個字元

sstring.indexof('a',start) //

返回字串中指定的字元a第一次出現的位置,若無則返回-1;若第二個引數有,則從第二個引數start的位置開始

sstring.lastindexof('a',start) //

從右邊到左邊查詢

5、js陣列

//

陣列宣告

var ateam = new array(4);

ateam[0] = "dkop";

......

var ateam = ["dd","es","ag"];

//陣列方法

ateam.tostring(); //

預設通過逗號隔開

ateam.join("_").tostring(); //

指定通過 _ 隔開

ateam.reverse().tostring() //

反序處理

//字串處理為陣列

var sstring = "deig_taig_kie_lieng";

sstring.split("_") //

通過指定字元進行分割,返回乙個陣列

6、條件判斷

運算:除/ 、取餘%

條件語句

if

(條件1)else

if(條件2)else

//if語句也可以使用三元運算子等價代替

if(a>b)

else

等價於 c = a>b ? a:b;

7、等於號的區別=、==、===

//

=是賦值

//==是不判斷型別,會自動轉換為相同的型別再進行判斷

//===會先判斷型別是否相同

var inum = 10;

var snum = 『10』;

if(inum ==snum)

if(inum ===snum)

//邏輯運算子 &&、 ||、 !

8、迴圈結構

//

while迴圈

var i = 0;

var isum = 0;

while(i<101)

alert(isum);

//do...while迴圈

//

for迴圈

var isum = 0;

for(var i=0;i<101;i++)

9、for迴圈的巢狀

//

9*9乘法表,首先最重要的就是確定各個迴圈變數的範圍

//var i (1~9) var jvar shtml = "";

for(var i = 1;i<=9;i++)

}shtml+="";

document.writeln(shtml);

//以下是反向寫入頁面中

var shtml = "";

for(var i = 9;i>=1;i--)

}shtml+="";

document.writeln(shtml);

//

氣泡排序:前面的元素依次和後面的元素進行比較

var anumber = [10,2,34,4,56,12,45,44,6,12,23,55];

var inum = 0;

for(var i = 0;i<=anumber.length-2;i++)}}

alert(anumber);

//以下是降序

var anumber = [10,2,34,4,56,12,45,44,6,12,23,55];

var inum = 0;

for(var i = 0;i<=anumber.length-2;i++)}}

alert(anumber);

10、switch語句

switch

(num)

11、break、continue和return

function

myclick()

isum +=i;

}alert(isum);

}

12、math物件

math.pi;

math.max(10,32,40);

math.min(10,32,40);

math.round(12.59);//

四捨五入

math.ceil(12.1);//

向上取整

math.floor(12.9);//

向下取整

math.random();//

獲取0~1的隨機數,不包括0和1

math.floor(math.random()*100+1) //

獲取1~100之前的整數

13、date物件

var mydata = new

date();

mydata.getfullyear();

mydata.getmonth()+1;//

月是從0開始的,所以要加1

mydata.getday();

mydata.gethours();

mydata.getminutes();

mydata.getseconds();

14、setinterval和settimeout

function

myclick()

console.log(i);

},1000);

//只執行一次

settimeout(function

() ,1000);

}

js基礎知識總結

作為梳理的目錄 移動端開發相關 框架和工具相關 vue資料繫結原理 vue父子元件和兄弟元件的通訊問題 vuex的原理 vuex的action和mutation的非同步操作和同步操作問題 vue的事件監聽 vue router獲取自定義引數 vue router的go相關 vue元件設計相關 模組化...

js基礎知識總結(一)

ecmascript es 負責翻譯,為js的核心,直譯器。dom document object model 文件物件模型 賦予js操作html的能力,document。bom browser object modal 瀏覽器物件模型 賦予js操作瀏覽器的能力,window,不相容不建議使用。5種...

js基礎知識總結(全)

1.js版helloworld 2.注釋 單行 多行 3.操作符 數值一樣 型別和數值都一樣 4.邏輯運算子 5.定義變數 弱型別 var num 1 var string 我是中國人 var myboolean true 6.方法 用function定義 7.流程控制語句 if else whil...