Javascript基礎惡補

来源:http://www.cnblogs.com/darrenji/archive/2016/02/26/5220379.html
-Advertisement-
Play Games

1、字元集:Javascript採用Unicode字元集,支持地球上所有在用的語言。2、區分大小寫:Javascript區分大小寫,HTML不區分大小寫。3、空格、換行、格式控制符:Javascript忽略空格、換行,可以採用整齊、一致的縮進來形成統一的編碼風格。4、Unicode轉義序列:使用6個


 

1、字元集:
Javascript採用Unicode字元集,支持地球上所有在用的語言。

2、區分大小寫:
Javascript區分大小寫,HTML不區分大小寫。

3、空格、換行、格式控制符:
Javascript忽略空格、換行,可以採用整齊、一致的縮進來形成統一的編碼風格。

4、Unicode轉義序列:
使用6個ASCII字元來代表任意16位Unicode內碼。這些Unicode轉義序列均以\u為首碼,後跟4個十六進位數。

5、註釋:
//單行註釋的一種方式
/*單行註釋的另一種方式*/

/*
多行註釋
多行註釋
*/


6、直接量
程式中直接能使用的值
1,2.1,"hello",true,null等

7、標識符
用來對變數或函數進行命名
以字母、_,$開頭

8、保留字
也就是關鍵字,程式中不能使用Javascript中的預設關鍵字
比如break, delete, function, return, etc

9、可選的分號
如果語句獨占一行,其後的分號可以省略。

■ 類型、值和變數

10、數據類型
能夠表示並被操作的類型稱作數據類型。

11、變數
用來標識值得符號名稱,可以通過變數獲得值得引用。

12、數據類型
原始類型primitive type和對象類型object type。
數字、布爾值、數字是原始類型。
null和undefined是兩個特殊的原始類型。
對象是屬性的鍵值對集合。
數組array是特殊的對象,定義了專用的語法。
函數也是特殊的對象,函數可看作相關聯的可執行代碼。

13、構造函數
使用new新建對象,稱為構造函數。
構造函數定義的對象可以看作是一個類。
構造函數用來初始化對象。

14、系統預設類
Date代表日期的類。
RegExp表示正則表達式的類。
Error表示處理錯誤的類。

15、記憶體管理機制
解釋器有自己的垃圾回收機制。
當不再有任何引用指向一個對象,自動回收占用的記憶體資源。

16、可變類型和不可變類型
不可變類型值不可以修改,可變類型值可以修改。
對象和數組屬於可變類型。
數字、布爾值、null和undefined屬於不可變類型。
字元串雖然可以看作是字元數組,但它是一個不可變類型。

17、數據類型轉換
可以自由地進行數據類型轉換。
在期望使用字元串的地方使用數字,會將數字自動轉換成字元串。

18、變數是無類型的
變數可以被賦予任何類型的值
同樣一個變數可以重新賦予不同類型的值
全局變數和函數內變數

19、整型直接量
● 十進位整型直接量
● 十六進位整型直接量,即以16為基數,以"0x"或"0X"開頭,a-f或A-F表示10-15,比如0xff,就相當於15*16 + 15 = 255
● 有些支持八進位,以0開頭,推薦不使用

20、浮點型直接量
● 包含整數部分、小數點、小數部分
● 還可以用指數計數法表示浮點,即在實數後跟字母e或E,3.02e23,表示3.02*10的23次方

21、算術運算符
● +, -, *, /,%
● Math對象
Math.pow(2,5) 2的5次冪
Math.round(.6) 四捨五入
Math.ceil(.6)向上求整
Math.floor(.6)向下求整
Math.abs(-2)絕對值
Math.max(x, y, z)
Math.min(x, y)
Math.random()0和1之間的隨機數
Math.PI
Math.E 自然對數的底數e
Math.sqrt(3)平方根
Math.pow(3, 1/3)立方根
Math.sin(0), Math.cos, Math.atan
Math.log(10) 10的自然對數
...

22、算術溢出
溢出分為overflow, underflow,被零整除
溢出不會報錯
Infinity表示正的無窮大
-Infinity表示負的無窮大
underflow是無限接近於零,分為0和-0
0處於零,報NaN,用來表示非數字值

23、判斷非數字值
x!=x,當x且僅當x為NaN的時候,才為true
isNaN()函數也是相似的道理
isFine(),當參數不為NaN,Infinity,-Infinity的時候返回true

