MDN文檔基礎知識搜集

Array數組,一種允許你存儲多個值在一個引用里的結構。var myVariable = [1,'Bob','Steve',10];
引用數組的元素只需:myVariable[0],?myVariable[1], 等等.

發布工具:?FTP?客戶端

你還需要一種將文件從本地硬盤上傳到遠程Web服務器的方法。 為了做到這一點,你必須使用FTP客戶端。

每個系統都包含一個FTP客戶端作為文件管理器的一部分。 Windows資源管理器,Nautilus(一個常見的Linux文件管理器)和Mac Finder都包含該功能。 然而,人們更經常選擇專門的FTP客戶端,可以存儲密碼并且并行顯示本地和遠程目錄。

如果你需要安裝一個FTP客戶端,這里有很多免費的選擇:例如, 可以全平臺使用的?FileZilla?, windows上使用的WinSCP?, Mac和 windows上都能使用的?Cyberduck?,還有很多)。

注意:還有其他方法可以在遠程服務器上發布內容,如rsync和git,但并不像FTP那樣簡單,我們不會在這里討論。(一定看git教程!!)

使用在線工具如 GitHub 或 Google App Engine

有一些工具能使你在線發布網站?:

  • GitHub?是一個“社交編程”網站。它允許你上傳代碼庫并儲存在?Git?版本控制系統里。?然后你可以協作代碼項目,系統是默認開源的,意味著世界上任何人都可以找到你 GitHub 上的代碼。去使用 GitHub,從中學習并且提高自己吧!?你也可以對別人的代碼那樣做! 這是一個非常重要、有用的社區,而且?Git/GitHub 是非常流行的?version control system?— 大部分科技公司在工作中使用它。?GitHub 有一個非常有用的特點叫?GitHub pages,允許你將網站代碼放在網上。
  • Google App Engine

不像大部分其它主機服務,這類工具通常是免費的,不過你只能使用有限的功能。

使用像 Thimble 的基于 Web 的集成開發環境

有許多web應用能夠仿真一個網站開發環境,允許你輸入 HTML、CSS 和 JavaScript 然后顯示代碼的結果 —— 全部在一個標簽頁里!通常這些工具都很簡單,對學習很有幫助,而且是免費的(基本功能),它們在一個獨特的地址顯示你提交的網頁。不過,基礎功能是很有限的,而且這些應用通常不提供如圖像的內容的主機空間。

使用一下以下幾種工具,看看你最喜歡哪一個:

  • JSFiddle
  • Thimble
  • JSBin
  • CodePen

?通過GitHub發布簡單。

現在,讓我們通過Github頁面告訴你公布的你的代碼是如此的

  1. 首先,?注冊一個GitHub賬號,?并確認你的郵箱地址。
  2. 接下來,你需要創建一個新的資源庫( repository )來存放你的文件。
  3. 在這個頁面上,在?Repository name?輸入框里輸入??username.github.io,username 是你的用戶名。比如,我們的朋友 bobsmith 會輸入??bobsmith.github.io。同時勾選?Initialize this repository with a README?,然后點擊?Create repository
  4. 然后,將你的網頁文件夾拖拽到你的資源庫( repository ),再點擊?Commit changes?。

    提示: 確保你的文件夾有一個?index.html?文件.

  5. 現在將你的瀏覽器轉到?username.github.io 來在線查看你的網站。比如,如果用戶名為chrisdavidmills, 請轉到?chrisdavidmills.github.io。

    提示: 你的網站可能需要幾分鐘的時間才能投入使用。 如果它不能立即工作,你可能需要等待幾分鐘,然后再試一次。

想要了解更多,請看?GitHub Pages Help.


關于變量命名的規則

你可以給你的變量賦任何你喜歡的名字,但有一些限制。 一般你應當堅持使用拉丁字符(0-9,a-z,A-Z)和下劃線字符。

  • 你不應當使用規則之外的其他字符,因為它們可能引發錯誤,或對國際用戶來說難以理解。
  • 變量名不要以下劃線開頭——?以下劃線開頭的被某些JavaScript設計為特殊的含義,因此可能讓人迷惑。
  • 變量名不要以數字開頭。這種行為是不被允許的,并且將引發一個錯誤。
  • 一個可靠的命名約定叫做?"小寫駝峰命名法",用來將多個單詞組在一起,小寫整個命名的第一個字母然后大寫剩下單詞的首字符。我們已經在文章中使用了這種命名方法。
  • 讓變量名直觀,它們描述了所包含的數據。不要只使用單一的字母/數字,或者長句。
  • 變量名大小寫敏感——因此myage與myAge是2個不同的變量。
  • 最后也是最重要的一點—— 你應當避免使用JavaScript的保留字給變量命名。保留字,即是組成JavaScript的實際語法的單詞!因此諸如?var,?function,?let和?for等,都不能被作為變量名使用。瀏覽器將把它們識別為不同的代碼項,因此你將得到錯誤。

