一JavaScript概述和發(fā)展史
a)Netscape在其Netscape?Navigator?2.0產(chǎn)品中開(kāi)發(fā)出一套livescript的腳本語(yǔ)言。后來(lái)在與Sun合作之后將其改名為JavaScript。JavaScript最初受Java啟發(fā)而開(kāi)始設(shè)計(jì)的,因此語(yǔ)法上有類似之處,一些名稱和命名規(guī)范也借自Java,但是JavaScript與Java是完全不同的兩種語(yǔ)言。
b)微軟隨后模仿在其IE3.0的產(chǎn)品中搭載了一個(gè)JavaScript的克隆版叫JScript。
c)為了統(tǒng)一標(biāo)準(zhǔn),ECMA(歐洲計(jì)算機(jī)制造協(xié)會(huì))定義了ECMA-262規(guī)范,國(guó)際標(biāo)準(zhǔn)化組織及國(guó)際電工委員會(huì)(ISO/IEC)也采納ECMAScript作為標(biāo)準(zhǔn)(ISO/IEC-16262)。從此,Web瀏覽器就開(kāi)始努力(雖然有著不同的程度的成功和失?。CMAScript作為JavaScript實(shí)現(xiàn)的規(guī)范和標(biāo)準(zhǔn)。
JavaScript是一種基于對(duì)象和事件驅(qū)動(dòng)的腳本語(yǔ)言,由瀏覽器解釋、執(zhí)行。一個(gè)完整的?JavaScript?是由以下?3?個(gè)不同部分組成的:
·核心(ECMAScript)
·文檔對(duì)象模型(DOM)?Document?object?model(整合js和html和css)
·瀏覽器對(duì)象模型(BOM)?Broswer?object?model(整合js和瀏覽器)
二、ECMAScript
ECMAScript是JavaScript的核心,描述和規(guī)定了以下內(nèi)容:
·語(yǔ)法
·類型
·語(yǔ)句
·關(guān)鍵字
·保留字
·運(yùn)算符
·對(duì)象
2.1腳本的基本結(jié)構(gòu)
lJS代碼必須寫(xiě)在中
l一個(gè)頁(yè)面可以包含多個(gè)塊
l可以放在網(wǎng)頁(yè)的任何位置
//JavaScript代碼;
document.write(“hello,JavaScript
”);
document.write(“hello,world”);
也可以把JS代碼放到外部的.js文件中,例如:
2.2ECMAScript語(yǔ)法
2.2.1聲明變量
1.JS是弱類型的動(dòng)態(tài)定義語(yǔ)言
l靜態(tài)類型定義語(yǔ)言
一種在編譯時(shí),數(shù)據(jù)類型是固定的語(yǔ)言。大多數(shù)靜態(tài)類型定義語(yǔ)言強(qiáng)制這一點(diǎn),它要求你在使用所有變量之前要聲明它們的數(shù)據(jù)類型。Java和C是靜態(tài)類型定義語(yǔ)言。
l動(dòng)態(tài)類型定義語(yǔ)言
一種在執(zhí)行期間才去發(fā)現(xiàn)數(shù)據(jù)類型的語(yǔ)言,與靜態(tài)類型定義相反,它們是在第一次給一個(gè)變量賦值的時(shí)候才找出變量的類型。
l強(qiáng)類型定義語(yǔ)言
一種總是強(qiáng)制進(jìn)行類型定義的語(yǔ)言。
l弱類型定義語(yǔ)言
一種類型可以被忽略的語(yǔ)言,與強(qiáng)類型定義相反。
2.每行的分號(hào)可有可無(wú),建議寫(xiě)上
3.JS代碼注釋與java相同
4.變量聲明不是必須的
ECMAScript的解釋程序遇到未聲明過(guò)的標(biāo)識(shí)符時(shí),用該變量名創(chuàng)建一個(gè)全局變量,并將其初始化為指定的值。
這是該語(yǔ)言的便利之處,不過(guò)這樣做也容易出問(wèn)題。最好的習(xí)慣是像使用其他程序設(shè)計(jì)語(yǔ)言一樣,總是聲明所有變量。
2.2.2原始值和引用值
在ECMAScript中,變量可以存兩種類型的值,即原始值和引用值。
l原始值(相當(dāng)于Java中的基本數(shù)據(jù)類型)
存儲(chǔ)在棧(stack)中的簡(jiǎn)單數(shù)據(jù)段,也就是說(shuō),它們的值直接存儲(chǔ)在變量訪問(wèn)的位置。
l引用值(相當(dāng)于Java中的引用數(shù)據(jù)類型)
存儲(chǔ)在堆(heap)中的對(duì)象,也就是說(shuō),存儲(chǔ)在變量處的值是一個(gè)指針(point),指向存儲(chǔ)對(duì)象的內(nèi)存處。
2.2.3原始值的數(shù)據(jù)類型
五種原始值的數(shù)據(jù)類型如下:
lundefined
lnull
lboolean
lnumber
lstring
1.Undefined類型
Undefined類型只有一個(gè)值,即undefined。當(dāng)聲明的變量未初始化時(shí),該變量的默認(rèn)值是undefined。當(dāng)函數(shù)無(wú)明確返回值時(shí),返回的也是值"undefined";
var?d;
document.write(d);
2.Null類型
另一種只有一個(gè)值的類型是Null,它只有一個(gè)專用值null,即它的字面量。值undefined實(shí)際上是從值null派生來(lái)的,因此ECMAScript把它們定義為相等的。
盡管這兩個(gè)值相等,但它們的含義不同。undefined是聲明了變量但未對(duì)其初始化時(shí)賦予該變量的值,null則用于表示尚未存在的對(duì)象。如果函數(shù)或方法要返回的是對(duì)象,那么找不到該對(duì)象時(shí),返回的通常是null。
3.Boolean類型
Boolean類型是ECMAScript中最常用的類型之一。它有兩個(gè)值true和false(即兩個(gè)Boolean字面量)。
var?bool=true;
4.Number類型
ECMA-262中定義的最特殊的類型是Number類型。這種類型既可以表示32位的整數(shù),還可以表示64位的浮點(diǎn)數(shù)。
l定義十進(jìn)制整數(shù)var?iNum?=?86;
l定義八進(jìn)制var?iNum?=?070;(了解)
l定義十六進(jìn)制var?iNum?=?0xAB;(了解)
l定義浮點(diǎn)數(shù)var?fNum?=?5.0;
5.string類型
JS不區(qū)分字符和字符串,用單引號(hào)或雙引號(hào)均可
var?s1=”hello”;var?s2=’world’;
注意:JS是弱類型定義語(yǔ)言,聲明變量時(shí)不需要指定這些數(shù)據(jù)類型
三ECMAScript運(yùn)算符
3.1typeof運(yùn)算符
ECMAScript提供了typeof運(yùn)算符來(lái)判斷一個(gè)值是哪種原始值類型。對(duì)變量或值調(diào)用typeof運(yùn)算符將返回下列值之一:
lundefined?-如果變量是Undefined類型的
lboolean?-如果變量是Boolean類型的
lnumber?-如果變量是Number類型的
lstring?-如果變量是String類型的
lobject?-如果變量是一種引用類型或Null類型的
document.write(typeof(true));
document.write(typeof(100));
3.2算術(shù)運(yùn)算符
+????-???*????/????%???++???--?????跟Java中一樣
3.3賦值運(yùn)算符
·乘法/賦值(*=)
·除法/賦值(/=)
·取模/賦值(%=)
·加法/賦值(+=)
·減法/賦值(-=)
var?iNum?=?10;
iNum?=?iNum?+?10;?//等同于iNum?+=?10;
3.4關(guān)系(比較)運(yùn)算符
3.5等性運(yùn)算符(相等判斷)
l執(zhí)行類型轉(zhuǎn)換的規(guī)則如下:
·如果一個(gè)運(yùn)算數(shù)是?Boolean?值,在檢查相等性之前,把它轉(zhuǎn)換成數(shù)字值。false?轉(zhuǎn)換成?0,true?為?1。
·如果一個(gè)運(yùn)算數(shù)是字符串,另一個(gè)是數(shù)字,在檢查相等性之前,要嘗試把字符串轉(zhuǎn)換成數(shù)字。
·如果一個(gè)運(yùn)算數(shù)是對(duì)象,另一個(gè)是字符串,在檢查相等性之前,要嘗試把對(duì)象轉(zhuǎn)換成字符串。
·如果一個(gè)運(yùn)算數(shù)是對(duì)象,另一個(gè)是數(shù)字,在檢查相等性之前,要嘗試把對(duì)象轉(zhuǎn)換成數(shù)字。
l在比較時(shí),該運(yùn)算符還遵守下列規(guī)則:
·值?null?和?undefined?相等。
·在檢查相等性時(shí),不能把?null?和?undefined?轉(zhuǎn)換成其他值。
·如果兩個(gè)運(yùn)算數(shù)都是對(duì)象,那么比較的是它們的引用值。
·如果兩個(gè)運(yùn)算數(shù)指向同一對(duì)象,那么等號(hào)返回?true,否則兩個(gè)運(yùn)算數(shù)不等。
表達(dá)式
結(jié)果
null==undefined
true
false==0
true
true==1
true
true==2
false
“5”==5
true
var?s1=new?String("hello");
var?s2=new?String("hello");
s1==s2;
var?s3=s1;
s1==s3;false
true
l全等號(hào)和非全等號(hào)
==是非全等,運(yùn)算前會(huì)自動(dòng)進(jìn)行類型轉(zhuǎn)換
===是全等,運(yùn)算前不會(huì)自動(dòng)進(jìn)行類型轉(zhuǎn)換
document.write("5"==5);
document.write("5"===5);
3.6邏輯運(yùn)算符
給定x=6以及y=3,下表解釋了邏輯運(yùn)算符:
注意:JS中沒(méi)有單與和單或
3.7條件運(yùn)算符(三元運(yùn)算符)(跟java中一模一樣)
var?num=(5>3)?1:2;
document.write(num);
四ECMAScript語(yǔ)句(流程控制)
單重if
if-else
多重if
for????水平線金字塔
for/in
while
do-while
雙重循環(huán)(表格乘法口訣表)
跟Java一樣
五ECMAScript對(duì)象
從傳統(tǒng)意義上來(lái)說(shuō),ECMAScript并不真正具有類。ECMAScript定義了“對(duì)象的定義”,邏輯上等價(jià)于其他程序設(shè)計(jì)語(yǔ)言中的類,這就是“基于對(duì)象”。
5.1String對(duì)象
String?對(duì)象是?String?原始類型的對(duì)象表示法,它可以使用以下方式創(chuàng)建的:
vars=?new?String("hello?world");
var?s=“hello”;
5.2Global對(duì)象
全局對(duì)象是預(yù)定義的對(duì)象,作為?JavaScript?的全局函數(shù)和全局屬性的占位符。通過(guò)使用全局對(duì)象,可以訪問(wèn)所有其他所有預(yù)定義的對(duì)象、函數(shù)和屬性。全局對(duì)象不是任何對(duì)象的屬性或方法,所以可以直接調(diào)用。
方法
5.3Math對(duì)象
5.4Number對(duì)象
正如你可能想到的,Number?對(duì)象是?Number?原始類型的引用類型。要?jiǎng)?chuàng)建?Number?對(duì)象,采用下列代碼:
var?oNumberObject?=?new?Number(68);
var??num=68;
要得到數(shù)字對(duì)象的?Number?原始值,只需要使用?valueOf()?方法:
var?iNumber?=?oNumberObject.valueOf();
5.5Array對(duì)象
Array?對(duì)象用于在單個(gè)的變量中存儲(chǔ)多個(gè)值。
語(yǔ)法:
new?Array();
new?Array(size);沒(méi)有默認(rèn)初始值
new?Array(element0,element1,?...,elementn)
屬性:
方法:
lfor/in
5.6Date對(duì)象
Date對(duì)象用于處理日期和時(shí)間。
語(yǔ)法:
var?myDate=new?Date();???//獲取當(dāng)前時(shí)間
方法:
1.getFullYear()獲取年份
2.getMonth()獲取月份注意1月份結(jié)果為0
3.getHours()小時(shí)
4.getDate()日期
5.getMinutes()分鐘
6.getSeconds()獲取秒
7.getTime()獲取毫秒值
8.toLocaleString()獲取本地的時(shí)間格式字符串
5.7ECMAScript類型轉(zhuǎn)換
轉(zhuǎn)換成字符串
1.+
var?n=100;
document.write(typeof(n)+"
");
n=n+"";
document.write(typeof(n));
2.ECMAScript的布爾值、數(shù)字和字符串的原始值的有趣之處在于它們是偽對(duì)象,這意味著它們實(shí)際上具有屬性和方法。例如:數(shù)字和字符串都有toString()方法
var?n=100;
document.write(typeof(n)+"
");
var?m=n.toString();
document.write(typeof(m));
轉(zhuǎn)換成數(shù)字(Global對(duì)象)
nECMAScript提供了兩種把非數(shù)字的原始值轉(zhuǎn)換成數(shù)字的方法,即parseInt()和parseFloat()。
nparseInt()方法首先查看位置0處的字符,判斷它是否是個(gè)有效數(shù)字;如果不是,該方法將返回NaN,不再繼續(xù)執(zhí)行其他操作。
a)var?iNum1?=?parseInt("12345red");//返回?12345
b)var?iNum1?=?parseInt("0xA");//返回?10
c)var?iNum1?=?parseInt("56.9");//返回?56
d)var?iNum1?=?parseInt("red");//返回?NaN
lparseFloat()方法
a)var?fNum1?=?parseFloat("12345red");//返回?12345
b)var?fNum2?=?parseFloat("0xA");//返回?NaN
c)var?fNum3?=?parseFloat("11.2");//返回?11.2
d)var?fNum4?=?parseFloat("11.22.33");//返回?11.22
e)var?fNum5?=?parseFloat("0102");//返回?102
f)var?fNum1?=?parseFloat("red");//返回?NaN
ECMAScript的強(qiáng)轉(zhuǎn)
ECMAScript?中可用的三種強(qiáng)制類型轉(zhuǎn)換如下:
·Boolean(value)?-?把給定的值轉(zhuǎn)換成?Boolean?型
·Number(value)?-?把給定的值轉(zhuǎn)換成數(shù)字(可以是整數(shù)或浮點(diǎn)數(shù))
·String(value)?-?把給定的值轉(zhuǎn)換成字符串
lBoolean()
a)var?b1?=?Boolean("");//false?-?空字符串
b)var?b2?=?Boolean("hello");//true?-?非空字符串
c)var?b1?=?Boolean(50);//true?-?非零數(shù)字
d)var?b1?=?Boolean(null);//false?-?null
e)var?b1?=?Boolean(0);//false?-?零
f)var?b1?=?Boolean(new?object());//true?-?對(duì)象
lNumber()
Number()?函數(shù)的強(qiáng)制類型轉(zhuǎn)換與?parseInt()?和?parseFloat()?方法的處理方式相似,只是它轉(zhuǎn)換的是整個(gè)值,而不是部分值。
lString()
強(qiáng)制轉(zhuǎn)換成字符串和調(diào)用?toString()?方法的唯一不同之處在于,對(duì)?null?和?undefined?值強(qiáng)制類型轉(zhuǎn)換可以生成字符串而不引發(fā)錯(cuò)誤:
var?s1?=?String(null);//"null"
var?oNull?=?null;
var?s2?=?oNull.toString();//會(huì)引發(fā)錯(cuò)誤
5.8RegExp對(duì)象
RegExp?對(duì)象用來(lái)表示和存儲(chǔ)一個(gè)正則表達(dá)式,它是對(duì)字符串執(zhí)行格式匹配的對(duì)象。
l語(yǔ)法:
var??re=new?RegExp(“正則表達(dá)式”);????雙斜杠
var??re=/正則表達(dá)式/;????更方便????????不用雙斜杠
l常用符號(hào):查閱幫助文檔
lRegExp對(duì)象的方法
var?reg=/\d+/;
document.write(reg.exec("p2lus1"));
var?reg=/\d+/;
document.write(reg.test("plus"));
l支持正則表達(dá)式的String對(duì)象的方法:
var?str="1?plus?2?equal?3";
document.write(str.match(/\d+/));
document.write(str.match(/\d+/g));
------------------Day03------------------------------------------------------------------------------------------------
5.9Function對(duì)象
Function類可以表示開(kāi)發(fā)者定義的任何函數(shù)。
用Function類直接創(chuàng)建函數(shù)的語(yǔ)法如下:
var?function_name?=?new?function(arg1,arg2,?...,argN,function_body)
function?sayHi(sName,?sMessage)?{
alert("Hello?"?+?sName?+?sMessage);
}
還可以這樣定義它:
var?sayHi
=
new?Function("sName",?"sMessage",?"alert(\"Hello?\"?+?sName?+?sMessage);");
雖然由于字符串的關(guān)系,這種形式寫(xiě)起來(lái)有些困難,但有助于理解函數(shù)只不過(guò)是一種引用類型,它們的行為與用Function類明確創(chuàng)建的函數(shù)行為是相同的。
Function對(duì)象的length屬性
如前所述,函數(shù)屬于引用類型,所以它們也有屬性和方法。
ECMAScript定義的屬性length聲明了函數(shù)期望的參數(shù)個(gè)數(shù)。
Function對(duì)象的方法
Function對(duì)象也有與所有對(duì)象共享的valueOf()方法和toString()方法。這兩個(gè)方法返回的都是函數(shù)的源代碼,在調(diào)試時(shí)尤其有用。
六?事件
事件是可以被控件識(shí)別的操作,如按下確定按鈕,選擇某個(gè)單選按鈕或者復(fù)選框。每一種控件有自己可以識(shí)別的事件,如窗體的加載、單擊、雙擊等事件,編輯框(文本框)的文本改變事件,等等。
Js中的事件列表:
Event對(duì)象
Event?對(duì)象代表事件的狀態(tài),比如事件在其中發(fā)生的元素、鍵盤(pán)按鍵的狀態(tài)、鼠標(biāo)的位置、鼠標(biāo)按鈕的狀態(tài)。
事件通常與函數(shù)結(jié)合使用,函數(shù)不會(huì)在事件發(fā)生前被執(zhí)行!
七JSON
JSON(JavaScript?Object?Notation)js對(duì)象表示法。是一種輕量級(jí)的數(shù)據(jù)交換格式。JSON采用完全獨(dú)立于語(yǔ)言的文本格式,成為理想的數(shù)據(jù)交換語(yǔ)言。?易于人閱讀和編寫(xiě),同時(shí)也易于機(jī)器解析和生成(網(wǎng)絡(luò)傳輸速度)。
JSON?語(yǔ)法
JSON語(yǔ)法是JavaScript對(duì)象表示語(yǔ)法的子集。
·數(shù)據(jù)在名稱/值對(duì)中
·數(shù)據(jù)由逗號(hào)分隔
·花括號(hào)保存對(duì)象
·方括號(hào)保存數(shù)組
JSON數(shù)據(jù)的書(shū)寫(xiě)格式是:名稱/值對(duì)。
名稱/值對(duì)組合中的名稱寫(xiě)在前面(在雙引號(hào)中),值對(duì)寫(xiě)在后面(同樣在雙引號(hào)中),中間用冒號(hào)隔開(kāi):
"firstName":"John"
這很容易理解,等價(jià)于這條JavaScript語(yǔ)句:
firstName="John"
JSON值可以是:
·數(shù)字(整數(shù)或浮點(diǎn)數(shù))
·字符串(在雙引號(hào)中)
·邏輯值(true或false)
·數(shù)組(在方括號(hào)中)
·對(duì)象(在花括號(hào)中)
·null
JSON結(jié)構(gòu)有兩種結(jié)構(gòu)
json簡(jiǎn)單說(shuō)就是javascript中的對(duì)象和數(shù)組,所以這兩種結(jié)構(gòu)就是對(duì)象和數(shù)組兩種結(jié)構(gòu),通過(guò)這兩種結(jié)構(gòu)可以表示各種復(fù)雜的結(jié)構(gòu)
1、對(duì)象:對(duì)象在js中表示為“{}”括起來(lái)的內(nèi)容,數(shù)據(jù)結(jié)構(gòu)為{key:value,key:value,...}的鍵值對(duì)的結(jié)構(gòu),在面向?qū)ο蟮恼Z(yǔ)言中,key為對(duì)象的屬性,value為對(duì)應(yīng)的屬性值,所以很容易理解,取值方法為?對(duì)象.key獲取屬性值,這個(gè)屬性值的類型可以是?數(shù)字、字符串、數(shù)組、對(duì)象幾種。
2、數(shù)組:數(shù)組在js中是中括號(hào)“[]”括起來(lái)的內(nèi)容,數(shù)據(jù)結(jié)構(gòu)為[“java”,"javascript","vb",...],取值方式和所有語(yǔ)言中一樣,使用索引獲取,字段值的類型可以是?數(shù)字、字符串、數(shù)組、對(duì)象幾種。
經(jīng)過(guò)對(duì)象、數(shù)組兩種結(jié)構(gòu)就可以組合成復(fù)雜的數(shù)據(jù)結(jié)構(gòu)了。
如:
示例1:
var?persons?={
"persons":[
{"name":"zs","age":23,"gender":"male"},
{"name":"ls","age":24,"gender":"female"},
{"name":"ww","age":25,"gender":"male"}
]
}
一個(gè)名為people的變量,值是包含三個(gè)條目的數(shù)組,每個(gè)條目是一個(gè)人的記錄。也可以定義為:
示例2:
var?persons?=[
{"name":"zs","age":23,"gender":"male"},
{"name":"ls","age":24,"gender":"female"},
{"name":"ww","age":25,"gender":"male"}
]
一個(gè)數(shù)組,包含三個(gè)條目,每一個(gè)條目都是一個(gè)人的記錄信息
JSON訪問(wèn)數(shù)據(jù)
定義一個(gè)json對(duì)象var?person?={"name":"zs","age":23,"gender":"male"}
可以使用點(diǎn)(.)輕松訪問(wèn)其中數(shù)據(jù)。
person.name;//zs
person.age;//23
person.gender;//male
或者:
Person[“name”];//zs
person[“age”];//23
person[“gender”];//male
當(dāng)然,可以訪問(wèn)復(fù)雜數(shù)據(jù).
如訪問(wèn)示例1中的數(shù)據(jù):
persons.persons[0].name;//zs
persons.persons[0].age;//23
persons.persons[0].gender;//male
persons.persons會(huì)獲取json中定義的名為persons的值,其值為數(shù)組。然后使用角標(biāo)0訪問(wèn)第1個(gè)元素,得到第一個(gè)json對(duì)象,再根據(jù)其屬性訪問(wèn)器屬性對(duì)應(yīng)的值。
如訪問(wèn)示例2中的數(shù)據(jù):
persons[0].name;//zs
persons[0].age;//23
persons[0].gender;//male
遍歷JSON數(shù)據(jù)(了解)
可以使用for…in循環(huán)遍歷json數(shù)據(jù)。如:
var?person?={"name":"zs","age":23,"gender":"male"};
可以使用for?in自動(dòng)遍歷,得到所有鍵和值
for(key?in?person){
var?value?=?person[key];
alert(key?+?":"?+?value);
}
其中key變量可獲得每一個(gè)鍵值對(duì)的鍵,然后通過(guò)鍵獲取值。