《廖雪峰JavaScript-快速入門》筆記

caozhijian 發布于2019-08-23 16:54 / 1426人閱讀

摘要：文章內容來源廖雪峰快速入門賦值注釋數據類型不區分整數和浮點數，統一用表示。條件判斷使用來進行條件判斷。最新的規范引入了新的數據類型，是一組鍵值對的結構，具有極快的查找速度。一個數組實際上也是一個對象，它的每個元素的索引被視為一個屬性。

文章內容來源：廖雪峰JavaScript-快速入門

賦值

var x = 1;

注釋

// comment
/* comment */

數據類型 Number

JavaScript不區分整數和浮點數，統一用Number表示。

123;
0.456;
1.2345e3;
NaN;
Infinity;

字符串

字符串是以單引號"或雙引號"括起來的任意文本。

"Hello ";
"World!";

布爾

一個布爾值只有true、false兩種值。

數組

JavaScript的數組可以包括任意數據類型。

[1, 2, 3.14, "Hello", null, true];

對象

JavaScript的對象是一組由鍵-值組成的無序集合，對象的鍵都是字符串類型，值可以是任意數據類型。

var mi = {
  name: "YuMi",
  age: 22
}

要獲取一個對象的屬性，我們用對象變量.屬性名的方式：

mi.name;
mi.age;

變量名

變量名是大小寫英文、數字、$和_的組合，且不能用數字開頭。

條件判斷

JavaScript使用if () { ... } else { ... }來進行條件判斷。

循環 for

for(var i = 0; i < arr.length; i++) {
  x = arr[i];
  console.log(x);
}

for...in

for循環的一個變體是for ... in循環，它可以把一個對象的所有屬性依次循環出來：

var mi = {
  name: "YuMi",
  age: 22
};
for (var key in mi) {
  console.log(key); // "name", "age", ...
}

要過濾掉對象繼承的屬性，用hasOwnProperty()來實現。

var mi = {
    name: "YuMi",
    age: 22
};
for (var key in mi) {
  if(mi.hasOwnProperty(key)) {
    console.log(key); // "name", "age"
  }
}

for ... in循環可以直接循環出Array的索引。

var a = ["A", "B", "C"];
for (var i in a) {
  // 得到的 i 是 String 而不是 Number 。
  console.log(i); // "0", "1", "2"
  console.log(a[i]); // "A", "B", "C"
}

while/do...while

略。

Map/Set Map

最新的ES6規范引入了新的數據類型Map，Map是一組鍵值對的結構，具有極快的查找速度。

初始化Map需要一個二維數組：

var m = new Map([["Michael", 95], ["Bob", 75], ["Tracy", 85]]);
m.get("Michael"); // 95

或者直接初始化一個空Map：

var m = new Map(); // 空Map
m.set("Adam", 67); // 添加新的key-value
m.set("Bob", 59);
m.has("Adam"); // 是否存在key "Adam": true
m.get("Adam"); // 67
m.delete("Adam"); // 刪除key "Adam"
m.get("Adam"); // undefined

多次對一個key放入value，后面的值會把前面的值沖掉。

Set

Set和Map類似，也是一組key的集合，但不存儲value。

要創建一個Set，需要提供一個Array作為輸入，或者直接創建一個空Set：

var s1 = new Set(); // 空Set
var s2 = new Set([1, 2, 3]); // 含1, 2, 3
s2.add(4);
s2.delete(3);

iterable

為了統一集合類型，ES6標準引入了新的iterable類型，Array、Map和Set都屬于iterable類型。

具有iterable類型的集合可以通過新的for ... of循環來遍歷。

for ... in循環由于歷史遺留問題，它遍歷的實際上是對象的屬性名稱。一個Array數組實際上也是一個對象，它的每個元素的索引被視為一個屬性。

var a = ["A", "B", "C"];
a.name = "Hello";
for (var x in a) {
    console.log(x); // "0", "1", "2", "name"
}

for ... of循環則完全修復了這些問題，它只循環集合本身的元素：

var a = ["A", "B", "C"];
a.name = "Hello";
for (var x of a) {
    console.log(x); // "A", "B", "C"
}

更好的方式是直接使用iterable內置的forEach方法，它接收一個函數，每次迭代就自動回調該函數：

var a = ["A", "B", "C"];
a.forEach(function (element, index, array) {
    // element: 指向當前元素的值
    // index: 指向當前索引
    // array: 指向Array對象本身
    console.log(element + ", index = " + index);
});

Set與Array類似，但Set沒有索引，因此回調函數的前兩個參數都是元素本身：

var s = new Set(["A", "B", "C"]);
s.forEach(function (element, sameElement, set) {
    console.log(element);
});

Map的回調函數參數依次為value、key和map本身：

var m = new Map([[1, "x"], [2, "y"], [3, "z"]]);
m.forEach(function (value, key, map) {
    console.log(value);
});

個人靜態博客：

氣泡的前端日記： https://rheabubbles.github.io

GPU云服務器云服務器廖雪峰廖雪峰python python廖雪峰 python 廖雪峰

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/103497.html

Python初學者的資源總結

摘要：圖文教程教程廖雪峰的編程教室微信公眾號快速教程零基礎學，地址老齊學習筆記第二版個人點評我是跟著的編程教室的微信公眾號每天學習一課來學習的，當時的動力是據說女神也在學完習，后來也看過廖雪峰老師的教程，和老齊的沒有看過。之前看到了汪汪汪不是我的語言在喵在野的基礎上寫的這篇文章《Python 零基礎入門資料整理（更新版）》，感覺實在是太簡陋了。雖說是針對初學者的Python零基礎入...

AJie 2019-07-24 17:57 評論0 收藏0
PHPer書單

摘要：想提升自己，還得多看書多看書多看書下面是我收集到的一些程序員應該看得書單及在線教程，自己也沒有全部看完。共勉吧當然，如果你有好的書想分享給大家的或者覺得書單不合理，可以去通過進行提交。講師溫銘，軟件基金會主席，最佳實踐作者。想提升自己，還得多看書！多看書！多看書！下面是我收集到的一些PHP程序員應該看得書單及在線教程，自己也沒有全部看完。共勉吧！當然，如果你有好的書想分享給大家的或者...

jimhs 2019-07-01 12:35 評論0 收藏0
入門級前端開發可能需要的安利列表

摘要：開發篇版本管理工具，無腦的視圖操作，功能強大并且支持多賬號點我跳轉網站篇學習最重要的是經常百度，要始終堅信著你的水平能遇到的坑，別人都幫你踩過了。另外就是開發過程多看文檔，很多問題文檔都會有相關的解決方案，多看幾次就能想到解決方法。 IDE篇程序員最重要的的就是IDE了，一個好的IDE可以幫你省略大量的時間，以及少生很多悶氣，下面開始前端的IDE推薦： VSCode 最推薦的IDE...

Flands 2019-08-22 18:28 評論0 收藏0
前端資源分享-只為更好前端

摘要：一團隊組織網站說明騰訊團隊騰訊前端團隊，代表作品，致力于前端技術的研究騰訊社交用戶體驗設計，簡稱，騰訊設計團隊網站騰訊用戶研究與體驗設計部百度前端研發部出品淘寶前端團隊用技術為體驗提供無限可能凹凸實驗室京東用戶體驗設計部出品奇舞團奇虎旗下前一、團隊組織網站說明騰訊 AlloyTeam 團隊騰訊Web前端團隊，代表作品WebQQ，致力于前端技術的研究 ISUX 騰...

zxhaaa 2019-08-22 16:11 評論0 收藏0