JavaScript 摘錄備忘查詢

PS:對(duì)象要多看幾遍弟翘,還有閉包等函數(shù)要多看幾遍虫腋。
一、數(shù)據(jù)類型:

整數(shù)稀余、浮點(diǎn)悦冀、科學(xué)計(jì)數(shù)法、NaN睛琳、Infinity盒蟆。

//關(guān)于NaN
NaN == NaN;  //false
NaN === NaN; //false
isNaN(NaN);  // true

//關(guān)于數(shù)組
var arr_1 = [];  //空數(shù)組
var arr_2 = new Array(); //空數(shù)組
var arr1 = ['A', 'B', 'C'];
var arr2 = new Array('A', 'B', 'C'); // 創(chuàng)建了數(shù)組['A', 'B', 'C'];
arr2[1];  //'B'
arr1.length;  //3
arr1.indexOf('B'); //1, 返回元素的索引踏烙。
arr1.slice(1,3); //['B', 'C'], 從索引1開(kāi)始,到索引3但不包括索引3.
arr1.slice(); //復(fù)制數(shù)組
arr1.push('D'); //從尾部添加'D'
arr1.unshift('D'); //從頭部添加'D'
arr1.pop(); //刪除尾部的一個(gè)元素历等,并且返回刪除的元素讨惩。
arr1.shift(); //從頭部刪除一個(gè)元素,并且返回刪除的元素寒屯。
arr1.sort(); //排序荐捻。
arr1.reverse(); //反轉(zhuǎn)數(shù)組的元素。
arr1.splice(2,3,'M','N','P'); //從索引2開(kāi)始刪除3個(gè)元素寡夹,并且加上'M','N','P'元素处面。
arr1.splice(1,2); //從索引1開(kāi)始刪除2個(gè)元素。并且返回刪除的元素組成的數(shù)組菩掏。
arr1.join('--'); //'A--B--C', 將元素組成字符串魂角,并且用指定字符串連結(jié)。
var new_arr1 = arr1.concat([1,2,3,4]); //拼接2個(gè)數(shù)組患蹂,并且賦給新數(shù)組或颊,并且arr1數(shù)組不變化。
var new_arr1 = arr1.concat([1,2],3,4); //新數(shù)組:['A', 'B', 'C',1,2,3,4];传于, 注意拆分囱挑。


//關(guān)于對(duì)象,數(shù)據(jù)集合沼溜,key-value
var phper = {   //對(duì)象
  job:'PHPer',
  age:26,
  hasCar:true,
  'my-love':'AnHui' //屬性名有特殊字符時(shí)平挑,使用' '括起來(lái)。
};
phper.age;  或者 phper['age']; //26
phper['my-love']; //'AnHui'系草,對(duì)于有特殊字符的屬性通熄,只能這樣。
'Wife' in phper; //false, 檢查該對(duì)象找都,以及該對(duì)象繼承的對(duì)象中是否有這個(gè)屬性唇辨,注意所有對(duì)象最終都會(huì)在原型鏈上指向object。
phper.hasOwnProperty('Wife'); //檢查該對(duì)象是否有這個(gè)屬性能耻,而不是繼承來(lái)的屬性(不考慮繼承的對(duì)象中是否有這個(gè)屬性)赏枚。

//關(guān)于嚴(yán)格模式
'use strict';  //代碼第一行寫入,表示嚴(yán)格模式晓猛。

//關(guān)于字符串饿幅;
var str = 'Hello, world!';
str.length; //13
str[1]; //'e'
str.toUpperCase(); //'HELLO, WORLD!'
str.toLowerCase(); //'hello, world!'
str.substring(7, 12); //索引從7開(kāi)始,不包括12戒职, ‘world’
str.substring(7);   //索引從7開(kāi)始到結(jié)束栗恩,'world!'

二、關(guān)于循環(huán):

//for循環(huán)
for (var i = 0; i < Things.length; i++) {
        Things[i]
    }

