1. 程式人生 > >JavaScript知識復習

JavaScript知識復習

LV 叠代 順序 構造 ... init gif 結果 引用

JavaScript

數據類型

原始數據類型:

number
string
boolean
null
undefined
對象:object:
Function
Array
Date...
共有六種數據類型,五種原始數據類型,一種對象類型。
弱類型的表現,字符與數字做加法,數據的取整等。

隱式轉換

字符串與數字使用會以拼接的方式計算結果。

=》字符串與數字之間的轉換:巧用+-,字符串數字減0得到數字,數字加空字符串可以轉換成字符。

        var str = ‘37‘;
        var num = 37;
        str = str - 0;
        num =
num + ‘‘; console.log(str); console.log(typeof str); //37 //number console.log(num); console.log(typeof num); //37 //string //如果符號使用相反不能發生變換

a == b情況

‘1.23‘ == 1.23
0 == false
null == undefined
new Object() == new Object()
[1,2] == [1,2]

a === b 判斷類型

null === null
undefined === undefined
NaN != NaN//NaN 不等於任何包括自己
new Object() != new Object()//對象的比較是對象的引用

在==時發生隱式轉換。

包裝對象:

string-->String
number-->NUmber
boolean-->Boolean

var a = "assassin";
console.log(a.length);
//8, ?為何有length屬性,
a.t = 3;
console.log(a.t);
//undefined 

當基本類型視圖以對象的方式訪問時,JavaScript回把基本類型轉化為包裝類型對象,可以使用對象的方法。eg:a.t = 3;這樣的操作,會創建臨時對象,賦值完成後臨時對象馬上銷毀。

類型檢測:

typeof 基本類型,函數對象
instanceof
Object.prototype.toString
constructor
duck type

typeof: 判斷基本類型,函數對象,null失效

typeof 100   number
typeof true  boolean
typeof function  function

typeof (undefined)  undefined
typeof new Object  object
typeof [1,2,3]  object
typeof NAN  number
typeof null  object //有特殊的原因

instanceof: 判斷對象類型,基於原型連的判斷

obj instanceof Object
//左操作數的對象的原型鏈上是否有右邊構造函數的prototype屬性。
//註意:不同的window,iframe間的對象雷響檢測不能使用instanof

Object.prototype.toString.appley():

Object.prototype.toString.appley([]) === "[object Array]";
...

IE6,7,8用這種方法判斷null時還是返回[object object],其他返回[object null]

constructor:
duck type

運算符

特殊運算符

? : 條件運算符

var val = true ? 1 : 2;

, 逗號運算符

var val = (1,2,4);//val = 4

delete 刪除對象的屬性
in

window.x = 1;
x in window;//true

new 運算符 創建構造器的實例

語句

for...in

1.順序不確定
2.enumerable為false時不會出現
3.for in遍歷對象屬性時受原型鏈影響

對象

對象中包含一系列屬性,這些屬性是無序的,每個屬性都有一個字符串key和對應的value.

創建

字面量:

var obj1 = {x: 1, y: 2};

使用構造器:

function foo() {}
foo.prototype.z = 3;
var obj = new foo();
obj.x = 1;
obj.y = 2;

obj.z;//3
typeof obj.toString;//function obj的原型prototype訪問到foo上的原型,在訪問到Object的原型,prototype是Object上的一個函數
‘z‘ in obj;//true
obj.hasOwnProperty(‘z‘);//false,z是foo上的屬性

使用Object.create(),傳遞對象格式創建

var obj = Object.create({x: 1});
//它的原型基於Object

對象的操作

delete刪除屬性
delete obj.x;
查看對象的描述器:

var descriptor = Object.getOwnPropertyDescriptor(Object, ‘prototype‘);
descriptor.configurable;//false 他是描述對象的原型是否可以被修改,true可以被修改

delete方法不能刪除全局變量,函數等,只有變量在隱式轉換後可以刪除。

屬性枚舉:

var o = {
    x: 1,
    y: 2
}
var key;
for(key in o) {
    if(o.hasOwnProperty(key)) {
        console.log(key);
    }
    //x,y
}

序列化

