觀阮一峯老師js教程筆記

1. js中並非全部值都是對象


  • 基本數據類型不是對象,沒有方法和屬性
      方法:是某個特定對象才能調用的函數
      屬性:是隸屬於某個特定對象的變量
      對象:是一種字包含的數據類型
  • ECMAScript和JavaScript的關係是,前者是後者的規格,後者是前者的一種實現。在平常場合,這兩個詞是能夠互換的。

2. 語法

2.1基本語法


  • 等號右邊是表達式,每一行用;分開的代碼都是一個語句,
  • 語句和表達式的區別在於,前者主要爲了進行某種操做,通常狀況下不須要返回值, 語句的值就是是undefined;後者則是爲了獲得返回值,必定會返回一個值
  • 變量提高:就是全部的變量的聲明語句,都會被提高到代碼的頭部
  • for循環和while循環相同
  • 三元運算符(條件) ? 表達式1 : 表達式2可視爲if...else的簡寫
  • do...while循環無論條件是否爲true至少執行一次
  • continue語句用於當即終止本輪循環,返回循環結構的頭部,開始下一輪循環
  • break用於直接跳出循環或代碼塊

2.2數據類型


  • typeof null返回object
  • if語句中undefinednull都會轉爲false
  • null是一個表示「空」的對象,轉爲數值時爲0;
  • undefined是一個表示」此處無定義」的原始值,轉爲數值時爲NaN。
  • 轉換規則是除了下面六個值被轉爲false,其餘值都視爲true。 undefined null false 0 NaN "或''(空字符串)

2.3數值


2.3.1 js中全部數字都是64位雙精度浮點數

  1. 第1位:符號位,0表示正數,1表示負數
  2. 第2位到第12位(共11位):指數部分
  3. 第13位到第64位(共52位):小數部分(即有效數字)
  • 絕對值小於等於2的53次方的整數,即2^-53到2^53,均可以精確表示。

2.3.2 數值的進制

十進制:沒有前導0的數值。 八進制:有前綴0o或0O的數值,或者有前導0、且只用到0-7的八個阿拉伯數字的數值。 十六進制:有前綴0x或0X的數值。 二進制:有前綴0b或0B的數值。javascript

2.3.3 parseInt方法用於將字符串轉爲整數。

  1. 若是parseInt的參數不是字符串,則會先轉爲字符串再轉換。
  2. 字符串轉爲整數的時候,是一個個字符依次轉換,若是遇到不能轉爲數字的字符,就再也不進行下去,返回已經轉好的部分。 3.若是以0x開頭會照16進制解析 4若是以0開頭會以10進制解析
  3. parseInt方法還能夠接受第二個參數(2到36之間),表示被解析的值的進制
  4. 若是第一個參數不是字符串,"0x11"寫成0x11則會先轉換爲10進制,在進行第二個參數的轉換 -isNaN()

2.3.4 isNaN()能夠用來判斷一個值是否爲NaN。

  • isNaN只對數值有效,若是傳入其餘值,會被先轉成數值。至關於isNaN(Number('xxx'))

2.4字符串


1. 字符串只能寫在一行內,若是要分紅多行,每一行末尾加上\和換行符

2. 反斜槓(\)在字符串內有特殊含義,用來表示一些特殊字符,因此又稱爲轉義符。

3. 字符串可視爲字符數組可使用[]運算符返回某個位置的字符

反斜槓\有3種特殊的用法:java

  • \HHH 反斜槓後面緊跟三個八進制數(000到377),表明一個字符。HHH對應該字符的 Unicode 碼點,好比\251表示版權符號。顯然,這種方法只能輸出256種字符。
  • \xHH \x後面緊跟兩個十六進制數(00到FF),表明一個字符。HH對應該字符的 Unicode 碼點,好比\xA9表示版權符號。這種方法也只能輸出256種字符。
  • \uXXXX \u後面緊跟四個十六進制數(0000到FFFF),表明一個字符。HHHH對應該字符的 Unicode 碼點,好比\u00A9表示版權符號。

4. 字符集

  • 每一個字符在javascript中都以16位(2個字節)的utf-16格式儲存
  • JavaScript 使用 Unicode 字符集。JavaScript 引擎內部,全部字符都用 Unicode 表示。
  • 因爲歷史緣由,對於碼點在U+10000到U+10FFFF之間的字符,JavaScript 老是認爲它們是兩個字符

5. Base64 轉碼

  • 文本有不可打印的符號可使用base64轉碼
  • btoa():任意值轉爲 Base64 編碼 atob():Base64 編碼轉爲原來的值
  • 必須是ASCII 碼的字符

