JavaScript基本語(yǔ)法01
JavaScript 是一門高端的瞧挤、動(dòng)態(tài)的憨降、弱類型的編程語(yǔ)言,適合面向?qū)ο蠛秃瘮?shù)式的編程風(fēng)格单山。
JavaScript 語(yǔ)法源自 Java碍现,一等函數(shù)(first-class function)來(lái)自于Scheme,基于原型(prototype-based)的繼承來(lái)自于Self米奸。
一昼接、類型、值和變量
1悴晰、數(shù)字
- JavaScript 中不區(qū)分整數(shù)值和浮點(diǎn)數(shù)值慢睡,所有數(shù)字均用浮點(diǎn)數(shù)值表示
- JS采用IEEE754標(biāo)準(zhǔn)定義的64位浮點(diǎn)格式表示數(shù)字,這意味著它能表示的最大值是±1.7976031348623157×10308铡溪,最小值是±5×10-324
- 按照J(rèn)S中的數(shù)字格式漂辐,能夠表示的整數(shù)范圍是-9007199254740992~9007199254740992(即 -253~253)
- 需要注意的是,JS中實(shí)際的操作(比如數(shù)組索引棕硫,位操作符)則是基于32位整數(shù)髓涯。
1.1、數(shù)字展示格式
0
2
100000
3.1415
.333333
9.02e10 //9.02 * 10的10次方
1.4E-8 //1.4 * 10的-8次方
1.2哈扮、JavaScript中的算術(shù)運(yùn)算符
- JavaScript用Math對(duì)象實(shí)現(xiàn)復(fù)雜的運(yùn)算
Math.pow(2,3) //8纬纪;2的3次冪
Math.round(.6) //1.0;四舍五入
Math.ceil(.6) //1.0灶泵;向上取整
Math.floor(.6) //0.0育八;向下取整
Math.abs(-5) //5;求絕對(duì)值
Math.max(x,y,z) //返回最大值
Math.min(x,y,z) //返回最小值
Math.random() //生成一個(gè)大于等于0小于1.0的偽隨機(jī)數(shù)
Math.PI //π赦邻;圓周率
Math.E //e髓棋;自然對(duì)數(shù)的底數(shù)
Math.sqrt(3) //3的平方根
Math.pow(3,1/3) //3的立方根
Math.sin(0) //三角函數(shù)。Math.cos(),Math.tan(),Math.sin(30/180*Math.PI)
Math.log(10) //10的自然對(duì)數(shù)
Math.log(100)/Math.LN10 //以10為底100的對(duì)數(shù)
Math.log(512)/Math.LN2 //以2為底512的對(duì)數(shù)
Math.exp(3) //e的3次冪
1.3惶洲、日期和時(shí)間
- Date()構(gòu)造函數(shù)按声,用于創(chuàng)建表示日期和時(shí)間的對(duì)象
var then=new Date(2017,0,1); //2017年1月1日
var later=new Date(2017,0,1,17,10,30);//2017年1月1日 17:10:30
var now=new Date(); //當(dāng)前日期和時(shí)間
var elapsed=now-then; //日期減法,計(jì)算時(shí)間間隔的毫秒數(shù)
later.getFullYear(); //獲取年份
later.getMonth(); //獲取月份恬吕,從0開(kāi)始計(jì)數(shù)签则,一月份是0
later.getDate(); //獲取日期,從1開(kāi)始計(jì)數(shù)铐料,一號(hào)是1
later.getDay(); //星期幾渐裂,0是星期日,5是星期五
later.getHours(); //獲取小時(shí)
later.getMinutes(); //獲取分鐘
later.getSeconds(); //獲取秒
later.getUTCHours(); //獲取使用UTC表示的小時(shí)的時(shí)間
二钠惩、文本字符串
//字符串
var jsString = "Hello,JavaScript";
//字符串長(zhǎng)度
var s0 = jsString.length; //16,
// 第一個(gè)字符
var s1 = jsString.charAt(0) ; //"H",
// 最后一個(gè)字符
var s2 = jsString.charAt(s0 - 1) //"t",
//第2~4個(gè)字符
var s3 = jsString.substring(1, 4) //"ell",
//第2~4個(gè)字符
var s4 = jsString.slice(1, 4) //"ell"
// 最后三個(gè)字符
var s5 = jsString.slice(-3) //"ipt"
// 字符"a"首次出現(xiàn)的位置
var s6 = jsString.indexOf("a") //7
// 字符"a"最后一次出現(xiàn)的位置
var s7 = jsString.lastIndexOf("a") //9
// 字符"a"第二次出現(xiàn)的位置
var s8 = jsString.indexOf("a", 2) //7
// 字符串分割成數(shù)組
var s9 = jsString.split(",") //["Hello", "JavaScript"]
// 全文字符替換
var s10 = jsString.replace("e", "E") //"HEllo,JavaScript"
// 全文轉(zhuǎn)換為大寫(xiě)
var s11 = jsString.toUpperCase() //"HELLO,JAVASCRIPT"
// 全文轉(zhuǎn)換成小寫(xiě)
var s12 = jsString.toLowerCase() //"hello,javascript"
//測(cè)試輸出結(jié)果
var sArr = [s0, s1, s2, s3, s4, s5, s6, s7, s8, s9, s10, s11, s12]
for (var i = 0; i < sArr.length; i++) {
console.log(sArr[i])
}
三柒凉、JavaScript之?dāng)?shù)組
- 數(shù)組是值的有序集合
- JavaScript數(shù)組事務(wù)類型的:數(shù)組元素可以使任何類型, 同一數(shù)組中的不同元素也可以是不同類型
- 數(shù)組的元素也可以是對(duì)象或者其他數(shù)組
- JavaScript數(shù)組可能是稀疏的: 數(shù)組元素的索引不一定是連續(xù)的,之間可能有空缺
- 稀疏數(shù)組的length比任何元素的索引都要大
1.創(chuàng)建數(shù)組(直接量創(chuàng)建)
//1.1: 簡(jiǎn)單數(shù)組
var empty = []; //空數(shù)組
var pram = [2, 3, 2] //有三個(gè)數(shù)值的數(shù)組
var misc = [1.1, true, "a"] //三個(gè)不同元素的數(shù)組
// 1.2: 數(shù)組中的直接量不一定是常量,也可能是表達(dá)式
var base = 1024
var baseArr = [base, base + 1, base + 2, base + 3]
// 1.3: 包含對(duì)象或數(shù)組
var array3 = [[1, {x: 1, y: 2}], [2, {x: 3, y: 4}]]
//1.4: 忽略中間量中的某個(gè)值,省略的元素將被賦予undefined
var undef1 = [1, ,3] //三個(gè)元素,中間的為undefined
var undef2 = [, ,] //2個(gè)元素都是undefined
//注: 數(shù)組直接量的語(yǔ)法允許游客選的結(jié)尾的逗號(hào),故[, ,]只有2個(gè)元素
2. Array()創(chuàng)建數(shù)組
// 空數(shù)組
var a = new Array()
//指定數(shù)組長(zhǎng)度
var a1 = new Array(10)
//顯示創(chuàng)建
var a2 = new Array(1, 2, 3, "a")
3. 數(shù)組操作
//3. 讀寫(xiě)數(shù)組元素
//注: 1.數(shù)組是對(duì)象的特殊形式,故JavaScript的數(shù)組不存在越界報(bào)錯(cuò)的情況,只會(huì)取到undefined
var value = a2[3]
//4. 數(shù)組的長(zhǎng)度
//length屬性為可讀可寫(xiě)
var arr = [1, 2, 3, 4, 5, 6]
var arrLength = arr.length //6
arr.length = 4 //數(shù)組變?yōu)閇1, 2, 3, 4]
arr.length = 0 // 刪除所有元素,為[]
arr.length = 5 // 長(zhǎng)度為5,但是沒(méi)有元素,相當(dāng)于new Array(5)
//5. 數(shù)組元素的添加和刪除
//5.1: 索引值添加
var a0 = []
a0[0] = 3
a0[1] = "one"
//a0為[3, "one"]
6. 數(shù)組的方法
- 主要介紹ECMAScript中的方法
//6.1: join()
/*注:
0.不改變?cè)瓟?shù)組
1.將數(shù)組所有的元素都轉(zhuǎn)化成字符串,并連接在一起,返回生成后的字符串(如不指定分隔符默認(rèn)使用逗號(hào))
2.join是String.split()的逆向操作
*/
var arr0 = [1, 2, 3, 4]
var join1 = arr0.join() // "1,2,3,4"
var join2 = arr0.join("") //"1234"
var join3 = arr0.join("-") //"1-2-3-4"
console.log(join1,join2,join3)
//6.2: reverse()
/*
0.改變?cè)瓟?shù)組
1.將數(shù)組中的元素顛倒順序*/
arr0.reverse() //現(xiàn)在arr0為[4, 3, 2, 1]
console.log(arr0)
//6.3: sort()排序
/*注:
0.改變?cè)瓟?shù)組
1.不帶參數(shù)時(shí),以字母表順序排序
2.如果數(shù)組包含undefined,則會(huì)被排到數(shù)組的末尾
3.字母排序區(qū)分大小寫(xiě),A < a
*/
var arr1 = new Array("tian", "quan", "jun")
arr1.sort() //arr1 = ["jun", "quan", "tian"]
console.log(arr1)
//條件比較
var arr2 = new Array("ant", "Bug", "cat", "Dog")
arr2.sort() //["Bug", "Dog", "ant", "cat"]
console.log(arr2)
//不區(qū)分大小寫(xiě)排序
arr2.sort(function (s, t) {
var a = s.toLowerCase()
var b = t.toLowerCase()
if (a < b) return -1
if (a > b) return 1
return 0
})
console.log(arr2)
//["ant", "Bug", "cat", "Dog"]
//6.4: concat()創(chuàng)建并返回一個(gè)新數(shù)組
//0.不改變?cè)瓟?shù)組
var arr4 = [0, 2, 3]
var concat1 = arr4.concat() //[0, 2, 3]
var concat2 = arr4.concat(1, 4) //[0, 2, 3, 1, 4]
var concat3 = arr4.concat([1, 4]) //[0, 2, 3, 1, 4]
var concat4 = arr4.concat([1, 4], [5, 6]) //[0, 2, 3, 1, 4, 5, 6]
var concat5 = arr4.concat(1, [4, [5, 6]]) //[0, 2, 3, 1, 4, [5, 6]]
var concatArr = [concat1, concat2, concat3, concat4, concat5]
console.log(concatArr)
//6.5: slice()
/*
* 注意:
* 1.返回?cái)?shù)組的部分?jǐn)?shù)組
* 2.不改變?cè)瓟?shù)組
* 3.兩個(gè)參數(shù),分別表示始末位置,含左不含右
* 4. 1表示第一個(gè)元素,-1表示倒數(shù)第一個(gè)元素
* 5.只有一個(gè)參數(shù),默認(rèn)以此參數(shù)開(kāi)始,到最后一個(gè)元素結(jié)束
* */
var arr3 = [1, 2, 3, 4, 5]
var slice1 = arr3.slice(0,2) //[1, 2]
var slice2 = arr3.slice(3) //[4, 5]
var slice3 = arr3.slice(1,-2) //[2, 3]
var slice4 = arr3.slice(-3,-2) //[3]
var sliceArr = [slice1, slice2, slice3, slice4]
console.log(sliceArr)
//6.6: splice()
/*
* 1.在數(shù)組中插入或刪除元素的通用方法
* 2.會(huì)修改原數(shù)組,會(huì)改變數(shù)組的索引值
* 3.兩個(gè)參數(shù),參數(shù)一:起始位置;參數(shù)二:處理元素的個(gè)數(shù)(可省略)
* 4.若省略第二個(gè)參數(shù),默認(rèn)從起始位置到最后
* 5.如果沒(méi)有元素就返回空數(shù)組
* */
var m = [1, 2, 3, 4, 5, 6, 7]
var splice1 = m.splice(4) //返回[5, 6, 7], m 是[1, 2, 3, 4]
console.log(m)
var splice2 = m.splice(1, 2) //返回[2, 3], m 是[1, 4]
console.log(m)
var splice3 = m.splice(1, 1) //返回[4], m 是[1]
console.log(m)
var spliceArr = [splice1, splice2, splice3]
console.log(spliceArr)
//6.7: push()和pop()
/*
* 方法將數(shù)組當(dāng)成棧使用
* 1.push方法在尾部添加一個(gè)或者多個(gè)元素,返回新的數(shù)組長(zhǎng)度
* 2.pop刪除數(shù)組的最后一個(gè)元素,減小數(shù)組的長(zhǎng)度,返回刪除的值
* 3.改變?cè)瓟?shù)組的值和長(zhǎng)度
* */
var m0 = []
var pp1 = m0.push(1, 2) //[1, 2], 返回2
var pp2 = m0.pop() //[1], 返回2
var pp3 = m0.push(3, 4) //[1, 3, 4], 返回3
var pp4 = m0.pop() //[1, 3], 返回4
var pp5 = m0.push([9,0]) //[1, 3, [9, 0]], 返回3
var pp6 = m0.pop() //[1, 3], 返回[9, 0]
var pp7 = m0.pop() //[1], 返回3
var ppArr = [pp1, pp2, pp3, pp4, pp5, pp6, pp7]
console.log(ppArr)
//6.8: unshift()和shift()
/*
* 1.unshift在頭部添加一個(gè)或者多個(gè)元素,返回長(zhǎng)度
* 2.shift刪除數(shù)組的第一個(gè)元素,返回刪除的元素
* 3.改變?cè)瓟?shù)組,改變?cè)瓟?shù)組的索引
* 4.unshift插入多個(gè)元素時(shí),試一次性插入的
* */
var sh = []
var sh1 = sh.unshift(1) //sh: [1], 返回: 1
var sh2 = sh.unshift(22) //sh: [1, 22], 返回: 2
var sh3 = sh.shift() //sh: [22], 返回: 22
var sh4 = sh.unshift(3, [4, 5]) //sh: [3, [4, 5], 1], 返回: 3
var sh5 = sh.shift() //sh: [[4, 5], 1], 返回: 3
var sh6 = sh.shift() //sh: [1], 返回: [4, 5]
var shiftArr = [sh1, sh2, sh3, sh4, sh5, sh6]
console.log(shiftArr)
//注: unshift插入多個(gè)元素時(shí),試一次性插入的,例如:
sh.unshift(3, 4)
// 結(jié)果: [3, 4]
sh.unshift(3)
sh.unshift(4)
//結(jié)果: [4, 3]
//6.9: toString()和toLocalString()
/*
* 1.toString()將數(shù)組元素轉(zhuǎn)化成字符串后,用都好鏈接輸出
* 2.toString()和join()不加參數(shù)的返回的值是一樣的
* 3.toLocalString()是toString()的本地化版本
* */
var str0 = [1, 2, 3].toString() //返回: "1,2,3"
var str1 = ["a", "b", "c"].toString() //返回: "a,b,c"
var str2 = [1, [2, "c"]].toString() //返回: "1,2,c"
var str3 = [1, 2, 3].toLocaleString() //返回: "1,2,3"
var strArr = [str0, str1, str2, str3, str4]
console.log(strArr)
7. ECMAScript5中數(shù)組的方法
- 1.ECMAScript5定義了九個(gè)新的數(shù)組方法
- 2.大多數(shù)ECMAScript5數(shù)組方法的第一個(gè)參數(shù)是一個(gè)函數(shù)
- 2.第二個(gè)參數(shù)是可選的,如果有,則調(diào)用的函數(shù)被看作是第二個(gè)參數(shù)的方法
- 3.也就是說(shuō)在調(diào)用函數(shù)時(shí),傳遞進(jìn)去的第二個(gè)參數(shù)作為它的this關(guān)鍵字的值來(lái)使用
- 4.ECMAScript5中的數(shù)組方法不會(huì)修改他們調(diào)用的原始數(shù)組
- 5.傳遞給這些方法的函數(shù)是可以改變這些數(shù)組的
//7.1: forEach()
/*
* 1.方法從頭到尾遍歷數(shù)組,為每個(gè)元素調(diào)用指定的函數(shù)
* 2.forEach使用三個(gè)參數(shù)調(diào)用該函數(shù):數(shù)組元素,元素索引, 數(shù)組本身
* */
var data1 = [1, 2, 3, 4, 5]
//求和
var sum = 0
data1.forEach(function (value) {
sum += value
})
//15
//每個(gè)元素本身自加1
data1.forEach(function (value, i, arr) {
arr[i] = value + 1
})
//[2, 3, 4, 5, 6]
//7.2: map()
/*
* 1.返回一個(gè)新數(shù)組,不改變?cè)瓟?shù)組
* 2.原數(shù)組若是稀疏數(shù)組,返回也是稀疏數(shù)組
* 3.具有相同的長(zhǎng)度,相同的缺失元素
* */
var arr2 = data1.map(function (x) {
return x * x
})
// [4, 9, 16, 25, 36]
//7.3: filter()邏輯判定,過(guò)濾數(shù)組
/*
* 1.返回原數(shù)組的一個(gè)子集
* 2.返回原數(shù)組符合條件的元素,組成新數(shù)組
* 3.會(huì)將稀疏數(shù)組壓縮,返回的是稠密數(shù)組
* */
var arr3 = data1.filter(function (x) {
return x > 3
})
//[4, 5, 6]
var data2 = [1, 2, 3, 4, 5]
var arr4 = data2.filter(function (i) {
return i % 2 == 0
})
//[2, 4]
var data3 = [1, 2, , , null, 5]
var arr5 = data3.filter(function (x) {
return x !== undefined && x != null
})
console.log(arr5)
//[1, 2, 5]
//7.4: every()和some()數(shù)組的邏輯判定
/*
* 1.對(duì)數(shù)組元素應(yīng)用指定的函數(shù)進(jìn)行判定
* 2.返回trur或者false
* 2.every()都為true返回true,否則返回false
* 3.some()都為false,返回false;有一個(gè)為true,返回true
* 4.一旦該方法確定了返回值,就會(huì)停止遍歷數(shù)組
* 5.空數(shù)組,every()返回true,some()返回false
* */
var data4 = [1, 2, 3, 4, 5]
var sum1 = data4.every(function (x) {
return x < 10
})
//sum1 = true
var sum2 = data4.every(function (x) {
return x % 2 === 0
})
//sum2 = false
var sum3 = data4.some(function (x) {
return x % 2 === 0
})
//sum3 = true
var sum4 = data4.some(isNaN)
//sum4 = false, data4不包含非整數(shù)值元素
//7.5: reduce()和reduceRigh()
/*
* 作用: 將數(shù)組元素進(jìn)行組合生成單個(gè)值
* 1.reduce()需要兩個(gè)參數(shù);參數(shù)一:執(zhí)行操作的函數(shù);參數(shù)二:傳遞給函數(shù)的初始值
* 2.reduceRight()是倒敘操作,功能與reduce相同
* */
var data5 = [1, 2, 3, 4, 5]
var sn0 = data5.reduce(function (x, y) {
return x + y
}, 0)
//15
var sn1 = data5.reduce(function (x, y) {
return x * y
}, 1)
//120
var sn2 = data5.reduce(function (x, y) {
return x > y ? x : y
})
//5
//7.6: indexOf()和lastIndexOf()
/*
* 1.搜索整個(gè)數(shù)組中具有給定值的元素,返回找到的第一個(gè)元素的索引,如果沒(méi)有找到就返回-1
* 2.indexOf(),從前向后搜索,lastIndexOf()從后向前搜索
* 3.參數(shù)一:元素值; 參數(shù)二: 搜索的起始位置(可省略,默認(rèn)從頭開(kāi)始)
* */
var data6 = [0, 1, 2, 1, 0]
var index1 = data6.indexOf(1) //1, data6[1] = 1
var index2 = data6.indexOf(3) //-1, 沒(méi)有值為3的元素
var index3 = data6.lastIndexOf(1) //3, data6[3] = 1
var index4 = data6.indexOf(2, 1)//2, data6[2] = 2
var index5 = data6.lastIndexOf(2, -1)//2, data6[2] = 2
8. 判定一個(gè)位置對(duì)象是否為數(shù)組
var data = [1, 2]
// var isA = data.isArray()
console.log(data.isArray())