var obj = {
    x: 1,
    y: true,
    z: [1,2,3],
    nullVall: null
};
JSON.stringify(obj);
//"{"x": 1,"y": true,"z":[1,2,3],"nullVal": null}"
// 如果對象的值為undefined,則此屬性但是不會序列化的
var obj = {
    x: 1,
    y: true,
    z: [1,2,3],
    nullVall: null,
    value: undefined
};
JSON.stringify(obj);
//"{"x": 1,"y": true,"z":[1,2,3],"nullVal": null}"
//值如果為NaN,Infinity則會轉化為null,時間會自動轉換格式。

JSON.parse();解析成對象格式

數組

js 中的數組是動態的
delete刪除數組中的某一項時,這一項被賦值undefined,但長度沒有變化。
arr.push <=> arr[arr.length] = xxx;每次在數組末尾添加一個元素。
unshift(0):頭部添加元素
arr.length -= 1 <=> arr.pop(); 刪除尾部的元素
shift();頭部刪除一個元素

叠代

for循環,for in 不保證順序

數組中的方法

[] => Array.prototype,數組及與數組原型鏈上的方法。
join: 將數組轉換成字符串

var arr = [1,2,3];
arr.join();
//arr "1,2,3"
arr.join(‘_‘);
//arr "1_2_3"
//實現一個字符串的重復輸出函數
function repeatString(str, n) {
    return new Array(n+1).join(str);
    //join會根據數組中的個數拼接字符串,創建n+1大小的數組,以傳進來的參數作為拼接的單個字符拼接
}
repeatString("a",3);
//aaa

revsese:順序的逆秩,原數組也會發生變化
sort對數組排序
默認是按照字母順序排序,原來的數組也會被修改。要傳入一個比較函數。

arr.sort(function(a,b) {
    return a - b;
})

concat()合並數組
並未修改原來的數組。
slice() 返回數組的一個片段

var arr = [1,2,3,4,5];
arr.slice(1,3);//從第一個到第三個
arr.slice(1);//[2,3,4,5]
arr.slice(1,-1);//[2,3,4]負數表示從末尾開始

splice()數組的拼接
對原數組進行修改

//刪除
var arr = [1,2,3,4,5];
arr.splice(2);//return [3,4,5]
arr;//1,2

arr = [1,2,3,4,5];
arr.splice(2,2);//return [3,4]
arr;//[1,2,5]

//刪除添加
arr = [1,2,3,4,5];
arr.splice(1,1,‘a‘,‘b‘);//return [2]刪除的元素,第二個元素刪除,刪除一個元素,在刪除的位置添加元素
arr;//[1,‘a‘,‘b‘,3,4,5]

forEach對數組的遍歷

var arr = [1,2,3,4,5];
arr.forEach(function(x, index, a) {
    console.log(x + ‘|‘ +index + ‘|‘ + (a === arr));
});
//1 | 0 | true
//x:數組元素,index索引,a數組本身
//Ie9以上

map()對函數進行映射

var arr = [1,2,3];
arr.map(function(x) {
   return x+10;
});//[11,12,13]
arr;//[1,2,3]
//原數組並未改變

filter對數組進行過濾篩選

var arr = [1,2,3,4,5,6,7,8,9,10];
arr.filter(function(x,index) {
    return index % 3 === 0 || x > 8;
});// return [1,4,7,8,9,10]
arr;//未改變

every&some 數組的判斷

//每一項都要滿足
var arr = [1,2,3,4,5];
arr.every(function(x) {
    return x < 10;
})//true 


//只有一項即可
arr.some(function(x) {
    return x === 3;
});
// true 

indexOf()&lastIndexOf()查找

var arr = [1,2,3,2,1];
arr.indexOf(2);//1
arr.indexOf(99);//-1
arr.indexOf(1,1);//4,返回第二個1的索引
arr.indexOf(1,-3);//從-3的位置開始查找1

//從右往左查找
arr.lastIndexOf(2);//3 
arr.lastIndexOf(2,-2);//3
arr.lastIndexOf(2,-3);// 1

一個對象是否是數組

Array.isArray([]);//true
[] instanceof Array;//true
({}).toString.apply([]) === ‘[object Array]‘;
[].constructor === Array;//true

JavaScript知識復習