2.5對象


  • 對象就是hash,就是一組「鍵值對」(key-value)的集合,是一種無序的複合數據集合。
  • 對象中全部的key(鍵名)的都是字符串,若是是數值會自動轉換爲字符串
  • 若是key不符合標識符的條件,(好比第一個字符爲數字,或者含有空格或運算符且也不是數字),必須加上引號
  • key也叫屬性,若是value爲函數,那麼一般把這個屬性稱爲「方法」,若是屬性的值仍是一個對象,就造成了鏈式引用。
  • 若是隻採用大括號。JavaScript 規定,若是行首是大括號,一概解釋爲語句(即代碼塊),若是想表達對象則要咋在外加上圓括號({a:123})
  • 讀取屬性obj.p或者obj['p'] 若是不加引號則指向一個變量
  • 查看對象的全部屬性Object.keys -delete命令能夠刪除對象的屬性,刪除不存在的屬性也會返回true,不能刪除繼承的屬性
  • in運算符檢查某個對象是否包含某個屬性(key) (不能識別是否爲繼承的,都會返回true)
  • for(...in...){}用於遍歷對象的所有屬性
  • with 語句用來批量操做同一個對象的多個屬性(若是with區塊內部有變量的賦值操做,必須是當前對象已經存在的屬性,不然會生成一個全局變量)

2.6數組


  • 數組實際上是固定key的對象(hash),key['0'],['1'],['2'].['3'],['4']...都是字符串
  • 數組的length是其中最大key+1,不是其中的個數
  • 當數組的某個元素是空元素,即2個逗號之間沒有任何值,咱們稱改數組存在空位
  • 空位不會影響length屬性,空位是可讀取的,返回undefined,delete命令刪除某個屬性,這個位置就造成了空位
  • 空位就是數組沒有這個元素,因此不會被遍歷到,而undefined則表示數組有這個元素,值是undefined,因此遍歷不會跳過。
  • 相似數組的對象,特徵是具備lenght屬性,length不是動態的
  • 可使用var arr = Array.prototype.slice.call(arrayLike)把對象變成真正的數組

2.7函數


  • 函數名也會提高,若是同時採用function命令和賦值語句聲明同一個函數,最後老是採用賦值語句的定義。算法

  • 根據es5規範,不得在條件語句中聲明函數,因爲存在函數名提高,因此可能不報錯,若是非要在條件語句中定義函數,請使用變量聲明函數編程

  • 構造函數:return一個對象的函數數組

  • 函數也是對象,他的原型中有個call方法來經過eval執行函數體瀏覽器

  • 函數的toString返回函數的源碼安全

  • 函數內部定義的變量會在該做用於內覆蓋同名全局變量bash

  • 函數執行時所在的做用域,是定義時的做用域,而不是調用時所在的做用域閉包

  • 參數能夠省略,若是要省略靠前的參數,則傳入undefined 好比→ f(undefined,b)模塊化

  • arguments對象包含了函數運行時的全部參數,arguments[0]就是第一個參數,普通模式下,arguments對象能夠修改,嚴格模式不行,arguments是一個僞數組

  • 把arguments變成真數組:var args = Array.prototype.slice.call(arguments);

  • 閉包看我寫的函數文章

  • 當即執行函數(IIFE):通常狀況下只對匿名函數使用當即執行函數,不污染全局變量,內部造成單獨做用域,可封裝私有變量

    1. (function()){}
    2. (function(){})
    3. !function(){}
  • eval命令:把字符串看成語句來執行,eval沒有單獨的做用域,能夠修改當前做用域中變量的值,有安全風險

2.8運算符


2.8.1重載

  • 加法在相加的時候決定,是執行相加仍是相連,致使不一樣的語法行爲,這種現象叫重載。

  • 減法、除法和乘法運算符,都是將字符串自動轉爲數值,而後再運算。

    '3' + 4 + 5 // "345"
    3 + 4 + '5' // "75"
    複製代碼

2.8.2 對象轉成原始類型的值,規則以下

x.valueOf().toString() 
複製代碼
  • valueOf方法最適合該對象類型的原始值,這時再自動調用對象的toString方法,將其轉爲字符串。
  • 在數值運算裏,會優先調用valueOf(),如a + b; 在字符串運算裏,會優先調用toString(),如alert(c)。

2.8.3自增和自減

  • 下面代碼中,x是先返回當前值,而後自增,因此獲得1;y是先自增,而後返回新的值,因此獲得2。
var x = 1;
var y = 1;
x++ // 1
++y // 2
複製代碼
  • +也是數值運算符,能夠把任何值轉換爲number

2.8.3比較運算符

  • 字符串比較

JavaScript 引擎內部首先比較首字符的 Unicode 碼點。若是相等,再比較第二個字符的 Unicode 碼點,以此類推。

  • 非字符串比較
true > false // true
// 等同於 Number(true) > Number(false)
// 即 1 > 0
複製代碼

先轉換爲數值在進行比較

  • 對象比較

對象轉換成原始類型的值,算法是先調用valueOf方法;若是返回的仍是對象,再接着調用toString方法

x.valueOf().toString() >y.valueOf().toString()