24、日期和時間
new Date(2010,0,1)
new Date(2010,0,1,17,10,30)
new Date()
getFullYear()
getMonth()
getDate()
getHours()
getUTCHours()

25、字元串
16位值組成,不可變,有序,序列
字元串用來表示文本
有長度length,索引從0開始
Javascript並沒有表示單個字元的"字元型"
單引號中可以包含雙引號
雙引號中可以包含單引號
+字元串連接
length屬性
charAt(0)
charAt()
subString(1,4)2到4號位值上的字元
slice(1,4)2到4號位值上的字元
slice(-2)最後2個字元
indexOf("1")
lastIndexOf("1")
split(",")
replace("","")
toUpperCase()

26、轉義
\n表示另起一行
\反斜線轉義

27、RegExp()函數
兩條斜線之間的文本構成了正則表達式
/^HTML/以HTK開始的字元串

28、布爾值
if(o),當o為undefined, null, 0, -0, NaN為時為false

29、null和undefined
用來描述空值,是關鍵字
對null執行typeof返回object
當作為參數傳入函數,推薦使用null。
undefined是變數的一種取值,表明變數沒有被初始化。
查詢對象屬性或數組元素返回undefined,表示屬性或元素不存在。
函數沒有返回值,返回undefined。
引用沒有提供函數形參對應實參時會得到undefined。

30、全局對象
● 全局屬性:undefined, Infinity, NaN
● 全局函數:isNaN, parseInt, eval
● 全局對象:Date, Regexp, String, Object, Array

31、不可變原始值
undefined, null, 布爾值, 數字和字字元串,是原始值,不可更改。
原始值的比較是值的比較。

32、可變的對象引用
對象是可變的,對象的值是可以修改。
對象的比較不是值得比的比較

33、返回true的情形
null==undefined
"0"==0
0==false
"0"==false

34、一個值可以轉換成另外一個值並不意味著兩個值相等
if(undefined)返回false,並不說明undefined和false相等

35、顯式類型轉換
使用Boolean(), Number(), String(), Object()等函數。
Number("3")
String(false)
Boolean([])
Object(3)
null和undefined不能轉化為對象

36、隱式類型轉換
+ 作為字元串連接,把其中一個非字元串轉換為字元串。
!將操作數轉化為布爾值並取反

37、switch語句
switch(n){
    case 1:
        //語句
        break;
    case 2:
        //語句
        break;
    default:
        //語句
        break;
}

38、while
var count = 0;
while(count < 5){
    console.log(count);
    count++;
}

39、do/while
funnction printArray(a){
    var len = a.length, i = 0;
    if(len == 0){
        console.log("empty");
    } else {
        do {
            console.log(a[i]);
        } while (++i < len);
    }
}

40、for
for(var count = 0; count < 10; count++)


var i,j;
for(i=0, j=10; i < 10; i++, j--)

41、for/in
for(var pi in o)

42、break退出迴圈

for(var i = 0; i < a.length; i++){
    if(a[i]==target)
        break;
}

43、break 標簽, 退出非就近的迴圈
var matrix = getData(); //得到一個二維數組
var sum = 0, success = false;
compute_sum: if(matrix){
    for(var x = 0; x < matrix.length; x++){
        var row = matrix[x];
        if(!row) break compute_sum;
        
        for(var y = 0; y < row.length; y++){
            var cell = row[y];
            if(isNan(cell)) break compute_sum;
            sum += cell;
        }
    }
    
    success = true;
}

44、continue
for(var i = 0; i  < data.length; i++){
    if(!data[i]) continue;
}

continue也可跟標簽

45、throw

function factorial(x){
    if(x < 0){
        throw new Error("");
    }
}

46、try/catch/finally

try{
    
}
catch(ex){
    alert(ex);
}

46、with

with(document.forms[0]){
    name.value = "";
}

把document.forms[0]臨時掛在作用域上。

47、debugger 臨時調試

function f(o){
    if(o === undefined) debugger;
}

48、對象
屬性的無序集合。
每個屬性都是一個鍵值對。
屬性名是字元串,從這點上可以把對象看成字元串到值得映射。
對象都有一個原型對象屬性,實現"原型式繼承",動態添加屬性和方法。
對象的屬性名不能重覆。

49、對象直接量創建對象

var empty = {};
var book = {
    "main title": "" //屬性名有空格必須用引號
}

保留字作為屬性名,必須用引號。
最後一個屬性的屬性值後的逗號可以省略。

