javascript高級程序設計讀書筆記(三)

引用類型

NO.1 Object類型

最常用的引用類型是Object類型
創建Object實例的兩種方法:
方法一:new+構造函數
var person = new Object();
person.name = "yzq"
person.age = 18;
方法二:使用對象字面量表示法
var person = {
name: "yzq",
age: 18
}
使用對象字面量表示法時,屬性名稱也可以使用字符串并且數字會自動轉換為字符串:
var person = {
"name": "yzq",
"age": 18,
5:true
}

一般來說,對象的屬性訪問都是用點表示法,但是在JS中也可以用[]來表示
person["name"] 等價于person.name
用[]的好處是可以通過變量來訪問屬性或者在點用不了的情況下使用,例如:
var person = {
"first name": "dada"
}
var a = "first name"
person[a]

NO.2 Array類型

其次常用的引用類型是Array類型,JS的數組也和其他語言有很大的區別,JS的數組的每一項都可以保存任何類型的數據,且JS的數組大小是可以動態調整的,可以隨著數據添加自己增長

創建數組的方法:

  1. var colors = new Array(); 使用Array構造函數;
  2. var colors = ["red","green"] 使用字面量方法;

數組的長度保存在length屬性中,這個屬性始終會返回0或者更大的值。
length屬性有一個很大的特點,它不是只讀的,所以通過這只這個屬性,可以從數組的末尾移除項或者添加新項。例如:

var colors = ["red","green","blue"]
colors.length = 2
console.log(colors[2])   //結果為undefined

所以利用length屬性可以方便的在數組尾末添加新項,例如:

var colors = ["red","green","blue"]
colors[colors.length]= "black"
colors[colors.length]= "brown"
console.log(colors.length)

檢測數組:
對于全局的作用域來說,用instanceof就能檢測,但是它的問題在與如果網頁中有多個框架,instanceof會由于全局環境不一樣出現問題,于是還有一個新的方法Array.isArray(),用法如下:

if(Array.isArray(value)){
    //對數組進行操作
}

轉化方法:
1.顯示的調用toString方法,會直接將數組返回字符串的表示
2.alert(數組),因為alert只接收字符串參數,所以它會在后臺調用toString方法,當數組方法只接受字符串的方法里,后臺會自動去轉換

轉化后都默認用逗號去間隔,如果想要用別的符號,需要用join()方法,join方法只接收一個參數,就是分隔符。
colors.join("||") // red || green || blue

棧方法(后進先出):
js為數組提供了push()和pop()方法。以便實現類似棧的功能;
push()方法接收任意數量的參數,把他們逐個加到數組末尾,并返回修改后的數組的長度
pop方法從數組末尾移除最后一項,減少數組的length值,并且返回移除的項
push():

var colors = ["red","green","blue"]
var count = colors.push("1","2")
console.log(count) //5

pop():

var colors = ["red","green","blue"]
var count = colors.pop("blue")
console.log(count) // blue

隊列方法(先進先出):
js為數組提供了shift()和unshift()方法。以便實現類似隊列的功能;
shift()移除數組中的第一個項并返回該項,同時將數組長度減一。結合shift()和push()可以像使用隊列一樣使用數組

unshift()在數組前端添加任意個項并返回數組長度。結合unshift()和pop()可以像使用隊列一樣使用數組

重排序方法:
reverse()和sort()
reverse()方法的功能是反轉數組的順序
sort()方法是按升序排列數組項,但是sort方法會調用每個數組項的toString()的轉型方法。于是比較的都是字符串的大小。例如:

var values = [0,1,5,10,15]
values.sort(); // [0,1,10,15,5]

因為sort是轉化為字符串比較,所以看起來不是升序排列。
正確的做法是先定義一個比較函數:

function compare(value1,value2){
  if(value1>value2) {
    return 1;
  } else if (value1<value2){
    return -1;
  } else{
    return 0;
  }
}

var values = [0,1,5,10,15]
values.sort(compare);
console.log(values)

這個的做法就會讓數組里面的值按值比較。

操作方法:
concat()
concat()方法可以基于當前數組中的所有項創建一個新數組,這個方法會先創建當前數組的一個副本,然后將接收到的參數添加到副本的末尾。例如:

var a = ["a","b","c"]
var b = a.concat("d",[5,6])
console.log(b)    // ["a", "b", "c", "d", 5, 6]

slice()
slice()方法可以基于當前數組中的某幾個項創建一個新數組,可以接收一個或兩個參數,接收一個參數的時候,表示返回該參數的位置到數組末尾的所有項,接收兩個參數的時候,表示返回這兩個參數之間的項:

var a = ["a","b","c","d","e"]
var b = a.slice(1)
console.log(b)  // ["b", "c", "d", "e"]
var a = ["a","b","c","d","e"]
var b = a.slice(1,4)  //注意,起始位置從1開始,而不是從0開始
console.log(b) //["b", "c", "d"]

splice()最強大的數組方法!,并不是創建數組,而是直接操作數組
1.傳入兩個參數:表示刪除數組的項,第一個參數表示要刪除的第一項的位置,第二個是要刪除的數量
splice(0,2)刪除數組中的前兩項

2.傳入三個參數:可以向指定位置插入任意數量的項,第一個參數表示起始位置,0(要刪除的項目),第三個是要插入的項,如果要插入多個項,可以傳入任意個的參數
splice(2,0,"red","blue")表示從數組的位置2開始插入字符串"red"和"blue"

3.傳入三個參數(第二個參數不為0),替換數組中的指定項
splice(2,1,"red","blue")表示在位置2,刪除1項,然后插入2個字符串"red"和"blue"

位置方法:
indexOf()和lastindexOf() 這兩個方法都返回查找的項在數組中的位置,一個是從前往后查找,一個是從后往前查找

var numbers = [1,2,3,4,5,6]
numbers.indexOf(4);  //3

迭代方法:
every() 對于數組的每一項運行給定函數,如果該函數對每一項都返回true,則返回true
filrer() 對于數組的每一項運行給定函數,返回該函數返回true的項組成的數組
forEach() 對于數組的每一項運行給定函數,沒有返回值
map() 對于數組的每一項運行給定函數,返回每次函數調用的結果組成的數組
some() 對于數組的每一項運行給定函數,如果該函數有任何項返回true,則返回true
以上五個函數都能接受兩個參數:
1.要在數組的每一項上運行的函數
2.運行該函數的作用域(可選)

歸并方法:
reduce()和reduceRight()
reduce()方法從數組的第一項開始,逐個遍歷到最后;
reduceRight()從數組的最后一項開始,向前遍歷到第一項;
他們的函數都可以接收四個參數,前一個值,當前值,項的索引和數組對象。

var values = [1,2,3,4,5]
var sum = values.reduce(function(prev,cur,index,array){
 return prev+ cur; 
});

console.log(sum);   //15

這個函數返回的任何值都會當做為第一個參數傳給下一項,例如1+2之后,變成3傳給下一項,3+3在傳遞給下一項,所以結果為15。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 228,333評論 6 531
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 98,491評論 3 416
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 176,263評論 0 374
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 62,946評論 1 309
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,708評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,186評論 1 324
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,255評論 3 441
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,409評論 0 288
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 48,939評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,774評論 3 354
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 42,976評論 1 369
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,518評論 5 359
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,209評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,641評論 0 26
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,872評論 1 286
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,650評論 3 391
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 47,958評論 2 373

推薦閱讀更多精彩內容