//for...in...循環(huán):可以用于對(duì)象和數(shù)組(數(shù)組也是一種對(duì)象)洪燥,
//對(duì)象循環(huán)出屬性字符串磕秤,數(shù)組循環(huán)出索引字符串乳乌。
var aboutme={
    name:'ChenJian',
    age:26,
    job:'PHPer'
}
for (var key in aboutme){
    console.log(key); //'name','age','job'
}


//while循環(huán)。
var i = 1;
var x = 0;
while(i<100){
    x = x + i;
    i+=2;
}
console.log(x); //2500


//do...while..亲澡,至少會(huì)執(zhí)行一次钦扭。
var x=4;
do{
    console.log(x);
    x+=1;
}while(x<1)

三纫版、Map, Set ,iterable:
Map: JS中對(duì)象的屬性只支持字符串不支持?jǐn)?shù)字床绪,于是ES6中引入Map。Map也是一對(duì)鍵值對(duì)其弊,參數(shù)是二位數(shù)組癞己。
Set:一組key的集合,但是沒(méi)有value梭伐,且key不能重復(fù)痹雅。
iterable: Array可以通過(guò)下表來(lái)遍歷,但是Map和Set不可以糊识,于是ES6中引入iterable類型绩社,用來(lái)遍歷Map和Set。Array,Map,Set都是iterable類型赂苗,都可以使用for..of..來(lái)遍歷愉耙。
forEach():iterable的內(nèi)置方法,可以用來(lái)遍歷Array拌滋、Map朴沿、Set。接收一個(gè)方法败砂,

var map0 = new Map();  //空Map
var map1 = new Map([['Suan',24],['Lucy',25],['Mary',26]]);  //參數(shù)必須是二維參數(shù)
sonsole.log(map1); //Map {"Suan" => 24, "Lucy" => 25, "Mary" => 26}
map1.get('Mary');  //取值
map1.set('Aston', 27); //賦值
map1.has('Lucy'); //檢測(cè)是否有'Lucy'屬性赌渣,true Or false
map1.delete('Suan'); //刪除某個(gè)屬性。
var set1 = new Set();
var set2 = new Set([1,2,3,4,4,5]);  //key不能重復(fù)昌犹,參數(shù)為一維數(shù)組坚芜。{1,2,3,4,5}
set2.add(6);  //加一個(gè)元素
set2.delete(3);  //刪一個(gè)元素
var arr1 = ['A','B','C'];  
var set1 = new Set(['A','B','C']);
var map1 = new Map([['Suan',24],['Lucy',25],['Mary',26]]);  
for (var a of arr1){
    console.log(a);  //'A','B','C'
}
for (var s of set1){
    console.log(s);  //'A','B','C'
}
for (var m of map1){
    console.log(typeof m);  //Object, ["Suan", 24], ["Lucy", 25], ["Mary", 26]
    console.log(m[0]);  //String, '24','25','26'
    console.log(m[1]);  //String,"Suan", "Lucy", "Mary"
}
var arr1 = ['A','B','C'];  
var set1 = new Set(['A','B','C']);
var map1 = new Map([['Suan',24],['Lucy',25],['Mary',26]]);  

arr1.forEach(function(element,index,arr){
    console.log(element);
    console.log(index);
    console.log(arr);
});
set1.forEach(function(element){
    console.log(element);  //'A','B','C'
});
map1.forEach(function(value,key,map){
    console.log(value);
    console.log(key);
    console.log(map);
});

四、函數(shù)Function斜姥。

函數(shù)體內(nèi)有個(gè)arguments關(guān)鍵字鸿竖,用來(lái)指向傳入的參數(shù),類似Array,但不是Array疾渴,arguments.length, arguments[i].


函數(shù)體內(nèi)還有個(gè)reset關(guān)鍵字千贯,接收多余的參數(shù),使用如下:

function sth(a1, a2,  ...reset) {
    console.log(reset); //["c", "d"]
}
sth('a','b','c','d')

五搞坝、window對(duì)象搔谴,
1 . JS默認(rèn)的一個(gè)全局變量。
2 .不在任何函數(shù)內(nèi)定義的變量就具有全局作用域桩撮。
3 .關(guān)于ES6中引入的關(guān)鍵字let敦第,解決了塊級(jí)作用域:

for (let i = 0; i < 8; i++) {
    console.log(i);
}
console.log(i);  //Uncaught ReferenceError: i is not defined
//因?yàn)閌let i` 聲明i為塊級(jí)的峰弹,如果`var i`,那么console.log(i);  就是8.

4 .const, ES6中引入關(guān)鍵字const芜果,用來(lái)聲明常量(不可變)鞠呈。const PI = 3.14;
5 . this,關(guān)于對(duì)象體內(nèi)的this指向不明問(wèn)題,尤其是在函數(shù)內(nèi)使用this會(huì)導(dǎo)致指向不明右钾,最好先捕獲蚁吝,var that = this;. 或者使用apply或者call來(lái)聲明,

apply(), 用于函數(shù)舀射,接收2個(gè)參數(shù)窘茁,參數(shù)1指向你想指向的對(duì)象,參數(shù)2是函數(shù)要接受的參數(shù)數(shù)組脆烟,可以為空山林。
call(),類似apply(),不同的是函數(shù)要接受的參數(shù)不是數(shù)組了,而是參數(shù)順序邢羔。

'use strict';
function getAge() {
    var y = new Date().getFullYear();
    return y - this.birth;
}
var aboutme = {
    name: 'ChenJian',
    birth: 1990,
    age: getAge
};
console.log(aboutme.age()); // 25, 正常輸出驼抹。
console.log(getAge()); //Uncaught TypeError: Cannot read property 'birth' of undefined
console.log(getAge.apply(aboutme,[])); //使用apply,指定getAge方法的this對(duì)象拜鹤。
或者
console.log(getAge.call(aboutme, 參數(shù)1, 參數(shù)2, 參數(shù)3..));

六框冀、高階函數(shù)(High Order Function): 函數(shù)接受另外一個(gè)函數(shù)為參數(shù)。

function other(v) {
    return v+'...';
}
function high(a, b, func) {
    return func(a)+func(b);
}
console.log(high('chen', 'jian', other)); //chen...jian...
//map():Array.map(function_name);署惯。對(duì)每個(gè)元素進(jìn)行處理左驾,組成新的Array。[x1, x2, x3, x4].map(f) = [f(x1), f(x2), f(x3), f(x4)]
var arr = [1,2,3,4,5,6];
function abss(v) {
    return v*v;
}
console.log(arr.map(abss)); //[1,4,9,25,36]


//reduce():Array.reduce(function_name);极谊。將x1诡右、x2進(jìn)行處理,組成新元素再和后繼的元素繼續(xù)處理轻猖。[x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4)
var arr = [1,2,3];
function add(v, w) {
    return v*w;
}
console.log(arr.reduce(add)); //6


//filter():Array.filter(function_name); 過(guò)濾Array中的元素帆吻。
var arr = ['A', 'B', 2];
function filter_digital(v){
    return typeof v != 'number';
}
console.log(arr.filter(filter_digital)); // ['A', 'B']


//sort();給Array排序,原數(shù)組會(huì)被改變咙边。但是有個(gè)坑:會(huì)把元素轉(zhuǎn)換為字符串然后排序猜煮,導(dǎo)致如下神奇的效果:
var arr = [1, 20, 10, 2];
console.log(arr.sort());  //[1,10,2,20]
function sort_digital(x, y){
    if (x > y) {
        return true;
    }else{
        return false;
    }
}
console.log(arr.sort(sort_digital)); //正確:[1,2,10,20]

七、閉包败许。

//返回函數(shù)
function lazy_sum(arr) {
    var sum = function () {
        return arr.reduce(function (x, y) {
            return x + y;
        });
    }
    return sum;
}
var arr = [1,2,3,4,5,6];
console.log(lazy_sum(arr)); //function(){....} , 返回函數(shù)王带。
console.log(lazy_sum(arr)()); //21
function count() {
    var arr = [];
    for (var i=1; i<=3; i++) {
        arr.push(function () {
            return i * i;
        });
    }
    return arr;
}
console.log(count());
//箭頭函數(shù)
var y = x => x*x;
console.log(y(3)); //9