Note: 你能從詞匯語法—關鍵字找到一個相當完整的保留關鍵字列表來避免使用關鍵字當作變量。

好的命名示例:

age
myAge
init
initialColor
finalOutputValue
audio1
audio2

差的命名示例:

1
a
_12
myage
MYAGE
var
Document
skjfndskjfnbdskjfb
thisisareallylongstupidvariablenameman

現在嘗試創建更多的變量,請將上面的指導泯記于心。


有用的字符串方法(記住,字符串本值是不可變的!,你要另外把變化后的值賦給新的變量)

數組(數組可變)

事件介紹

JavaScript事件代理

JavaScript 事件委托 以及jQuery對事件委托的支持

Event delegation

適合初學者的JavaScript面向對象

對象原型

JavaScript 中的繼承

使用JSON?

客戶端 Web API(未完!,翻譯!)

從服務器獲取數據

語法和數據類型

流程控制與錯誤處理

函數

箭頭函數


delete

delete操作符,刪除一個對象或一個對象的屬性或者一個數組中某一個鍵值。語法如下:

delete objectName;
delete objectName.property;
delete objectName[index];
delete property; // legal only within a with statement

objectName是一個對象名,property?是一個已經存在的屬性,index是數組中的一個已經存在的鍵值的索引值。

第四行的形式只在with聲明的狀態下是合法的, 從對象中刪除一個屬性。

你能使用?delete?刪除各種各樣的隱式聲明, 但是被var聲明的除外。

如果?delete?操作成功,屬性或者元素會變成?undefined。如果?delete可行會返回true,如果不成功返回false

x = 42;
var y = 43;
myobj = new Number();
myobj.h = 4;    // create property h
delete x;       // returns true (can delete if declared implicitly)
delete y;       // returns false (cannot delete if declared with var)
delete Math.PI; // returns false (cannot delete predefined properties)
delete myobj.h; // returns true (can delete user-defined properties)
delete myobj;   // returns true (can delete if declared implicitly)

?


void

void 運算符運用方法如下:

void (expression)
void expression

void運算符,表明一個運算沒有返回值。expression是javaScript表達式,括號中的表達式是一個可選項,當然使用該方式是一種好的形式。

你可以使用void運算符指明一個超文本鏈接。該表達式是有效的,但是并不會在當前文檔中進行加載。

如下創建了一個超鏈接文本,當用戶單擊該文本時,不會有任何效果。

<a href="javascript:void(0)">Click here to do nothing</a>

下面的代碼創建了一個超鏈接,當用戶單擊它時,提交一個表單。

<a href="javascript:void(document.form.submit())">
Click here to submit</a>

?

in

in操作符,如果所指定的屬性確實存在于所指定的對象中,則會返回true,語法如下:

propNameOrNumber in objectName

在這里?propNameOrNumber可以是一個代表著屬性名的字符串或者是一個代表著數組索引的數值表達式,而objectName則是一個對象名。

下面的例子是?in?操作的常見用法。

// Arrays
var trees = new Array("redwood", "bay", "cedar", "oak", "maple");
0 in trees;        // returns true
3 in trees;        // returns true
6 in trees;        // returns false
"bay" in trees;    // returns false (you must specify the index number,// not the value at that index)
"length" in trees; // returns true (length is an Array property)// Predefined objects
"PI" in Math;          // returns true
var myString = new String("coral");
"length" in myString;  // returns true// Custom objects
var mycar = {make: "Honda", model: "Accord", year: 1998};
"make" in mycar;  // returns true
"model" in mycar; // returns true

?

左值表達式

左值可以作為賦值的目標。

new

你可以使用new?operator?創建一個自定義類型或者是預置類型的對象實例。用法如下:

var objectName = new objectType([param1, param2, ..., paramN]);

super

super?關鍵字可以用來調用一個對象父類的函數,它在用來調用一個類的父類的構造函數時非常有用,比如:

super([arguments]); // calls the parent constructor. super.functionOnParent([arguments]);

?

擴展語句

擴展語句符允許一個表達式在原地展開, 當需要多個參數 (比如函數調用時) 或者多個值(比如字面量數組) 。

例如:現在你有一個數組,你想創建一個新數組,并將剛才那個作為它的一部分,用array的字面語法是不夠的,你不得不寫一些代碼實現它,比如用些push,?splice,?concat等等。但是用spread syntax就沒問題了:

