歐克业扒,今天早上擺爛,然后再醒來(lái)的時(shí)候:
舒萎?程储??臂寝?章鲤??咆贬?败徊?他在講什么?掏缎?集嵌??御毅?根欧??端蛆?凤粗?
好吧,我感覺(jué)我思路沒(méi)問(wèn)題今豆,就是沒(méi)記住嫌拣,那么首先從數(shù)組開(kāi)始記錄:
__proto__ ?這個(gè)屬性是什么?
__proto__ 它是每個(gè)對(duì)象都有的屬性,叫做隱式原型(實(shí)例對(duì)象的隱式原型):
typeof?? xxxx ? object? 只要出現(xiàn)在obj.__proto__上的屬性和方法呆躲,那么這些屬性和方法就可以被obj使用
學(xué)習(xí)API的技巧:
1. 看"."前面的數(shù)據(jù)异逐,看方法的調(diào)用者
2. 看小括號(hào)()內(nèi)的數(shù)據(jù),看方法的參數(shù)
3. 看res數(shù)據(jù)插掂,看方法的返回值
4. 有什么作用? 看方法的功能
1.concat()? 合并數(shù)組
var res = arr.concat(參數(shù)1灰瞻,參數(shù)2,參數(shù)3)
調(diào)用者: arr
參數(shù):數(shù)組
返回值:合并數(shù)據(jù)之后的新數(shù)組
功能:合并數(shù)組
2. push() ?是指往數(shù)組最后的索引位置添加數(shù)據(jù) (末位)
var users = ["jack","tom","jerry"];
console.log(users); // ['jack', 'tom', 'jerry']
var res = users.push("tonny");
console.log(users);// ['jack', 'tom', 'jerry', 'tonny']
console.log(res); // 4 ?
調(diào)用者:數(shù)組實(shí)例 ?users
參數(shù):數(shù)據(jù)(目標(biāo)元素)
返回值:數(shù)組長(zhǎng)度
功能:往數(shù)組追加數(shù)據(jù)
3. pop()? 刪除數(shù)組中最后索引對(duì)應(yīng)的數(shù)據(jù)
var user2 = ["jack","tom","jerry"];
var res2 = user2.pop();// 刪除 "jerry
user2.pop();// 刪除 "tom"
user2.pop();// 刪除 "jack"
user2.pop();// 沒(méi)數(shù)據(jù)可刪除了
console.log(user2);// ["jack","tom"]
console.log(res2);// 返回被刪除的數(shù)據(jù)
調(diào)用者:user2
參數(shù):無(wú)
返回值:返回被刪除的元素
功能:刪除數(shù)組末位的元素
4. unshift() 在數(shù)組第一個(gè)索引值位置添加數(shù)據(jù)(首位)
var user3 = ["jack","tom","jerry"];
var res3 = user3.unshift("paike1");
user3.unshift("paike2");
user3.unshift("paike3");
user3.unshift("paike4");
console.log(user3);// ['paike1', 'jack', 'tom', 'jerry']
console.log(res3);//? 4
調(diào)用者:user3
參數(shù):新增元素(數(shù)據(jù))
返回值:數(shù)組的長(zhǎng)度
功能:往數(shù)組首位添加元素
5. shift() ?刪除數(shù)組中第一個(gè)索引對(duì)應(yīng)的數(shù)據(jù)
var user4 = ["jack","tom","jerry"];
var res4 = user4.shift()
user4.shift()
user4.shift()
console.log(user4);// ['tom', 'jerry']
console.log(res4);// "jack"
調(diào)用者:users4
參數(shù):無(wú)
返回值:返回被刪除的元素(數(shù)據(jù))
功能:刪除數(shù)組首位的元素
6. slice() 截取數(shù)組中指定索引的元素
情況一辅甥、
僅有一個(gè)參數(shù)酝润,且參數(shù)值不超過(guò)最大索引
console.log(arrColor.slice(7));//? []
console.log(arrColor.slice(6));//? ['white']
console.log(arrColor.slice(5));//? ['gray', 'white']
console.log(arrColor.slice(-1));// ['white'] 如果是負(fù)值,從數(shù)組倒數(shù)開(kāi)始截取數(shù)據(jù)
情況二璃弄、
參數(shù)1表示開(kāi)始索引值要销,參數(shù)2表示結(jié)束的索引值
參數(shù)1(左) 參數(shù)2(右),截取數(shù)組元素的時(shí)候夏块,是包左不包右
? ? ? ? console.log(arrColor.slice(0,2));// ?["red","green"]
? ? ? ? console.log(arrColor.slice(4,6));// ?["orange","gray"]
輸出原數(shù)組
? ? ? ? console.log(arrColor);
調(diào)用者: arrColor 數(shù)組
參數(shù):索引值
一個(gè)參數(shù)
兩個(gè)參數(shù)(包左不包右)
返回值:返回值是包含被截取元素的數(shù)組
功能:截取數(shù)組中指定索引的數(shù)據(jù)
應(yīng)用場(chǎng)景:
網(wǎng)頁(yè)數(shù)據(jù)分頁(yè)
7. splice
splice 可以刪除數(shù)中組指定索引的元素疏咐,并且返回被刪除的元素纤掸,還可以插入元素
splice? 這個(gè)方法會(huì)影響原數(shù)組!浑塞!
var arrColor = ["red","green","purple","yellow","orange","gray","white"];
? ? ? ? ? ? ? ? ? ? ? ? // 0 ? ?1 ? ? ? 2 ? ? ? 3 ? ? ? ?4 ? ? ? ?5 ? ? ? 6
情況一茁肠、
僅僅一個(gè)參數(shù),且索引不大于最大索引6
var res = arrColor.splice(2);
console.log(arrColor);//["red","green"]
console.log(res);// ['purple', 'yellow', 'orange', 'gray', 'white']
調(diào)用者:arrColor數(shù)組
參數(shù): 開(kāi)始索引值 (僅僅一個(gè)參數(shù))
返回值:返回被刪除元素的數(shù)組缩举,返回值是數(shù)組!Fゲ仅孩!
功能:刪除數(shù)組中指定索引值開(kāi)始的所有元素(包含索引值對(duì)應(yīng)的元素)
情況二、
參數(shù)1表示開(kāi)始索引值印蓖, 參數(shù)2表示刪除元素的數(shù)量
想法:刪除這些元素 "purple","yellow","orange","gray"
var res2 = arrColor2.splice(2,4);
console.log(arrColor2);// ['red', 'green', 'white']
console.log(res2);// ?['purple', 'yellow', 'orange', 'gray']
調(diào)用者:arrColor數(shù)組
參數(shù): 參數(shù)1表示開(kāi)始索引值辽慕, 參數(shù)2表示刪除元素的數(shù)量
返回值:返回被刪除元素的數(shù)組,返回值是數(shù)組I馑唷=︱取!
功能:刪除數(shù)組中指定索引值開(kāi)始的所有元素(包含索引值對(duì)應(yīng)的元素)
情況三他宛、
?var arrColor3 = ["red","green","purple","yellow","orange","gray","white"];
? ? ? ? ? ? ? ? ? ? ? ? // 0 ? ?1 ? ? ? 2 ? ? ? 3 ? ? ? ?4 ? ? ? ?5 ? ? ? 6
參數(shù)1表示開(kāi)始索引值船侧, 參數(shù)2表示刪除元素的數(shù)量 ,參數(shù)3+ 表示插入數(shù)組的數(shù)據(jù)
刪除索引值為1開(kāi)始的1個(gè)數(shù)據(jù)厅各,并在當(dāng)前位置插入數(shù)據(jù)"綠色","xxx","yyy"
? ? ? ? arrColor3.splice(1,1,"綠色","xxx","yyy")
? ? ? ? console.log(arrColor3);
總結(jié):
1镜撩、可以刪除數(shù)組指定索引的數(shù)據(jù)
2、可以獲取數(shù)組指定的數(shù)據(jù)
3队塘、可以往數(shù)組指定索引位置插入數(shù)據(jù)
區(qū)別數(shù)組中的slice 和 splice 方法袁梗。
slice ? 截取數(shù)據(jù)時(shí),不會(huì)影響原數(shù)組
splice ?截取數(shù)據(jù)時(shí)憔古,會(huì)影響原數(shù)組
8. join() 把數(shù)組轉(zhuǎn)成指定格式的字符串
var arr = ["11","22","33","a","b","c"];
var str = arr.join();
console.log(str);// 11,22,33,a,b,c
console.log(typeof str);// string
console.log(arr.join(""));// 112233abc
console.log(arr.join(" "));// 11 22 33 abc
console.log(arr.join("#"));// 11#22#33#a#b#c
9. forEach()? 遍歷數(shù)組
? ? ? ? var arr2 = ["11","22","33","a","b","c"];
? ? ? ? var res = arr2.forEach(function(item,index){// 形參
? ? ? ? ? ? // console.log(item)// item 代表數(shù)組的每一項(xiàng)數(shù)據(jù)
? ? ? ? ? ? // console.log(index);// index 代表每一項(xiàng)數(shù)據(jù)的索引值
? ? ? ? })
? ? ? ? console.log(res);// undefined
調(diào)用者:arr2數(shù)組
參數(shù):匿名函數(shù)遮怜,也可以叫做回調(diào)函數(shù)
返回值:忽略 (undefined)
功能:主要作用是循環(huán)遍歷數(shù)組
? ? ? ? // 函數(shù)表達(dá)式
? ? ? ? // var foo = function(){console.log()}
? ? ? ? // foo();
? ? ? ? // 匿名函數(shù): 不具有函數(shù)名稱(chēng)的代碼塊 function(){}
? ? ? ? // function(){} // 報(bào)錯(cuò)
? ? ? ? // (function(){console.log("test")}); // 不報(bào)錯(cuò)
? ? ? ? // (function(){console.log("test")})();// 不報(bào)錯(cuò)
? ? ? ? // +function(){console.log("test")}()// 不報(bào)錯(cuò)
? ? ? ? // -function(){console.log("test")}()// 不報(bào)錯(cuò)
? ? ? ? // (function(){})();// 匿名函數(shù),立即執(zhí)行函數(shù)
10. sort()? 主要是對(duì)數(shù)組進(jìn)行排序或亂序
升序 值從小到大
降序 值從大到小
? ? ? ? // 定義數(shù)組
升序
? ? ? ? var res1 = arr.sort(function(prev,next){
? ? ? ? ? ? return prev - next;
? ? ? ? })
? ? ? ? console.log(res1);// [10, 20, 30, 40, 60, 90, 100]
降序
? ? ? ? var res2 = arr.sort(function(prev,next){
? ? ? ? ? ? return next - prev;
? ? ? ? })
? ? ? ? console.log(res2);// [100, 90, 60, 40, 30, 20, 10]
? ? ? ? console.log(arr);// ?[100, 90, 60, 40, 30, 20, 10]
調(diào)用者:arr 數(shù)組
參數(shù):匿名函數(shù)
? ? ? ? // function(a,b) { return a - b;} //升序
? ? ? ? // function(a,b) { return b - a;} // 降序
返回值:返回值完成排序的數(shù)組
功能:對(duì)數(shù)組進(jìn)行排序
? ? ? ? // 復(fù)雜數(shù)據(jù)結(jié)構(gòu):
? ? ? ? var data = [
? ? ? ? ? ? {name:"學(xué)生1",score:90},
? ? ? ? ? ? {name:"學(xué)生2",score:60},
? ? ? ? ? ? {name:"學(xué)生3",score:80},
? ? ? ? ? ? {name:"學(xué)生4",score:70},
? ? ? ? ? ? {name:"學(xué)生5",score:85}
? ? ? ? ]
? ? ? ? // 比如:取出學(xué)生2的分?jǐn)?shù)?
? ? ? ? // data[1].score ;// 60
? ? ? ? // 思考一下:如何根據(jù)學(xué)生分?jǐn)?shù)進(jìn)行排序鸿市?
? ? ? ? data.sort(function(a,b){
? ? ? ? ? ? return a.score - b.score;
? ? ? ? })
? ? ? ? // console.log(data);
亂序
var arr = [10,30,40,50,60,70];
? ? ? ? // arr 就是數(shù)組
? ? ? ? // arr 它是構(gòu)造函數(shù)Array的實(shí)例(具體的事物)
? ? ? ? // 調(diào)用數(shù)組實(shí)例對(duì)象的sort方法
? ? ? ? // sort 方法
? ? ? ? arr.sort(function(){
? ? ? ? ? ? // 根據(jù)隨機(jī)小數(shù)和0.5相加的結(jié)果作為條件打亂原數(shù)組arr的順序锯梁。
? ? ? ? ? ? return Math.random() - 0.5;
? ? ? ? })
? ? ? ? // 控制臺(tái)輸出
? ? ? ? console.log(arr);
? ? ? ? // Math 是數(shù)學(xué)對(duì)象
? ? ? ? // Math.random() 產(chǎn)生隨機(jī)小數(shù) 0 ~ ?1
歐克,以上是數(shù)組的焰情,還不是全部@晕Α!@友冯遂!已經(jīng)吐了好吧!!
關(guān)于構(gòu)造函數(shù)過(guò)程
首先寫(xiě)一下關(guān)于new出來(lái)的東西谒获,和直接申明的東西有什么區(qū)別蛤肌,額壁却,大致就是new的時(shí)候,就是調(diào)用了String()函數(shù)裸准,該函數(shù)會(huì)創(chuàng)建一個(gè)空對(duì)象作為容器來(lái)裝入值展东,如下圖:
然后該對(duì)象會(huì)將String的顯示原型賦予new的對(duì)象的隱式原型(關(guān)于原型可以理解為一個(gè)公共區(qū)域,我在隨筆中有寫(xiě)到)炒俱,因此該對(duì)像會(huì)具有String的prototype盐肃。這里附上知乎大佬劉東寫(xiě)的new創(chuàng)建過(guò)程:
new關(guān)鍵字的實(shí)現(xiàn)過(guò)程是這樣的:
創(chuàng)建一個(gè)空的對(duì)象 var str = {};
str.__proto__ = String.prototype
(可選)將str的構(gòu)造函數(shù)指定為String;
將str對(duì)象通過(guò)String.call(str)初始化一下? //? call() 初始化this對(duì)象
return str
可以看出new的東西都是對(duì)象。
var str = "STRING";就是一個(gè)基本類(lèi)型权悟,執(zhí)行引擎在操作它的方法時(shí)會(huì)自動(dòng)包裝然后再銷(xiāo)毀砸王。
ok,我覺(jué)得這個(gè)基本上就可以解釋該問(wèn)題了峦阁,反正我是懂了的~
然后繼續(xù)寫(xiě)字符API谦铃。。
1. concat() 合并字符串
var s1 = "你好 ";
var s2 = "世界榔昔!";
var res = s1.concat(s2);
console.log(res);
調(diào)用者:s1字符串
參數(shù):s2字符串
返回值:
功能:合并
說(shuō)實(shí)話(huà)該功能真的雞肋驹闰,因?yàn)樽址梢砸揽俊?“號(hào)來(lái)拼接6,或許有的時(shí)候會(huì)很方便吧撒会。
2. split() 把字符串切割成數(shù)組 (常用方法)
var str = "張三李四趙五孫六錢(qián)七";
var str = "張三,李四,趙五,孫六,錢(qián)七";
在控制臺(tái)輸出結(jié)果:
console.log(str.split());//['張三李四趙五孫六錢(qián)七']
// console.log(str.split(""));// ['張', '三', '李', '四', '趙', '五', '孫', '六', '錢(qián)', '七']
console.log(str.split(","));//['張三', '李四', '趙五', '孫六', '錢(qián)七']
調(diào)用者:字符串
參數(shù):可選
返回值:把字符串切割之后的數(shù)組
功能:切割字符串嘹朗,并且記錄在數(shù)組中
3. indexOf 檢索字符串中首次出現(xiàn)的字符的索引
?// 字符串
? ? ? ? // var str = "http://www.baidu.com";
console.log(str.indexOf("h"));// 0
console.log(str.indexOf("t"));// 1? 首次出現(xiàn)的t字符的位
console.log(str.indexOf("!"));// -1? 不存在 “!”字符
console.log(str.indexOf("www"));// 7
console.log(str.indexOf("http://"));// 0
4. lastIndexOf 檢索字符串中最后一次出現(xiàn)的字符的索引
console.log(str.lastIndexOf("t"));// 2
console.log(str.lastIndexOf("."));// 16
字符串
var str1 = "http://www.baidu.com";
? ? ? ? //? 012345678910
兩種方法都接受作為檢索起始位置的第二個(gè)參數(shù)。
var str ="The full name of China is the People's Republic of China.";
var pos = str.indexOf("China",18);
var str ="The full name of China is the People's Republic of China.";
var pos = str.lastIndexOf("China",50);
lastIndexOf()方法向后進(jìn)行檢索(從尾到頭)诵肛,這意味著:假如第二個(gè)參數(shù)是 50骡显,則從位置 50 開(kāi)始檢索,直到字符串的起點(diǎn)曾掂。
這里備注一個(gè)與indexOF功能類(lèi)似的方法search()
var str ="The full name of China is the People's Republic of China.";
var pos = str.search("locate");
兩種方法惫谤,indexOf()與search(),是相等的珠洗。
這兩種方法區(qū)別在于:
search() 方法無(wú)法設(shè)置第二個(gè)開(kāi)始位置參數(shù)溜歪。
indexOf() 方法無(wú)法設(shè)置更強(qiáng)大的搜索值(正則表達(dá)式)。
5. slice 截取字符串
情況一许蓖、
僅僅一個(gè)參數(shù)蝴猪,且參數(shù)的值是小于 str.length
console.log(str1.slice(1));// "ttp://www.baidu.com"
console.log(str1.slice(2));// "tp://www.baidu.com"
console.log(str1.slice(3));// "p://www.baidu.com"
情況二、
參數(shù)1膊爪、參數(shù)2
參數(shù)1表示開(kāi)始索引值 自阱,參數(shù)2表示結(jié)束索引值 (包左不包右)
console.log(str1.slice(0,4));// "http"
console.log(str1.slice(11,16));// "baidu"?
情況三、
參數(shù)是負(fù)數(shù),倒數(shù)截取字符
console.log(str1.slice(-1));// "m"
console.log(str1.slice(-2));// "om"
console.log(str1.slice(-3));// "com"
開(kāi)始索引值要小于結(jié)束索引值
console.log(str1.slice(-1,-2));// 截取不到字符
console.log(str1.slice(-2,-1));// "o"
console.log(str1.slice(-3,-1));// "co"
6.0 substr
?var str2 = "http://www.baidu.com";
? ? //? 012345678910
console.log(str2.substr(1));//? "ttp://www.baidu.com"
console.log(str2.substr(-1));// "m"
參數(shù)1表示開(kāi)始索引值 參數(shù)2截取的字符長(zhǎng)度
console.log(str2.substr(5,2));//? "http://"
console.log(str2.substr(11,5));//? "baidu"
7.0 substring 類(lèi)似slice是一樣的作用
var str3 = "http://www.baidu.com";
? ? //? 012345678910
參數(shù)不能是負(fù)值
console.log(str3.substring(-2));
console.log(str3.substring(1)); //"ttp://www.baidu.com"
console.log(str3.substring(7,10)); // "www"
三種方法總結(jié):
slice(start,end)
substring(start,end)
substr(start,length)
8. replace() ?替換字符
? ? ? ? var str = "我喜歡你米酬,小花";
? ? ? ? // 把"小花"替換成"小明"
? ? ? ? var msg = str.replace("小花","小明");
? ? ? ? console.log(str);// "我喜歡你沛豌,小花"
? ? ? ? console.log(msg);// "我喜歡你,小明"
調(diào)用者:字符串
參數(shù):參數(shù)1赃额,參數(shù)2
返回值:替換字符之后的字符串
功能:替換字符
9. replaceAll 替換字符串文本中指定格式的所有字符
定義字符串
? ? ? ? var html = "<div></div>";
? ? ? ? // 替換div為span
? ? ? ? // console.log(html.replace("div","span"));
? ? ? ? console.log(html.replaceAll("div","span"));// "<span></span>"
10. toUpperCase 把字母字符轉(zhuǎn)大寫(xiě)
? ? ? ? // 定義字符串
? ? ? ? var str = "hello world";
? ? ? ? console.log(str.toUpperCase());// "HELLO WORLD"
11. toLowerCase 把字母字符轉(zhuǎn)小寫(xiě)
? ? ? ? var txt = "ABCDEFGHI";
? ? ? ? console.log(txt.toLowerCase());// "abcdefghi"
12. charAt ?根據(jù)索引值檢索文本中的字符
var str = "helloworld"
? ? ? ? ? ? ? ? // 0123456789
? ? ? ? console.log(str.charAt(1));// "e"
? ? ? ? console.log(str.charAt(4));// "o"
? ? ? ? console.log(str.charAt(9));// "d"
13. charCodeAt ?檢索字符對(duì)應(yīng)的unicode編碼 ? ?最大整數(shù) ?655535
? ? ? ? // unicode編碼 規(guī)范世界上所有字符的一個(gè)方案(字典)
? ? ? ? var str2 = "abcdef"
? ? ? ? ? ? ? ? ?// 012345
? ? ? ? console.log(str2.charCodeAt(0));// 97 ?此處的97是指 "a"字符對(duì)應(yīng)的數(shù)值(unicode碼)
? ? ? ? console.log(str2.charCodeAt(1));// 98 ?此處的97是指 "b"字符對(duì)應(yīng)的數(shù)值(unicode碼)
ok大概就這些加派,剩下一個(gè)快速排序叫确,這里就不記了,我還沒(méi)弄透芍锦,我再研究一下竹勉。。明天寫(xiě)