50、通過new創建對象

var o = new Object();
var a = new Array();
var d = new Date();
var r = new RegExp("js");

51、Object.create()創建對象

var o1 = Object.create({x:1,y:2});

//創建普通的空對象
var o = Object.create(Object.prototype);

//等同於
{}和new Object()

52、通過原型繼承創建一個新對象

function(p){
    if(p == null)
        throw TypeError();
    if(Object.create)
        return Object.create(p);
        var t = typeof p;
        if(t !== "object" && t !=="function")
            thrwo TypeError();
            
        function f(){}
        f.prototype = p;
        return new f();
}

53、對象屬性的查詢和設置

給null或undefined設置屬性值會報類型錯誤
有一些屬性是只讀的,也不能設置。
var a = book.author;
var t = book["main title"];
book.edition=6;
book["main title"] ="";
查詢對象並不存在的屬性不拋異常拋undefined:book.x; // undefined
對象不存在拋異常:book.x.length

//加判斷防止拋異常或undefined
var len = undeinfed;
if(book){
    if(book.x){
        len = book.x.length;
    }
}

//一種更簡潔的寫法
var len = book && book.x && book.x.length;

54、刪除對象屬性

delete book.author;
delete book["main title"];
delete只能刪除自有屬性,不能刪除繼承屬性。
刪除成功或沒有任何副作用返回true。

55、檢測對象屬性
var o = {x:1};
"x" in o
o.hasOwnProperty("x")

56、遍歷對象屬性

var o = {x:1, y:2};
for(p in o){
    console.log(p);
}

還可以對對象屬性過濾。

for(p in o){
    if(!o.hasOwnProperty(p)) //跳過繼承的屬性
        continue;
}

for(p in o){
    if(typeof o[p] === "function"){
        continue;
    }
}

57、對象屬性getter和setter

var o = {
    data_prop:value,
    get accessor_prop(){},
    set accessor_prop(value){}
}

58、對象屬性的特性

用來表述屬性的屬性。
Object.getOwnPropertyDescriptor({x:1},"x");
Object.getOwnPropertyDescriptor(random, "someprop");

59、對象的原型屬性
在實例對象創建之前就設置好的。
Object.prototype
查看對象的原型Object.getPrototypeOf(把對象作為實參)
檢測p是否是o的原型:p.isPrototypeOf(o)

60、對象的類屬性
字元串,表示對象的類型信息
toString()方法查詢它

61、對象的可擴展性
表示是否可以給對象添加新屬性
Object.isExtensible()

62、序列化對象
將對象與字元串之間進行轉換。
把對象轉換為字元串用:JSON.stringfy()
把字元串轉換為對象用:JSON.parse()

63、對象的方法
所有的對象從Object.prototype繼承屬性。
toString()
toLocalString()
valueOf()

64、數組
數組是值的有序集合。
每個值叫數組元素。
每個元素在數組中的位置就是索引。

65、創建數組
var a = [];
數組元素可以是直接量、表達式、對象
var a = new Array();

66、數組元素讀寫
var a = ["world"];
var value = a[0];
a[1] = 3;

67、稀疏數組
數組的長度大於元素個數。
a = new Array(5);

68、數組元素的添加和刪除
a = [];
a[0]="";
a[1]="";
a.push("");
delete a[1]索引為1的位置不能再有元素

69、數組遍歷
for(var i =0; i < keys.length; i++)
for(var i = 0, len = keys.length; i < len; i++)
for(var index in sparsArray)
data.forEach()

70、多維數組
var talbe = new Array(10);
for(var i = 0; i < table.length; i++){
    tables[i] = new Array(10);
    for(var row = 0; row < table.legnth; row++){
        for(col=0; col < tables[row].lenght; col++){
            table[row][col] = row*col;
        }
    }
}

71、數組方法
a.join("")
a.reverse()
s.sort()
a.concat()
Array.slice()獲取數組片段
Array.splice向數組插入或刪除元素
push()和pop()
shift()和unshift()

72、ECMAScript5中的數組方法
forEach(),map(), filter(), every(), some(), reduce(), reduceRight(),indexOf(), lastIndexOf()

73、判斷數組類型
Array.isArray([]), Array.isArray({})