var parts = ['shoulder', 'knees'];
var lyrics = ['head', ...parts, 'and', 'toes'];

類似的,擴展語句也可以用在函數調用的時候:

function f(x, y, z) { }
var args = [0, 1, 2];
f(...args);

數字對象

內置的Number對象有一些有關數字的常量屬性,如最大值、不是一個數字和無窮大的。你不能改變這些屬性,但可以按下邊的方式使用它們:

<span style="color:#333333"><code class="language-html">var biggestNum = Number.MAX_VALUE;
var smallestNum = Number.MIN_VALUE;
var infiniteNum = Number.POSITIVE_INFINITY;
var negInfiniteNum = Number.NEGATIVE_INFINITY;
var notANum = Number.NaN;</code></span>

你永遠只用從Number對象引用上邊顯示的屬性,而不是你自己創建的Number對象的屬性。

下面的表格匯總了數字對象的屬性:

數字的屬性

屬性描述
Number.MAX_VALUE可表示的最大值
Number.MIN_VALUE可表示的最小值
Number.NaN特指”非數字“
Number.NEGATIVE_INFINITY特指“負無窮”;在溢出時返回
Number.POSITIVE_INFINITY特指“正無窮”;在溢出時返回
Number.EPSILON

表示1和比最接近1且大于1的最小Number之間的差別

Number.MIN_SAFE_INTEGERJavaScript最小安全整數.
Number.MAX_SAFE_INTEGERJavaScript最大安全整數.
數字的方法
方法描述
Number.parseFloat()把字符串參數解析成浮點數,
和全局方法?parseFloat()?作用一致.
Number.parseInt()

把字符串解析成特定基數對應的整型數字,和全局方法?parseInt()?作用一致.

Number.isFinite()判斷傳遞的值是否為有限數字。
Number.isInteger()判斷傳遞的值是否為整數。
Number.isNaN()判斷傳遞的值是否為?NaN. More robust version of the original global?isNaN().
Number.isSafeInteger()判斷傳遞的值是否為安全整數。

數字的類型提供了不同格式的方法以從數字對象中檢索信息。以下表格總結了?數字類型原型上的方法。

數字類型原型上的一些方法
方法描述
toExponential()返回一個數字的指數形式的字符串,形如:1.23e+2
toFixed()

返回指定小數位數的表示形式,

var a=123,b=a.toFixed(2)//b="123.00"

toPrecision()

返回一個指定精度的數字。如下例子中,a=123中,3會由于精度限制消失

var a=123,b=a.toPrecision(2)//b="1.2e+2"


Math的方法

方法描述
abs()絕對值
sin(),?cos(),?tan()標準三角函數;參數為弧度
asin(),?acos(),?atan(),?atan2()反三角函數; 返回值為弧度
sinh(),?cosh(),?tanh()雙曲三角函數; 返回值為弧度.
asinh(),?acosh(),?atanh()反雙曲三角函數;返回值為弧度.

pow(),?exp(),?expm1(),?log10(),?log1p(),?log2()

指數與對數函數
floor(),?ceil()返回最大/最小整數小于/大于或等于參數
min(),?max()

?

返回一個以逗號間隔的數字參數列表中的較小或較大值(分別地)

random()返回0和1之間的隨機數。
round(),?fround(),?trunc(),四舍五入和截斷函數
sqrt(),?cbrt(),?hypot()

平方根,立方根,平方參數的和的平方根?

兩個參數平方和的平方根

sign()數字的符號, 說明數字是否為正、負、零。
clz32(),
imul()

在32位2進制表示中,開頭的0的數量.

返回傳入的兩個參數相乘結果的類C的32位表現形式

和其他對象不同,你不能夠創建一個自己的Math對象。你只能使用內置的Math對象。

?


日期對象

JavaScript沒有日期數據類型。但是你可以在你的程序里使用?Date?對象和其方法來處理日期和時間。Date對象有大量的設置、獲取和操作日期的方法。?它并不含有任何屬性。

JavaScript 處理日期數據類似于Java。這兩種語言有許多一樣的處理日期的方法,也都是以1970年1月1日00:00:00以來的毫秒數來儲存數據類型的。

Date?對象的范圍是相對距離 UTC 1970年1月1日 的前后 100,000,000 天。

創建一個日期對象:

<span style="color:#333333"><code class="language-html">var dateObjectName = new Date([parameters]);</code></span>

這里的 dateObjectName 對象是所創建的Date對象的一個名字,它可以成為一個新的對象或者已存在的其他對象的一個屬性。

不使用?new?關鍵字來調用Date對象將返回當前時間和日期的字符串