2.8.4嚴格相等運算符

  • 兩個複合類型(對象、數組、函數)的數據比較時,不是比較它們的值是否相等,而是比較它們是否指向同一個地址。
{} === {} // false
[] === [] // false
(function () {} === function () {}) // false
複製代碼
  • 若是兩個變量引用同一個對象,則它們相等。
var a = {}
var b = a
a === b//true
複製代碼

2.8.5 &&且運算符

它的運算規則是:若是第一個運算子的布爾值爲true,則返回第二個運算子的值(注意是值,不是布爾值);若是第一個運算子的布爾值爲false,則直接返回第一個運算子的值,且再也不對第二個運算子求值。
返回值就是遇到的第一個falsy值,若是全爲真,則返回最後一個值

1 && 0 //0
1 && 0 && 2 && 3 && 4 //0
1 && 2 && 3 && 4 && 5 //5
複製代碼
if (i) {
  doSomething();
}

// 等價於

i && doSomething();
複製代碼

2.8.6 或運算符(||)

它的運算規則是:若是第一個運算子的布爾值爲true,則返回第一個運算子的值,且再也不對第二個運算子求值;若是第一個運算子的布爾值爲false,則返回第二個運算子的值。
返回值就是遇到的第一個truthy值,若是全爲假,則返回最後一個值

0 || 1 //1
0 || null || undefined || NaN || 1 //1
0 || null || undefined || NaN || "" //""
複製代碼

2.8.7 位運算符

二進制或運算符(or):符號爲|,表示若兩個二進制位都爲0,則結果爲0,不然爲1。
二進制與運算符(and):符號爲&,表示若兩個二進制位都爲1,則結果爲1,不然爲0。
二進制否運算符(not):符號爲~,表示對一個二進制位取反。
異或運算符(xor):符號爲^,表示若兩個二進制位不相同,則結果爲1,不然爲0。
左移運算符(left shift):符號爲<<,詳見下文解釋。
右移運算符(right shift):符號爲>>,詳見下文解釋。
帶符號位的右移運算符(zero filled right shift):符號爲>>>,詳見下文解釋。
複製代碼

有一點須要特別注意,位運算符只對整數起做用,若是一個運算子不是整數,會自動轉爲整數後再執行。另外,雖然在 JavaScript 內部,數值都是以64位浮點數的形式儲存,可是作位運算的時候,是以32位帶符號的整數進行運算的,而且返回值也是一個32位帶符號的整數。

2.8.8 void運算符

void運算符的做用是執行一個表達式,而後不返回任何值,或者說返回undefined。
這個運算符的主要用途是瀏覽器的書籤工具(bookmarklet),以及在超級連接中插入代碼防止網頁跳轉。

<a href="javascript: void(f())">文字</a>
複製代碼

2.8.9逗號運算符

逗號運算符用於對兩個表達式求值,並返回後一個表達式的值。

'a', 'b' // "b"

var x = 0;
var y = (x++, 10);
x // 1
y // 10
複製代碼

2.8.10 優先級

圓括號的做用

圓括號()能夠用來提升運算的優先級,由於它的優先級是最高的,即圓括號中的表達式會第一個運算。

左結合與右結合

對於優先級別相同的運算符,大多數狀況,計算順序老是從左到右。

x + y + z
複製代碼

可是少數運算符的計算順序是從右到左,即從右邊開始計算。
其中,最主要的是賦值運算符(=)和三元條件運算符(?:)。

w = x = y = z;
q = a ? b : c ? d : e ? f : g;

--------------------------------
w = (x = (y = z));
q = a ? b : (c ? d : (e ? f : g));
複製代碼

2.8數據類型轉換

強制轉換

2.8.1 Number()

使用Number函數,能夠將任意類型的值轉化成數值。
下面分紅兩種狀況討論,一種是參數是原始類型的值,另外一種是參數是對象。

Number()
ture會變爲1,false變爲0
null變成0
undefined變爲NaN
""變爲0 
parseInt('1',進制) 會忽略掉前面的空格,知道找到第一個非數字就中止
parseFloat() 浮點數
複製代碼

老司機採用-0 such as:"1"-0===1
老司機採用+ such as:+"1"===1

對象


簡單的規則是,Number方法的參數是對象時,將返回NaN,除非是包含單個數值的數組。

Number({a: 1})                  // NaN
Number([1, 2, 3])               // NaN
Number([5])                     // 5
複製代碼

2.8.2 String()

String函數能夠將任意類型的值轉化成字符串,強制轉換,null會變成'null',undefined變成'undefined'