74、函數
函數是一段代碼。
函數的形參像局部變數一樣工作。
函數調用會為形參提供實參的值。
每次調用會有一個上下文。
函數掛在對象上,就是對象方法。
調用對象方法,上下文就是該對象。
初始化一個新創建對象的函數交構造函數。
函數就是對象,可以把函數賦值給變數,把函數作為參數,也可把函數作為屬性值。
函數可以被包含在函數內,外層的函數就是作用域,內層的函數可以使用作用域內的變數,這就是閉包。

75、函數作為值
函數可以賦值給變數,賦值給對象的屬性,賦值給數組元素。

//賦值給變數
function square(x){
    return x*x;
}
var s = square;

//賦值給屬性
var o = {
    square: function(x){
        return x * x;
    }
}
o.squre(6);

//賦值給數組元素
var a = [function(x){return x*x;},20];
a[0](a[1]);

76、自定義函數屬性
函數是特俗的對象,可以擁有屬性。
fn.counter = 0;
function fn(){
    return fn.counter++;
}

77、call()和apply()方法
以對象o的方法來調用函數f。
f.call(o)
f.apply(o)

f.call(o, 1, 2);
f.apply(o, [1, 2])

78、Function()構造函數
var f = new Function("x", "y", "return x*y;");

79、類
基於原型的繼承機制。
類是動態可繼承。
類的所有實例對象都從同一個原型對象上繼承屬性。

80、類和構造函數
構造函數用來初始化新創建的對象。
new調用構造函數。
調用構造函數就是把prototype屬性用作新對象的原型。
function Range(from, to){
    this.from = from;
    this.to = to;
}

Range.prtotype = {
    includes: function(x){
        return this.from <=x && x <= this.to;
    },
    foreach: function(f){
        for(var x = Math.ceil(this.from); x <= this.to; x++)
            f(x);
    }
};

81、類原型的constructor屬性
var F = function(){};
var p = F.prototype;
var c = p.constructor;
c===F

82、類的繼承

class Animal{
    constructor(voice){
        this.voice = voice || '';
    }
    
    speak(){
        display(this.voice);
    }
}

class Cat extends Animal{
    constructor(name, color){
        super('Meow')
        this.name = name
        this.color = color
    }
}

var fulffy = new Cat('fluffy', 'White');
fluffy.speak();


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 今天總結了下Node.js的Formidable模塊的使用,下麵做一些簡要的說明。 1) 創建Formidable.IncomingForm對象 var form = new formidable.IncomingForm() 2) form.encoding = 'utf-8' 設置表單域的編碼
  • 1. 首先嘛,你得在瀏覽器里輸入要網址: 2. 瀏覽器查找功能變數名稱的IP地址 導航的第一步是通過訪問的功能變數名稱找出其IP地址。DNS查找過程如下: 瀏覽器緩存 – 瀏覽器會緩存DNS記錄一段時間。 有趣的是,操作系統沒有告訴瀏覽器儲存DNS記錄的時間,這樣不同瀏覽器會儲存個自固定的一個時間(2分鐘到30分鐘
  • 表格示例 <div ng-app="myApp" ng-controller="customersCtrl"> <table> <tr ng-repeat="x in names | orderBy : 'Country'"> <td>{{ $index + 1 }}</td> <td ng-if=
  • html5功能強大,數字和顏色輸入框例子 效果:http://hovertree.com/code/html5/rxujb6g8.htm 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="te
  • DOM樹由文檔中的所有節點(元素節點、文本節點、註釋節點等)所構成的一個樹結構,DOM樹的解析和構建是瀏覽器要實現的關鍵功能。既然DOM樹是一個樹結構,那麼我們就可以使用遍歷樹結構的相關方法來對DOM樹進行遍歷,同時DOM2中的"Traversal"模塊又提供了兩種新的類型,從而可以很方便地實現DO...
  • 下麵提一下jQuery的each方法的幾種常用的用法 複製代碼 代碼如下: var arr = [ "one", "two", "three", "four"]; $.each(arr, function(){ alert(this); }); 上面這個each輸出的結果分別為:one,two,th
  • 一.CSS部分 1.什麼是盒模型? 盒模型是網頁製作的基礎,在網頁文檔中每個元素都將被描繪為一個矩形盒子來進行渲染。通常來說,一個完整的盒子如下圖所示: 2.Doctype的幾種類型? Doctype是Document Type(文檔類型)的簡寫,在頁面中,用來指定頁面所使用的XHTML(或者HTM
  • gridpanel顯示checkbox: 添加SelectionModel為Checkbox Selection Model { xtype: 'gridpanel', id: 'Grid1', header: false, title: '條線列表', deferRowRender: false,
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...