前邊的語法中的參數(parameters)可以是一下任何一種:

  • 無參數 : 創建今天的日期和時間,例如:?today = new Date();.
  • 一個符合以下格式的表示日期的字符串: "月 日, 年?時:分:秒." 例如:?var Xmas95 = new Date("December 25, 1995 13:30:00")。如果你省略時、分、秒,那么他們的值將被設置為0。
  • 一個年,月,日的整型值的集合,例如:?var Xmas95 = new Date(1995, 11, 25)。
  • 一個年,月,日,時,分,秒的集合,例如:?var Xmas95 = new Date(1995, 11, 25, 9, 30, 0);.

Date對象的方法

處理日期時間的Date對象方法可分為以下幾類:

  • "set" 方法, 用于設置Date對象的日期和時間的值。
  • "get" 方法,用于獲取Date對象的日期和時間的值。
  • "to" 方法,用于返回Date對象的字符串格式的值。
  • parse 和UTC 方法, 用于解析Date字符串。

通過“get”和“set”方法,你可以分別設置和獲取秒,分,時,日,星期,月份,年。這里有個getDay方法可以返回星期,但是沒有相應的setDay方法用來設置星期,因為星期是自動設置的。這些方法用整數來代表以下這些值:

  • 秒,分:?0 至?59
  • 時:?0 至?23
  • 星期:?0 (周日) 至?6 (周六)
  • 日期:1 至?31?
  • 月份:?0 (一月) to 11 (十二月)
  • 年份:?從1900開始的年數

例如, 假設你定義了如下日期:

var Xmas95 = new Date("December 25, 1995");

Then?Xmas95.getMonth()?返回 11, and?Xmas95.getFullYear()?返回 1995.

getTime?和?setTime?方法對于比較日期是非常有用的。getTime方法返回從1970年1月1日00:00:00的毫秒數。

例如,以下代碼展示了今年剩下的天數:

var today = new Date();
var endYear = new Date(1995, 11, 31, 23, 59, 59, 999); // 設置日和月,注意,月份是0-11
endYear.setFullYear(today.getFullYear()); // 把年設置為今年
var msPerDay = 24 * 60 * 60 * 1000; // 每天的毫秒數
var daysLeft = (endYear.getTime() - today.getTime()) / msPerDay;
var daysLeft = Math.round(daysLeft); //返回今年剩下的天數

這個例子中,創建了一個包含今天的日期的Date對象,并命名為today,然后創建了一個名為endYear的Date對象,并把年份設置為當前年份,接著使用每天的毫秒數和getTime分別獲取今天和年底的毫秒數,計算出了今天到年底的天數,最后四舍五入得到今年剩下的天數。

parse方法對于從日期字符串賦值給現有的Date對象很有用,例如:以下代碼使用parse和setTime分配了一個日期值給IPOdate對象:

var IPOdate = new Date();
IPOdate.setTime(Date.parse("Aug 9, 1995"));

例子:

在下邊的例子中,JSClock()函數返回了用數字時鐘格式的時間:

function JSClock() {var time = new Date();var hour = time.getHours();var minute = time.getMinutes();var second = time.getSeconds();var temp = "" + ((hour > 12) ? hour - 12 : hour);if (hour == 0)temp = "12";temp += ((minute < 10) ? ":0" : ":") + minute;temp += ((second < 10) ? ":0" : ":") + second;temp += (hour >= 12) ? " P.M." : " A.M.";return temp;
}

JSClock函數首先創建了一個叫做time的新的Date對象,因為沒有參數,所以time代表了當前日期和時間。然后調用了getHours,?getMinutes以及getSeconds方法把當前的時分秒分別賦值給了hour,?minute,second。

接下來的4句在time的基礎上創建了一個字符串,第一句創建了一個變量temp,并通過一個條件表達式進行了賦值,如果小時大于12,就為?(hour - 12), 其他情況就為 hour, 除非 hour 為?0, 這種情況下,它會變成 12.

接下來的語句拼接了minute的值到temp后。如果minute小于10,條件表達式就會在minute前邊加個0,其他情況下加一個分號。然后按同樣的方式在temp后拼接上了秒。

最后,如果hour是12或者更大,條件表達式會在temp后拼接"P.M.",否則拼接"A.M." 。

?


國際化轉換時間及日期(Intl.DateTimeFormat是根據語言來格式化日期和時間的對象的構造器)