八、generator(生成器):ES6中引入的新類型市殷。l類似于函數(shù)可以多次返回:

//大致的定義:
function* foo(x) {
    yield x + 1;
    yield x + 2;
    return x + 3;
}
//使用
function* fib(max) {
    var
        t,
        a = 0,
        b = 1,
        n = 1;
    while (n < max) {
        yield a;
        t = a + b;
        a = b;
        b = t;
        n ++;
    }
    return a;
}
//1.使用next()取出generator里面的值愕撰。
var f = fib(5);
console.log(f); //fib {[[GeneratorStatus]]: "suspended", [[GeneratorReceiver]]: Window},創(chuàng)建了generator對(duì)象,但是沒(méi)有執(zhí)行搞挣。
console.log(f.next());  //Object {value: 0, done: false}
console.log(f.next().value);    //1
console.log(f.next().value);    //1
console.log(f.next().value);    //2
console.log(f.next().value);    //3
console.log(f.next().value);    //undefined

//2.使用for...of..遍歷:
for (var x of fib(5)) { 
      console.log(x); // 依次輸出0, 1, 1, 2, 3
}

關(guān)于generator的總結(jié):每個(gè)yield就返回一個(gè)信息带迟,用處很大。

九囱桨、標(biāo)準(zhǔn)對(duì)象:

//Date()
var date = new Date();
console.log(date.getFullYear());


//RegExp()
\d:數(shù)字
\w:字母或者數(shù)字仓犬。
\s:一個(gè)空格或者tab。
. :任意一個(gè)字符舍肠。
* :任意個(gè)字符搀继,包括0個(gè)。
+:至少一個(gè)字符貌夕。
律歼?:0或者1個(gè)。
{n}:n個(gè)字符啡专。
{n,m}:n至m個(gè)字符制圈。
[0-9a-zA-Z\_]:可以匹配一個(gè)數(shù)字们童、字母或者下劃線;
A|B:可以匹配A或B鲸鹦。
^表示行的開(kāi)頭慧库,^\d表示必須以數(shù)字開(kāi)頭。
$表示行的結(jié)束馋嗜,\d$表示必須以數(shù)字結(jié)束齐板。

//使用1,判斷是否符合規(guī)則葛菇。
var re1 = /ABC\-001/;
var re2 = new RegExp('ABC\\-001');
re1.test('ABC-001'); //true
re2.test('ABC-001'); //true

//使用2甘磨,切分字符串
console.log('a,,b,c'.split(',')); // ["a", "", "b", "c"]
console.log('a,,b,c'.split(/,+/)); // ["a", "b", "c"]

//使用3,分組
var re = /^(\d{3})-(\d{3,8})$/;
re.exec('010-12345'); // ['010-12345', '010', '12345']
re.exec('010 12345'); // null

十眯停、JSON:

字符集是UTF-8济舆,字符串要使用雙引號(hào),對(duì)象中的鍵值也要使用雙引號(hào)莺债。

JSON.stringify(對(duì)象);   //序列化成JSON格式字符串滋觉。
JSON.stringify(對(duì)象, ['key1', 'key2']);   //JSON串,但是只保留key1和key2這2個(gè)屬性.
JSON.stringify(對(duì)象, convert_function);  //先用convert_function函數(shù)處理屬性。
JSON.parse(JSON格式字符串); //反序列化
JSON.parse(JSON格式字符串,func); //反序列化,func可以用來(lái)處理屬性齐邦。

JSON.parse('{"name":"小明","age":14}', function (key, value) { 
// 把number * 2: 
if (key === 'name') {
   return value + '同學(xué)'; 
} return value;}); // Object {name: '小明同學(xué)', age: 14}

十一椎侠、面向?qū)ο缶幊蹋?/p>

js沒(méi)有實(shí)例的概念,而是通過(guò)原型(prototype)來(lái)實(shí)現(xiàn)面向?qū)ο缶幊獭?/p>