String(null)                   //'null'
複製代碼
tostring()
√:number,boolean
×(報錯:null,undefined
obj.tostring()會獲得"{object:Object}" 不是你想要的

√:number,boolean null undefinded
obj+''仍是會獲得"{object:Object}"
tips:由於+會把兩邊的類型趨向2個string相加,1+"1"=(1).tostring+"1"="11" 
window.string()
複製代碼

老司機採用+' '方法轉爲字符串`

對象


String方法的參數若是是對象,返回一個類型字符串;若是是數組,返回該數組的字符串形式。

String({a: 1})                  // "[object Object]"
String([1, 2, 3])               // "1,2,3"
複製代碼

2.8.3 Boolean()

Boolean函數能夠將任意類型的值轉爲布爾值。 它的轉換規則相對簡單:除了如下五個值的轉換結果爲false,其餘的值所有爲true。

undefined
null
-0或+0
NaN
''(空字符串)
複製代碼

2.8編程風格

2.8.1區塊

老是使用大括號

2.8.2圓括號

表示函數調用時,函數名與左括號之間沒有空格。

表示函數定義時,函數名與左括號之間沒有空格。

其餘狀況時,前面位置的語法元素與左括號之間,都有一個空格。

// 圓括號表示函數的調用
console.log('abc');

// 圓括號表示表達式的組合
(1 + 2) * 3
複製代碼

2.8.3全局變量

JavaScript 最大的語法缺點,可能就是全局變量對於任何一個代碼塊,都是可讀可寫。這對代碼的模塊化和重複使用,很是不利。

所以,建議避免使用全局變量。若是不得不使用,能夠考慮用大寫字母表示變量名,這樣更容易看出這是全局變量,好比UPPER_CASE

2.8.4相等和嚴格相等

建議不要使用相等運算符(==),只使用嚴格相等運算符(===)

2.8.5自增和自減運算符

自增(++)和自減(--)運算符,放在變量的前面或後面,返回的值不同,很容易發生錯誤。事實上,全部的++運算符均可以用+= 1代替。

2.8.6分號

建議在行尾添加分號,在有些狀況下,不添加分好可能出現錯誤

x = y
(function () {
  // ...
})();

// 等同於
x = y(function () {...})();
複製代碼

3. 標準庫

3.1 Object對象

Object自己是一個函數,能夠看成工具方法使用,將任意值轉爲對象。這個方法經常使用於保證某個值必定是對象。
若是參數爲空(或者爲undefined和null),Object()返回一個空對象。 instanceof運算符用來驗證,一個對象是否爲指定的構造函數的實例。obj instanceof Object返回true,就表示obj對象是Object的實例。

3.1.2 Object 構造函數

雖然用法類似,可是Object(value)new Object(value)二者的語義是不一樣的,Object(value)表示將value轉成一個對象,new Object(value)則表示新生成一個對象,它的值是value。

3.1.3 Object 的靜態方法

所謂「靜態方法」,是指部署在Object對象自身的方法

3.1.3.1 Object.keys(),Object.getOwnPropertyNames()

Object.keys方法和Object.getOwnPropertyNames方法都用來遍歷對象的屬性。

var obj = {
  p1: 123,
  p2: 456
};

Object.keys(obj) // ["p1", "p2"]
Object.getOwnPropertyNames(obj) // ["p1", "p2"]
複製代碼

Object.keys()和Object.getOwnPropertyNames()返回的結果是同樣的。只有涉及不可枚舉屬性時,纔會有不同的結果。Object.keys方法只返回可枚舉的屬性,Object.getOwnPropertyNames方法還返回不可枚舉的屬性名。

3.1.3.2 Object 的實例方法

還有很多方法定義在Object.prototype對象。它們稱爲實例方法,全部Object的實例對象都繼承了這些方法。

Object.prototype.valueOf():返回當前對象對應的值。              //valueOf方法的主要用途是,JavaScript 自動類型轉換時會默認調用這個方法
Object.prototype.toString():返回當前對象對應的字符串形式。
Object.prototype.toLocaleString():返回當前對象對應的本地字符串形式。
Object.prototype.hasOwnProperty():判斷某個屬性是否爲當前對象自身的屬性,仍是繼承自原型對象的屬性。
Object.prototype.isPrototypeOf():判斷當前對象是否爲另外一個對象的原型。
Object.prototype.propertyIsEnumerable():判斷某個屬性是否可枚舉。
複製代碼

3.1.3.2 Object.prototype.isPrototypeOf()和object instanceof 構造函數

A.isPrototypeOf(B) 判斷的是A對象是否存在於B對象的原型鏈之中
A instanceof B 判斷的是B.prototype是否存在與A的原型鏈之中

A.isPrototypeOf(B)  返回true 則B instanceof A 必定返回true
//A是B的原型,B在由A構造,B.prototype指向A   對象instanceof 構造函數
複製代碼

3.1.3.3 Object.prototype.toString()

上面代碼表示,對於一個對象調用toString方法,會返回字符串[object Object],該字符串說明對象的類型。 字符串[object Object]自己沒有太大的用處
數組、字符串、函數、Date 對象都分別部署了自定義的toString方法,覆蓋了Object.prototype.toString方法

3.1.3.4 toString() 的應用:判斷數據類型

空對象調用toString()結果返回一個字符串object Object,其中第二個Object表示該值的構造函數。這是一個十分有用的判斷數據類型的方法。
因爲實例對象可能會自定義toString方法,覆蓋掉Object.prototype.toString方法,因此爲了獲得類型字符串,最好直接使用Object.prototype.toString方法。經過函數的call方法,能夠在任意值上調用這個方法,幫助咱們判斷這個值的類型。

Object.prototype.toString.call(value)
數值:返回[object Number]。
字符串:返回[object String]。
布爾值:返回[object Boolean]。
undefined:返回[object Undefined]。
null:返回[object Null]。
數組:返回[object Array]。
arguments 對象:返回[object Arguments]。
函數:返回[object Function]。
Error 對象:返回[object Error]。
Date 對象:返回[object Date]。
RegExp 對象:返回[object RegExp]。
其餘對象:返回[object Object]。
複製代碼

3.1.3.5 Object.prototype.toLocaleString()

Object.prototype.toLocaleString方法與toString的返回結果相同,也是返回一個值的字符串形式。
這個方法的主要做用是留出一個接口,讓各類不一樣的對象實現本身版本的toLocaleString,用來返回針對某些地域的特定的值
。目前,主要有三個對象自定義了toLocaleString方法。

Array.prototype.toLocaleString()
Number.prototype.toLocaleString()
Date.prototype.toLocaleString()
複製代碼

舉例來講,日期的實例對象的toString和toLocaleString返回值就不同,並且toLocaleString的返回值跟用戶設定的所在地域相關。

var date = new Date();
date.toString() // "Tue Jan 01 2018 12:01:33 GMT+0800 (CST)"
date.toLocaleString() // "1/01/2018, 12:01:33 PM"
複製代碼

3.1.3.6 Object.prototype.hasOwnProperty()

Object.prototype.hasOwnProperty方法接受一個字符串做爲參數,返回一個布爾值,表示該實例對象自身是否具備該屬性。(可枚舉屬性)

var obj = {
  p: 123
};

obj.hasOwnProperty('p') // true
obj.hasOwnProperty('toString') // false
複製代碼

3.2 Array對象

3.2.1 構造函數

Array是 JavaScript 的原生對象,同時也是一個構造函數,能夠用它生成新的數組。
Array構造函數有一個很大的缺陷,就是不一樣的參數,會致使它的行爲不一致。辣雞js

// 無參數時,返回一個空數組
new Array() // []

// 單個正整數參數,表示返回的新數組的長度
new Array(1) // [ empty ]
new Array(2) // [ empty x 2 ]

// 非正整數的數值做爲參數,會報錯
new Array(3.2) // RangeError: Invalid array length
new Array(-3) // RangeError: Invalid array length

// 單個非數值(好比字符串、布爾值、對象等)做爲參數,
// 則該參數是返回的新數組的成員
new Array('abc') // ['abc']
new Array([1]) // [Array[1]]

// 多參數時,全部參數都是返回的新數組的成員
new Array(1, 2) // [1, 2]
new Array('a', 'b', 'c') // ['a', 'b', 'c']
複製代碼

不要用 我估計你也不會用,

// bad 辣雞
var arr = new Array(1, 2);

// good nice馬飛
var arr = [1, 2];
複製代碼

3.2.2 靜態方法

3.2.2.1 Array.isArray()

Array.isArray方法返回一個布爾值,表示參數是否爲數組。它能夠彌補typeof運算符的不足。

var arr = [1, 2, 3];

typeof arr // "object"
Array.isArray(arr) // true
複製代碼

3.2.3 實例方法

3.2.3.1 push(),pop()

push方法用於在數組的末端添加一個或多個元素,並返回添加新元素後的數組長度。注意,該方法會改變原數組。

var arr = [];

arr.push(1) // 1
arr.push('a') // 2
arr.push(true, {}) // 4
arr // [1, 'a', true, {}]
複製代碼

pop方法用於刪除數組的最後一個元素,並返回該元素。注意,該方法會改變原數組。

var arr = ['a', 'b', 'c'];

arr.pop() // 'c'
arr // ['a', 'b']
複製代碼

對空數組使用pop方法,不會報錯,而是返回undefined。

[].pop() // undefined
複製代碼

push和pop結合使用,就構成了「後進先出」的棧結構(stack)。

var arr = [];
arr.push(1, 2);
arr.push(3);
arr.pop();
arr // [1, 2]
複製代碼
3.2.3.2 shift(),unshift()

shift方法用於刪除數組的第一個元素,並返回該元素。注意,該方法會改變原數組。

var a = ['a', 'b', 'c'];

a.shift() // 'a'
a // ['b', 'c']
複製代碼

shift方法能夠遍歷並清空一個數組。
push和shift結合使用,就構成了「先進先出」的隊列結構(queue)


unshift方法用於在數組的第一個位置添加元素,並返回添加新元素後的數組長度。注意,該方法會改變原數組。

var a = ['a', 'b', 'c'];

a.unshift('x'); // 4
a // ['x', 'a', 'b', 'c']
複製代碼
3.2.3.3 join()

join方法以指定參數做爲分隔符,將全部數組成員鏈接爲一個字符串返回。若是不提供參數,默認用逗號分隔。

var a = [1, 2, 3, 4];

a.join(' ') // '1 2 3 4'
a.join(' | ') // "1 | 2 | 3 | 4"
a.join() // "1,2,3,4"
複製代碼

若是數組成員是undefined或null或空位,會被轉成空字符串。

[undefined, null].join('#')
// '#'

['a',, 'b'].join('-')
// 'a--b'
複製代碼
3.2.3.4 concat()

concat方法用於多個數組的合併。它將新數組的成員,添加到原數組成員的後部,而後返回一個新數組,原數組不變。

['hello'].concat(['world'])
// ["hello", "world"]

['hello'].concat(['world'], ['!'])
// ["hello", "world", "!"]

[].concat({a: 1}, {b: 2})
// [{ a: 1 }, { b: 2 }]

[2].concat({a: 1})
// [2, {a: 1}]
複製代碼

若是數組成員包括對象,concat方法返回當前數組的一個淺拷貝。所謂「淺拷貝」,指的是新數組拷貝的是對象的引用。

var obj = { a: 1 };
var array = [obj];

var newArray = array.concat();

obj.a = 2;
newArray[0].a
// 2
複製代碼
3.2.3.5 reverse()

reverse方法用於顛倒排列數組元素,返回改變後的數組。注意,該方法將改變原數組。

3.2.3.6 slice()

slice() 方法返回一個從開始到結束(不包括結束)選擇的數組的一部分淺拷貝到一個新數組對象。且原始數組不會被修改。。

arr.slice(start, end);
複製代碼
3.2.3.7 splice()

splice方法用於刪除原數組的一部分紅員,並能夠在刪除的位置添加新的數組成員,返回值是被刪除的元素。注意,該方法會改變原數組。

arr.splice(start, count, addElement1, addElement2, ...);
// 從start開始包括strat刪除count個,在strat前面添加addElement一、addElement2
複製代碼

若是隻提供第一個參數,等同於將原數組在指定位置拆分紅兩個數組。

var a = [1, 2, 3, 4];
a.splice(2) // [3, 4]
a // [1, 2]
複製代碼
3.2.3.8 sort()

sort方法對數組成員進行排序,默認是按照unicode順序排序。排序後,原數組將被改變。
若是想讓sort方法按照自定義方式排序,能夠傳入一個函數做爲參數。

[10111, 1101, 111].sort(function (a, b) {
  return a - b;
})
// [111, 1101, 10111]
複製代碼

上面代碼中,sort的參數函數自己接受兩個參數,表示進行比較的兩個數組成員。若是該函數的返回值大於0,表示第一個成員排在第二個成員後面;其餘狀況下,都是第一個元素排在第二個元素前面。

3.2.3.9 map()

map方法將數組的全部成員依次傳入參數函數,而後把每一次的執行結果組成一個新數組返回。

var numbers = [1, 2, 3];

numbers.map(function (n) {
  return n + 1;
});
// [2, 3, 4]

numbers
// [1, 2, 3]
複製代碼
3.2.3.10 forEach()
  • forEach() 方法對數組的每一個元素執行一次提供的函數,沒有返回值
array.forEach(callback(value, key, arr){
    //do something
}, this)
//arr,this可選
-----------------------------------------------------------------
array.forEach( function(value,key){
    //do some thing
})
複製代碼
  • forEach用this傳參給裏面的函數調用 ,因此array.forEach(function(value,key){//do something})可以遍歷array
  • a.forEacj中的函數接受3個參數 arr.value,arr.key,arr本身,第三個能夠省略,下面2行代碼相等
array.forEach(function(value,key){})
array.forEach.call(this,function(value,key ){})
複製代碼
  • 咱們能夠本身手寫一個forEach
let foo={0:'a',1:'b',length:2}
foo.forEach=function(fn){
    for(let i = 0;i < foo.length; i++){
        fn(this[i],i)       //foo的每一項都調用一下fn
    }
}
複製代碼
3.2.3.11 filter()

過濾器:filter() 方法建立一個新數組, 其包含經過所提供函數實現的測試的全部元素

array.filter(function(currentValue,index,arr){
    
}, thisValue)
//thisValue可選。對象做爲該執行回調時使用,傳遞給函數,用做 this 的值。若是省略了 thisValue ,this 的值爲"undefined 複製代碼
let array=[1,2,3,4,5,6,7,8,9,10]
array.fillter(function(value,key){
    return value >= 5
})
//[5,6,7,8,9,10]
複製代碼
3.2.3.12 reduce()

reduce() 方法對累加器和數組中的每一個元素(從左到右)應用一個函數,最後返回單個值。

arr.reduce(function(a, b, c, d){},e)

a:累加器的返回值,上一次的結果
b:當前處理的元素,如今
c:當前處理的元素的索引,第一次處理時,若是提供了初始值,則爲0,沒有提供則爲1,可選
d:d:arr本身自己,可選
e:初始值,若是沒有指定,則arr中的第一個值爲初始值,可選
複製代碼
let arr=[1,2,3,4]
arr.reduce((prev, curr) => prev + curr )
//10
複製代碼

reduce能夠表示map

a = [1,2,3]
a.reduce(function(arr,n){
    arr.push(n*2)
    return arr
},[])
//[2,4,6]
//每一項平方
複製代碼

reduce能夠表示filter

a = [1,2,3,4,5,6,7,8,9,10]
a.reduce(function(arr,n){
    if(n % 2 === 0){
        arr.push(n)
    }
    return arr
},[])
//[2,4,6,8,10]
複製代碼
3.2.3.13 indexOf()lastIndexOf()

indexOf方法返回給定元素在數組中第一次出現的位置,若是沒有出現則返回-1。

var a = ['a', 'b', 'c'];

a.indexOf('b') // 1
a.indexOf('y') // -1
複製代碼

indexOf方法還能夠接受第二個參數,表示搜索的開始位置。

['a', 'b', 'c'].indexOf('a', 1) // -1
複製代碼

lastIndexOf方法返回給定元素在數組中最後一次出現的位置,若是沒有出現則返回-1

var a = [2, 5, 9, 2];
a.lastIndexOf(2) // 3
a.lastIndexOf(7) // -1
複製代碼

3.3包裝對象

對象是 JavaScript 語言最主要的數據類型,三種原始類型的值——數值、字符串、布爾值——在必定條件下,也會自動轉爲對象,也就是原始類型的「包裝對象」。

所謂「包裝對象」,就是分別與數值、字符串、布爾值相對應的Number、String、Boolean三個原生對象。這三個原生對象能夠把原始類型的值變成(包裝成)對象。

var v1 = new Number(123);
var v2 = new String('abc');
var v3 = new Boolean(true);
複製代碼

包裝對象的最大目的,首先是使得 JavaScript 的對象涵蓋全部的值,其次使得原始類型的值能夠方便地調用某些方法。
Number、String和Boolean若是不做爲構造函數調用(即調用時不加new),經常用於將任意類型的值轉爲數值、字符串和布爾值

Number(123) // 123
String('abc') // "abc"
Boolean(true) // true
複製代碼

3.3.1實例方法

3.3.1.1 valueOf()

valueOf方法返回包裝對象實例對應的原始類型的值。

new Number(123).valueOf()  // 123
new String('abc').valueOf() // "abc"
new Boolean(true).valueOf() // true
複製代碼

3.3.2原始類型與實例對象的自動轉換

原始類型的值,能夠自動看成對象調用,即調用各類對象的方法和參數。這時,JavaScript 引擎會自動將原始類型的值轉爲包裝對象實例,在使用後馬上銷燬實例。

好比,字符串能夠調用length屬性,返回字符串的長度。

'abc'.length // 3
複製代碼

上面代碼中,abc是一個字符串,自己不是對象,不能調用length屬性。JavaScript 引擎自動將其轉爲包裝對象,在這個對象上調用length屬性。調用結束後,這個臨時對象就會被銷燬。這就叫原始類型與實例對象的自動轉換。

3.4Number對象

Number對象是數值對應的包裝對象,能夠做爲構造函數使用,也能夠做爲工具函數使用。
做爲構造函數時,它用於生成值爲數值的對象。

var n = new Number(1);
typeof n // "object"
複製代碼

做爲工具函數時,它能夠將任何類型的值轉爲數值。

Number(true) // 1
複製代碼

3.4.1屬性

Number對象擁有如下一些屬性

Number.POSITIVE_INFINITY:正的無限,指向Infinity。
Number.NEGATIVE_INFINITY:負的無限,指向-Infinity。
Number.NaN:表示非數值,指向NaN。
Number.MAX_VALUE:表示最大的正數,相應的,最小的負數爲-Number.MAX_VALUE。
Number.MIN_VALUE:表示最小的正數(即最接近0的正數,在64位浮點數體系中爲5e-324),相應的,最接近0的負數爲-Number.MIN_VALUE。
Number.MAX_SAFE_INTEGER:表示可以精確表示的最大整數,即9007199254740991。
Number.MIN_SAFE_INTEGER:表示可以精確表示的最小整數,即-9007199254740991。
複製代碼

3.4.2實例方法

3.4.2.1 Number.prototype.toString()

toString方法能夠接受一個參數,表示輸出的進制。若是省略這個參數,默認將數值先轉爲十進制,再輸出字符串;不然,就根據參數指定的進制,將一個數字轉化成某個進制的字符串

10).toString() // "10"
(10).toString(2) // "1010"
(10).toString(8) // "12"
(10).toString(16) // "a"
複製代碼

上面代碼中,10必定要放在括號裏,這樣代表後面的點表示調用對象屬性。若是不加括號,這個點會被 JavaScript 引擎解釋成小數點,從而報錯
toString方法只能將十進制的數,轉爲其餘進制的字符串。若是要將其餘進制的數,轉回十進制,須要使用parseInt方法。

3.4.2.2 Number.prototype.toFixed()

toFixed方法先將一個數轉爲指定位數的小數,而後返回這個小數對應的字符串。

(10).toFixed(2) // "10.00"
10.005.toFixed(2) // "10.01"
複製代碼

3.4.2.3 Number.prototype.toExponential()

toExponential方法用於將一個數轉爲科學計數法形式。toExponential方法的參數是小數點後有效數字的位數

(10).toExponential()  // "1e+1"
(10).toExponential(1) // "1.0e+1"
(10).toExponential(2) // "1.00e+1"

(1234).toExponential()  // "1.234e+3"
(1234).toExponential(1) // "1.2e+3"
(1234).toExponential(2) // "1.23e+3"
複製代碼

3.4.2.4 Number.prototype.toPrecision()

toPrecision方法用於將一個數轉爲指定位數的有效數字。

(12.34).toPrecision(1) // "1e+1"
(12.34).toPrecision(2) // "12"
(12.34).toPrecision(3) // "12.3"
(12.34).toPrecision(4) // "12.34"
(12.34).toPrecision(5) // "12.340"
複製代碼

3.5 String對象

String對象是 JavaScript 原生提供的三個包裝對象之一,用來生成字符串對象。除了用做構造函數,String對象還能夠看成工具方法使用,將任意類型的值轉爲字符串

var s1 = 'abc';
var s2 = new String('abc');

typeof s1 // "string"
typeof s2 // "object"

s2.valueOf() // "abc"
複製代碼

字符串對象是一個僞數組

3.5.1 靜態方法

3.5.1.1 String.fromCharCode()

String對象提供的靜態方法(即定義在對象自己,而不是定義在對象實例的方法),主要是String.fromCharCode()。該方法的參數是一個或多個數值,表明 Unicode 碼點,返回值是這些碼點組成的字符串。

String.fromCharCode() // ""
String.fromCharCode(97) // "a"
String.fromCharCode(104, 101, 108, 108, 111)
// "hello"
複製代碼

3.5.2 實例屬性

3.5.2.1 String.prototype.length

字符串實例的length屬性返回字符串的長度。

'abc'.length // 3
複製代碼

3.5.2 實例方法

3.5.2.1 String.prototype.charAt()

charAt返回指定位置的字符,參數從0開始

'abc'.charAt(1) // "b"
'abc'[1] // "b"
複製代碼

3.5.2.2 String.prototype.concat()

concat用於鏈接兩個字符串,返回一個新字符串,不改變原字符串

var s1 = 'abc';
var s2 = 'def';
'a'.concat('b', 'c') // "abc"
s1.concat(s2) // "abcdef"
s1 // "abc"

複製代碼

3.5.2.3 String.prototype.slice()

slice方法用於從原字符串取出子字符串並返回,不改變原字符串。它的第一個參數是子字符串的開始位置,第二個參數是子字符串的結束位置(不含該位置)。

'JavaScript'.slice(0, 4) // "Java"
'JavaScript'.slice(4) // "Script"
'JavaScript'.slice(2, 1) // "" 若是第一個參數大於第二個參數,slice方法返回一個空字符串
複製代碼

3.5.2.4 String.prototype.substring()

substring方法用於從原字符串取出子字符串並返回,不改變原字符串,跟slice方法很相像。它的第一個參數表示子字符串的開始位置,第二個位置表示結束位置(返回結果不含該位置)。 不建議使用substring

'JavaScript'.substring(10, 4) // "Script"  
// 等同於  //若是第二個參數大於第一個參數,substring方法會自動更換兩個參數的位置
'JavaScript'.substring(4, 10) // "Script"

'Javascript'.substring(-3) // "JavaScript"
'JavaScript'.substring(4, -3) // "Java"
//若是參數是負數,substring方法會自動將負數轉爲0。

複製代碼

3.5.2.5 String.prototype.substr()

substr方法用於從原字符串取出子字符串並返回,不改變原字符串,跟slice和substring方法的做用相同。
substr方法的第一個參數是子字符串的開始位置(從0開始計算),第二個參數是子字符串的長度

'JavaScript'.substr(4, 6) // "Script"
複製代碼
相關文章
相關標籤/搜索