國際化數字轉換(Intl.NumberFormat是對語言敏感的格式化數字類的構造器類

字符串


String對象方法

方法 描述 charAt,?charCodeAt,?codePointAt 返回字符串指定位置的字符或者字符編碼。 indexOf,?lastIndexOf 分別返回字符串中指定子串的位置或最后位置。 startsWith,?endsWith,?includes 返回字符串是否以指定字符串開始、結束或包含指定字符串。 concat 連接兩個字符串并返回新的字符串。 fromCharCode,?fromCodePoint 從指定的Unicode值序列構造一個字符串。這是一個String類方法,不是實例方法。 split 通過將字符串分離成一個個子串來把一個String對象分裂到一個字符串數組中。 slice 從一個字符串提取片段并作為新字符串返回。 substring,?substr 分別通過指定起始和結束位置,起始位置和長度來返回字符串的指定子集。 match,?replace,?search 通過正則表達式來工作. toLowerCase,?toUpperCase

分別返回字符串的小寫表示和大寫表示。

normalize 按照指定的一種 Unicode 正規形式將當前字符串正規化。 repeat 將字符串內容重復指定次數后返回。 trim 去掉字符串開頭和結尾的空白字符。


多行模板字符串

模板字符串是一種允許內嵌表達式的String字面值. 可以用它實現多行字符串或者字符串內插等特性.

模板字符串使用反勾號 (` `) (grave accent) 包裹內容而不是單引號或雙引號. 模板字符串可以包含占位符. 占位符用美元符號和花括號標識 (${expression}).

多行

源代碼中插入的任何新行開始字符都作為模板字符串的內容. 使用一般的字符串時, 為了創建多行的字符串不得不用如下語法:

console.log("string text line 1\n\
string text line 2");
// "string text line 1
// string text line 2"

為了實現同樣效果的多行字符串, 現在可以寫成如下形式:

console.log(`string text line 1
string text line 2`);
// "string text line 1
// string text line 2"

嵌入表達式

為了在一般的字符串中嵌入表達式, 需要使用如下語法:

var a = 5;
var b = 10;
console.log("Fifteen is " + (a + b) + " and\nnot " + (2 * a + b) + ".");
// "Fifteen is 15 and
// not 20."

現在, 使用模板字符串, 可以使用語法糖讓類似功能的實現代碼更具可讀性:

var a = 5;
var b = 10;
console.log(`Fifteen is ${a + b} and\nnot ${2 * a + b}.`);
// "Fifteen is 15 and
// not 20."

更多信息, 請閱讀?JavaScript reference?中的?Template strings。


索引集合類 (Indexed collections)

?

數組的方法(array methods)

Array?對象具有下列方法:

concat()?連接兩個數組并返回一個新的數組。

var myArray = new Array("1", "2", "3");
myArray = myArray.concat("a", "b", "c"); 
// myArray is now ["1", "2", "3", "a", "b", "c"]

join(deliminator = ',')?將數組的所有元素連接成一個字符串。

var myArray = new Array("Wind", "Rain", "Fire");
var list = myArray.join(" - "); // list is "Wind - Rain - Fire"

push()?在數組末尾添加一個或多個元素,并返回數組操作后的長度。

var myArray = new Array("1", "2");
myArray.push("3"); // myArray is now ["1", "2", "3"]

pop()?從數組移出最后一個元素,并返回該元素。

var myArray = new Array("1", "2", "3");
var last = myArray.pop(); 
// myArray is now ["1", "2"], last = "3"

shift()?從數組移出第一個元素,并返回該元素。

var myArray = new Array ("1", "2", "3");
var first = myArray.shift(); 
// myArray is now ["2", "3"], first is "1"

unshift()?在數組開頭添加一個或多個元素,并返回數組的新長度。

var myArray = new Array ("1", "2", "3");
myArray.unshift("4", "5"); 
// myArray becomes ["4", "5", "1", "2", "3"]

slice(start_index, upto_index)?從數組提取一個片段,并作為一個新數組返回。

var myArray = new Array ("a", "b", "c", "d", "e");
myArray = myArray.slice(1, 4); // starts at index 1 and extracts all elements// until index 3, returning [ "b", "c", "d"]

splice(index, count_to_remove, addElement1, addElement2, ...)從數組移出一些元素,(可選)并替換它們。

var myArray = new Array ("1", "2", "3", "4", "5");
myArray.splice(1, 3, "a", "b", "c", "d"); 
// myArray is now ["1", "a", "b", "c", "d", "5"]
// This code started at index one (or where the "2" was), 
// removed 3 elements there, and then inserted all consecutive
// elements in its place.

reverse()?顛倒數組元素的順序:第一個變成最后一個,最后一個變成第一個。

var myArray = new Array ("1", "2", "3");
myArray.reverse(); 
// transposes the array so that myArray = [ "3", "2", "1" ]

sort()?給數組元素排序。

var myArray = new Array("Wind", "Rain", "Fire");
myArray.sort(); 
// sorts the array so that myArray = [ "Fire", "Rain", "Wind" ]

sort()?也可以帶一個回調函數來決定怎么比較數組元素。這個回調函數比較兩個值,并返回3個值中的一個:

例如,下面的代碼通過字符串的最后一個字母進行排序:

var sortFn = function(a, b){if (a[a.length - 1] < b[b.length - 1]) return -1;if (a[a.length - 1] > b[b.length - 1]) return 1;if (a[a.length - 1] == b[b.length - 1]) return 0;
}
myArray.sort(sortFn); 
// sorts the array so that myArray = ["Wind","Fire","Rain"]
  • 如果 a 小于 b ,返回 -1(或任何負數)
  • 如果?a?大于?b?,返回 1 (或任何正數)
  • 如果?a?和?b?相等,返回?0。

indexOf(searchElement[, fromIndex])?在數組中搜索searchElement?并返回第一個匹配的索引。

var a = ['a', 'b', 'a', 'b', 'a'];
console.log(a.indexOf('b')); // logs 1
// Now try again, starting from after the last match
console.log(a.indexOf('b', 2)); // logs 3
console.log(a.indexOf('z')); // logs -1, because 'z' was not found

lastIndexOf(searchElement[, fromIndex])?和?indexOf 差不多,但這是從結尾開始,并且是反向搜索。

var a = ['a', 'b', 'c', 'd', 'a', 'b'];
console.log(a.lastIndexOf('b')); // logs 5
// Now try again, starting from before the last match
console.log(a.lastIndexOf('b', 4)); // logs 1
console.log(a.lastIndexOf('z')); // logs -1

forEach(callback[, thisObject])?在數組每個元素項上執行callback

var a = ['a', 'b', 'c'];
a.forEach(function(element) { console.log(element);} ); 
// logs each item in turn

map(callback[, thisObject])?在數組的每個單元項上執行callback函數,并把返回包含回調函數返回值的新數組(譯者注:也就是遍歷數組,并通過callback對數組元素進行操作,并將所有操作結果放入數組中并返回該數組)。

var a1 = ['a', 'b', 'c'];
var a2 = a1.map(function(item) { return item.toUpperCase(); });
console.log(a2); // logs A,B,C

filter(callback[, thisObject])?返回一個包含所有在回調函數上返回為true的元素的新數組(譯者注:callback在這里擔任的是過濾器的角色,當元素符合條件,過濾器就返回true,而filter則會返回所有符合過濾條件的元素)。

var a1 = ['a', 10, 'b', 20, 'c', 30];
var a2 = a1.filter(function(item) { return typeof item == 'number'; });
console.log(a2); // logs 10,20,30

every(callback[, thisObject])?當數組中每一個元素在callback上被返回true時就返回true(譯者注:同上,every其實類似filter,只不過它的功能是判斷是不是數組中的所有元素都符合條件,并且返回的是布爾值)。

function isNumber(value){return typeof value == 'number';
}
var a1 = [1, 2, 3];
console.log(a1.every(isNumber)); // logs true
var a2 = [1, '2', 3];
console.log(a2.every(isNumber)); // logs false

some(callback[, thisObject])?只要數組中有一項在callback上被返回true,就返回true(譯者注:同上,類似every,不過前者要求都符合篩選條件才返回true,后者只要有符合條件的就返回true)。

function isNumber(value){return typeof value == 'number';
}
var a1 = [1, 2, 3];
console.log(a1.some(isNumber)); // logs true
var a2 = [1, '2', 3];
console.log(a2.some(isNumber)); // logs true
var a3 = ['1', '2', '3'];
console.log(a3.some(isNumber)); // logs false

以上方法都帶一個被稱為迭代方法的的回調函數,因為他們以某種方式迭代整個數組。都有一個可選的第二參數?thisObject,如果提供了這個參數,thisObject?變成回調函數內部的 this 關鍵字的值。如果沒有提供,例如函數在一個顯示的對象上下文外被調用時,this 將引用全局對象(window).

實際上在調用回調函數時傳入了3個參數。第一個是當前元素項的值,第二個是它在數組中的索引,第三個是數組本身的一個引用。?JavaScript 函數忽略任何沒有在參數列表中命名的參數,因此提供一個只有一個參數的回調函數是安全的,例如?alert?。

reduce(callback[, initialValue])?使用回調函數?callback(firstValue, secondValue)?把數組列表計算成一個單一值(譯者注:他數組元素兩兩遞歸處理的方式把數組計算成一個值)

var a = [10, 20, 30];
var total = a.reduce(function(first, second) { return first + second; }, 0);
console.log(total) // Prints 60

reduceRight(callback[, initalvalue])?和?reduce()相似,但這從最后一個元素開始的。

reduce?和?reduceRight?是迭代數組方法中最不被人熟知的兩個函數.。他們應該使用在那些需要把數組的元素兩兩遞歸處理,并最終計算成一個單一結果的算法。

使用類數組對象(array-like objects)

一些 JavaScript 對象, 例如?document.getElementsByTagName()?返回的?NodeList?或者函數內部可用的?arguments?對象,他們表面上看起來,外觀和行為像數組,但是不共享他們所有的方法。arguments?對象提供一個?length?屬性,但是不實現?forEach()?方法, 例如:

Array的原生(prototype)方法可以用來處理類似數組行為的對象,例如: :

function printArguments() {Array.prototype.forEach.call(arguments, function(item) {console.log(item);});
}

Array的常規方法也可以用于處理字符串,因為它提供了序列訪問字符轉為數組的簡單方法:

Array.prototype.forEach.call("a string", function(chr) {console.log(chr);
});

數組和正則表達式

當一個數組作為字符串和正則表達式的匹配結果時,該數組將會返回相關匹配信息的屬性和元素。?RegExp.exec(),?String.match()?和?String.split()?的返回值是一個數組。?使用數組和正則表達式的的更多信息, 請看?Regular Expressions.


帶鍵的集合

使用對象

對象模型的細節

繼承與原型鏈

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/251379.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/251379.shtml
英文地址,請注明出處:http://en.pswp.cn/news/251379.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

vue-cli生成項目時你應當知道的

一、安裝 npm install -g vue-cli二、創建項目 vue init 模板名 項目名 vue init webpack mymall模板名: 1 . webpack 最常用 2 . webpack-simple // 一個簡單webpackvue-loader的模板&#xff0c;不包含其他功能。 3 . browserify // 一個全面的Browserifyvueify 的模板&am…

es6 --- 正確獲取Generator函數內部的this對象使其可以使用new

首先看2個例子 function * g() {this.a 11; }let o g(); console.log(o.a);可以看見Generator函數里面的this指向的對象取不出來. 再看下一個例子: function* F() {yield this.x 2;yield this.y 3; } new F();可以看出Generator函數無法使用new操作符, 下面一共一個解決…

mysql三-3:完整性約束

閱讀目錄 一 介紹二 not null與default三 unique四 primary key五 auto_increment六 foreign key七 作業一 介紹 約束條件與數據類型的寬度一樣&#xff0c;都是可選參數 作用&#xff1a;用于保證數據的完整性和一致性主要分為&#xff1a; PRIMARY KEY (PK) 標識該字段為該…

LOL

[分享] 從《LOL》談游戲中的隨機動作優化 http://bbs.gameres.com/thread_472292.html 光子工作室陳宇復盤《全民突擊》研發歷程&#xff08;完整版&#xff09; https://mp.weixin.qq.com/s?__bizMjM5OTc2ODUxMw&mid400110877&idx2&sn372fd6492a9d8dd1791d87eb2c…

超級簡易法上傳本地文件到github上

之前文章寫過廖雪峰老師關于git教程的帖子&#xff0c;現在終于有時間實踐了&#xff01;我這段時間在學微信小程序版的貪吃蛇&#xff0c; 想著先把寫好的文件上傳試試&#xff0c;于是乎&#xff0c;便有了如下…… 大家要是不想聽廢話可以拉到最后去…… 1、我先在github…

es6 --- 對任意對象部署可遍歷接口

有時候需要對對象進行遍歷,下面提供一個比較方便的接口, 其基本思路是,首先得到對象的所有鍵(key), 然后將其放在yield* 后面. yield* 可以通過 for … of … 循環遍歷 具體實現如下: function* iterEntries (obj) {let keys Object.keys(obj);for ( let i 0; i < keys.…

element-ui表單驗證:用戶名、密碼、電話、郵箱

之前設計login組件時增加了簡單的表單驗證&#xff0c;因此對應的users組件&#xff0c;添加用戶功能也必須設置相應的驗證規則。 文檔form表單驗證只提供了用戶名/密碼&#xff0c;是否必須/長度限制的驗證。對于電話、郵箱和地址的驗證如下&#xff1a; html部分&#xff0c…

composer(作曲家)安裝php-ml

剛開始我用的是up5.6版本php命令安裝composer 后來使用composer時發現命令行會提示php版本太低 于是我下載了wamp&#xff0c;使用7.1版本的php重新安裝了composer&#xff0c;因為php-ml要求必須是7.1版本 在安裝的時候有一些問題&#xff0c;那就是安裝不成功&#xff0c;并沒…

前端解析返回的對象時json顯示$ref問題的解決

在mapper中寫的語句&#xff0c;結果集中association&#xff0c;采用的一個對象&#xff0c;整個list列表中每個元素有一個對象元素&#xff0c;如果第二個元素中有一個與第一個元素中對象同名的&#xff0c;就會去引用上一個元素的地址&#xff0c;在json前臺解析的時候就不會…

Uncaught TypeError: Cannot redefine property: $router

原因&#xff1a;就如報錯提示所描述的&#xff0c;不能重新定義router&#xff0c;說明是重復定了router&#xff0c;說明是重復定了router&#xff0c;說明是重復定了router。通常是因為在項目中安裝了vue-router的依賴并且用Vue.use()使用了vue-router&#xff0c;還在index…

微信小程序模仿開眼視頻app(一)——視頻首頁、視頻詳情、分類

可到我的github賬號上去copy文件 先展示一下我實現了的功能吧 提示&#xff0c;如果有出現無法加載域名之類問題的的&#xff0c;可以在“設置”-“項目設置”-打鉤“不校驗合法域名……”&#xff1b; 或者直接登錄自己的微信小程序后臺設置域名信息 首頁部分&#xff1a; 1…

es6 --- Thunkify源碼分析

首先看一個例子:讀取package.json下的文件,并將讀取的數據(若讀取失敗)打印出來 // 導入fs和thunkify模塊 var thunkify require(thunkify); var fs require(fs);// 定義讀取文件的函數read var read thunkify(fs.readFile);// 調用read函數讀取package.json下的文件.并對數…

(轉)C# WebApi 身份認證解決方案:Basic基礎認證

原文地址&#xff1a;http://www.cnblogs.com/landeanfen/p/5287064.html 閱讀目錄 一、為什么需要身份認證二、Basic基礎認證的原理解析 1、常見的認證方式2、Basic基礎認證原理三、Basic基礎認證的代碼示例 1、登錄過程2、/Home/Index主界面3、WebApiCORS驗證部分&#xff08…

commit之后,想撤銷commit

git reset --soft HEAD^轉載于:https://www.cnblogs.com/gjack/p/9271556.html

ZNZD平臺vue項目

一、安裝配置node.js 1.1 配置企業級軟件倉庫 1&#xff09;首先用的是Nexus Repository Manager搭建npm私服&#xff1b;&#xff08;待補充&#xff09; 2&#xff09;項目使用修改.npmrc文件來修改源 現在需要做的就是修改源&#xff01;采取配置npmrc文件的方式&#x…

微信小程序模仿開眼視頻app(二)——搜索功能

微信小程序模仿開眼視頻app&#xff08;一&#xff09;有介紹首頁、視頻詳情和分類部分 可到我的github賬號上去copy文件 搜索部分 一開始沒想要設置歷史記錄啊、熱門搜索啊這些的&#xff0c;只是想把搜索框弄好看一點&#xff0c;無意中發現了微信官方ui庫&#xff1a;weu…

es6 --- Thunk函數的作用

首先了解一下javascript里面的Thunk函數的含義:將多參數函數,替換成一個只接受回調函數作為參數的單參數函數 // 一個具體的例子// 正常版本的readFile(多參數函數) fs.readFile(filename, callback);// Thunk版本的readFile(單參數版本) var Thunk function (fileName) {ret…

設計模式(六)------設計模式六大原則(5):迪米特法則

轉載自&#xff1a;http://www.jianshu.com/p/14589fb6978e &#xff08;作者簡書&#xff1a;涅槃1992&#xff09; 揭秘迪米特法則 迪米特法則&#xff08;Law of demeter,縮寫是LOD&#xff09;要求&#xff1a;一個對象應該對其他對象保持最少了解&#xff0c; 通縮的講就是…

http://www.cda.cn/view/25735.html

通過實例淺析Python對比C語言的編程思想差異 我一直使用 Python&#xff0c;用它處理各種數據科學項目。 Python 以易用聞名。有編碼經驗者學習數天就能上手&#xff08;或有效使用它&#xff09;。 聽起來很不錯&#xff0c;不過&#xff0c;如果你既用 Python&#xff0c;同時…

前端知識點梳理(一)

一、HTML 1. meta標簽 記住2個屬性&#xff1a;name和http-equiv name&#xff1a;描述網頁 <meta name"參數" content"具體的描述">http-equiv&#xff1a;文件頭 HTML中的meta標簽及其使用方法 二、CSS 1. css實現水平居中的幾種方式 css實…