var Student = {
    age:12,
    job:'PHPer'
}
var AboutMe = {
    name:'ChenJian'
}
AboutMe.__proto__ = Student; //將AboutMe的原型指向Student措拇,類似于繼承我纪。
//最好使用obj.create(原型對(duì)象),來(lái)首先創(chuàng)建一個(gè)空對(duì)象,AboutMe.create(Student).
console.log(AboutMe.job);  //'PHPer'


// 創(chuàng)建對(duì)象1,原始方法
var me = {...};


// 創(chuàng)建對(duì)象2宣羊,使用構(gòu)造方法璧诵。JS中萬(wàn)物皆對(duì)象。
function me(name){
    this.name = name;
}
var aboutme = new me('ChenJian');
// 現(xiàn)在aboutme就是一個(gè)對(duì)象了仇冯,
// 同時(shí)此法創(chuàng)建的對(duì)象有個(gè)constructor屬性之宿,指向Student方法。
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末苛坚,一起剝皮案震驚了整個(gè)濱河市比被,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌泼舱,老刑警劉巖等缀,帶你破解...
    沈念sama閱讀 212,816評(píng)論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異娇昙,居然都是意外死亡尺迂,警方通過(guò)查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,729評(píng)論 3 385
  • 文/潘曉璐 我一進(jìn)店門冒掌,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)噪裕,“玉大人,你說(shuō)我怎么就攤上這事股毫∩乓簦” “怎么了?”我有些...
    開(kāi)封第一講書(shū)人閱讀 158,300評(píng)論 0 348
  • 文/不壞的土叔 我叫張陵铃诬,是天一觀的道長(zhǎng)祭陷。 經(jīng)常有香客問(wèn)我,道長(zhǎng)趣席,這世上最難降的妖魔是什么兵志? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 56,780評(píng)論 1 285
  • 正文 為了忘掉前任,我火速辦了婚禮吩坝,結(jié)果婚禮上毒姨,老公的妹妹穿的比我還像新娘。我一直安慰自己钉寝,他們只是感情好弧呐,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,890評(píng)論 6 385
  • 文/花漫 我一把揭開(kāi)白布。 她就那樣靜靜地躺著嵌纲,像睡著了一般俘枫。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上逮走,一...
    開(kāi)封第一講書(shū)人閱讀 50,084評(píng)論 1 291
  • 那天鸠蚪,我揣著相機(jī)與錄音,去河邊找鬼。 笑死茅信,一個(gè)胖子當(dāng)著我的面吹牛盾舌,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播蘸鲸,決...
    沈念sama閱讀 39,151評(píng)論 3 410
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼妖谴,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了酌摇?” 一聲冷哼從身側(cè)響起膝舅,我...
    開(kāi)封第一講書(shū)人閱讀 37,912評(píng)論 0 268
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎窑多,沒(méi)想到半個(gè)月后仍稀,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,355評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡埂息,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,666評(píng)論 2 327
  • 正文 我和宋清朗相戀三年技潘,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片耿芹。...
    茶點(diǎn)故事閱讀 38,809評(píng)論 1 341
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡崭篡,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出吧秕,到底是詐尸還是另有隱情,我是刑警寧澤迹炼,帶...
    沈念sama閱讀 34,504評(píng)論 4 334
  • 正文 年R本政府宣布砸彬,位于F島的核電站,受9級(jí)特大地震影響斯入,放射性物質(zhì)發(fā)生泄漏砂碉。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 40,150評(píng)論 3 317
  • 文/蒙蒙 一刻两、第九天 我趴在偏房一處隱蔽的房頂上張望增蹭。 院中可真熱鬧,春花似錦磅摹、人聲如沸滋迈。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 30,882評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)饼灿。三九已至,卻和暖如春帝美,著一層夾襖步出監(jiān)牢的瞬間碍彭,已是汗流浹背。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 32,121評(píng)論 1 267
  • 我被黑心中介騙來(lái)泰國(guó)打工, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留庇忌,地道東北人舞箍。 一個(gè)月前我還...
    沈念sama閱讀 46,628評(píng)論 2 362
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像皆疹,于是被迫代替她去往敵國(guó)和親疏橄。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,724評(píng)論 2 351

推薦閱讀更多精彩內(nèi)容