ECMAScript6新方法(2)

字符串?dāng)U展

ES6加強(qiáng)了對(duì)Unicode的支持,并且擴(kuò)展了字符串對(duì)象。

獲取字符unicode編碼
var s = "??";
var a = s.codePointAt()
//參數(shù)不寫默認(rèn)是第0位,超出長度為undefined
console.log(a) //134071

var s2 = "abcde";
console.log(s2.codePointAt()) //97
console.log(s2.codePointAt(1)) //98
console.log(s2.codePointAt(2)) //99
console.log(s2.codePointAt(10)) //undefined
通過unicode碼點(diǎn)返回對(duì)應(yīng)字符
//es5 ,不能識(shí)別輔助平面的字符
String.fromCharCode()
console.log(String.fromCharCode(97)) //a

//es6 ,可以識(shí)別輔助平面的字符
String.fromCodePoint()
console.log(String.fromCodePoint(0x20BB7)) //??
字符的Unicode表示法

JavaScript允許采用“\uxxxx”形式表示一個(gè)字符旋廷,其中“xxxx”表示字符的碼點(diǎn),"\u0061"http://a,

但是,這種表示法只限于\u0000——\uFFFF之間的字符坝疼。超出這個(gè)范圍的字符共耍,必須用兩個(gè)雙字節(jié)的形式表達(dá)。

//之前
console.log("\uD842\uDFB7") //??
console.log("\u0041\u0042\u0043") //ABC 省略了00游盲?
//es6,只要將碼點(diǎn)放入大括號(hào)误墓,就能正確解讀該字符蛮粮。
console.log("\u{20BB7}") //??
console.log("\u{41}\u{42}\u{43}") //ABC
復(fù)制字符串

將str復(fù)制幾分并返回,num代表復(fù)制的次數(shù)谜慌。

str.repeat(num)
var s = "abced";
console.log(s.repeat(2)) //abcedabced 
//新的字符串 不會(huì)影響原有的
查找字符串 str.includes()

參數(shù): 1然想、要查找的字符串 2、起始位置

返回布爾值欣范,表示是否找到了參數(shù)字符串

var str = "abcdef";
console.log("a") // true 不傳第2個(gè)參數(shù)默認(rèn)為0
console.log("g") //false
console.log("a",1) //false
字符串是否在源字符串的頭部 str.startsWith()

參數(shù): 1变泄、要查找的字符串 2、起始位置

返回布爾值

var str = "abcdef";
console.log(str.startsWith("a")) //true
console.log(str.startsWith("b")) //false
console.log(str.startsWith("b",1)) //true
console.log(str.startsWith("e",3)) //true
表示參數(shù)字符串是否在源字符串的尾部 str.endsWith()

參數(shù): 1恼琼、要查找的字符串 2妨蛹、起始位置(針對(duì)的是n個(gè)字符)

返回布爾值

var str = "abcdef";
console.log(s.endsWith("d")) //true
console.log(s.endsWith("d",3)) //false
console.log(s.endsWith("c",3)) //true

二進(jìn)制和八進(jìn)制表示法

ES6提供了二進(jìn)制和八進(jìn)制數(shù)值的新的寫法,分別用前綴0b和0o表示

Math對(duì)象的擴(kuò)展

Math.trunc() 去除小數(shù)部分返回整數(shù)部分

console.log(Math.trunc(1.25)) //1

Math.sign() 判斷一個(gè)數(shù)字是正數(shù)晴竞,負(fù)數(shù)還是零

返回值:

-1 負(fù)數(shù) 蛙卤;0 零 ; 1 :正數(shù)

console.log(Math.sign(-25)) //-1
console.log(Math.sign(0)) //0
console.log(Math.sign(0.01)) //1
Math.hypot(...values) 返回所有參數(shù)的平方和的平方根(勾股定理)
var h = [3,4];  //
console.log(Math.hypot(...h)) //5
console.log(Math.hypot(2,3,4)) //5.385164807134504

數(shù)組擴(kuò)展

Array.from()
用于將類數(shù)組對(duì)象轉(zhuǎn)為真正的數(shù)組

語法:Array.from(arrayLike[, mapFn[, thisArg]])

//不定參
function fn(){
    console.log(Array.from(arguments))
}噩死;
fn(1,2,3,4,5)颤难;//[1, 2, 3, 4, 5]

//字符串
console.log(Array.from("javascipt")) //["j", "a", "v", "a", "s", "c", "i", "p", "t"]
Array.of()
方法用于將一組值,轉(zhuǎn)換為數(shù)組已维。返回
console.log(Arry.of("a","b","c")) //["a","b","c"]
arr.find()

arr.find(callback[, thisArg])

callback接收3個(gè)參數(shù):elment 當(dāng)前遍歷到的元素行嗤, index 當(dāng)前遍歷到的索引,array 數(shù)組本身

找出第一個(gè)符合條件的數(shù)組元素,沒有返回undefined

var arry = [1,25,84,35]
var a = arry.find(function(el){
    return el > 15
})
console.log(a) //25

arr.findIndex()

找出第一個(gè)符合條件的數(shù)組元素的位置,沒有找到返回-1

var arry = [1,25,84,35]
var a = arry.findIndex(function(el){
    return el > 25
})
console.log(a) //2

arr.fill()

一個(gè)固定值填充一個(gè)數(shù)組中從起始索引到終止索引內(nèi)的全部元素

fill 方法接受三個(gè)參數(shù) value, start 以及 end. startend 參數(shù)是可選的, 其默認(rèn)值分別為 0this 對(duì)象的 length 屬性值.

如果 start 是個(gè)負(fù)數(shù), 則開始索引會(huì)被自動(dòng)計(jì)算成為 length+start, 其中 lengththis 對(duì)象的 length 屬性值. 如果 end 是個(gè)負(fù)數(shù), 則結(jié)束索引會(huì)被自動(dòng)計(jì)算成為 length+end.

arr.fill(value) 
arr.fill(value, start) 
arr.fill(value, start, end)

var arr1 = ["a","b","c","d"]
arr1.fill("x")
console.log(arr1) //["x", "x", "x", "x"]  只有value 默認(rèn)start為0 end為length
arr1.fill("x",1) //["a"衣摩,"x","x","x"];
arr1.fill("x",-1) //["a","b","c","x"];

//過界的話昂验,數(shù)組沒有變化

for of

對(duì)象沒有迭代器捂敌,需要自己去建

var arr = ["a","b","c","d"]
for(let v of arr) {
  console.log(v) //a b c d
}

for下數(shù)組擴(kuò)展

//arr.keys() 用于for of對(duì)數(shù)組鍵名的遍歷
var arr = ["a","b","c","d"]
for(let v of arr.keys()) {
  console.log(v) //0 1 2 3
}
//arr.values() 用于for of對(duì)數(shù)組鍵值的遍歷
//*目前瀏覽器未實(shí)現(xiàn)該方法

//arr.entries()用于for of對(duì)數(shù)組鍵值對(duì)的遍歷
var arr = ["a","b","c"]
for (var [index,ele] of arr.entries()) {
    console.log(index,ele) 
    // 0 "a" ,1 "b" ,2 "c"
}

數(shù)據(jù)結(jié)構(gòu)Set

在es6中新增了一個(gè)新的數(shù)據(jù)結(jié)構(gòu) - 集合,

Set是一個(gè)構(gòu)造函數(shù)艾扮,可以不傳入任何參數(shù)創(chuàng)建一個(gè)空的集合,也可以傳入一個(gè)數(shù)組對(duì)其進(jìn)行初始化

let s1 = new Set(["a","b","c"])

Set和數(shù)組類似占婉,但是Set的值是唯一的不重復(fù)的

  • 不能通過下標(biāo)進(jìn)行取值
  • 集合是一個(gè)可迭代的對(duì)象
  • 有一個(gè)屬性:size泡嘴,類似數(shù)組的length屬性
set.add(value) 為Set的實(shí)例添加值
 s1.add('d');
console.log(s1); //a b c d
set.delete(value) 刪除Set實(shí)例的值
s1.delete("a");
console.log(s1); //b c d
set.has(value) 判斷傳入的參數(shù)是否為set的成員
s1.has("b") //true
s1.has("x") //false
set.clear()清除set中所有成員
s1.clear(); {}

Map()

ES6提供了map數(shù)據(jù)結(jié)構(gòu)。它類似于對(duì)象逆济,也是鍵值對(duì)的集合酌予,但是“鍵”的范圍不限于字符串,各種類型的值(包括對(duì)象)都可以當(dāng)作鍵奖慌。

Map也可以接受一個(gè)數(shù)組作為參數(shù)抛虫。該數(shù)組的成員是一個(gè)個(gè)表示鍵值對(duì)的數(shù)組。

var arr = [1,2,3]
let m1 = new Map();
m1.set('a', 1); //{"a"=> 1}
m1.set('b', 1);
m1.set(arr, 'abc'); //{"a" => 1, "b" => 1, (3) [1, 2, 3] => "abc"}

get() 通過key獲取value

m1.get("a") //1

其他的set添加新的鍵值對(duì)简僧,has()查找key是否存在建椰,delete(),clear()方法和上面set使用方法一樣的

Class

糖衣語法,和構(gòu)造函數(shù)本質(zhì)上沒有區(qū)別

//之前構(gòu)造函數(shù)
function Creat(name,age){
  this.name = name;
  this.age = age;
}
Creat.prototype.say = function(){
    console.log(`我叫${this.name},我今年${this.age}歲`)
}
var c1 = new Creat("小明",18)
c1.say() //我叫小明,我今年18歲

Class語法

class Creat{
  constructor(name,age) {
    this.name = name;
    this.age = age;
  }
  say(){
    console.log(`我叫${this.name},我今年${this.age}歲`)
  }
}
var c1 = new Creat("小李",24)
c1.say() //我叫小李,我今年24歲

當(dāng)我們通過class模式創(chuàng)建擁有不同類型的對(duì)象時(shí)岛马,就可以extends(繼承)

class Occ extends Creat {  //Occ繼承Creat
  constructor(name,age,type){
    //super -> 父類構(gòu)造器
    super(name,age);  //相當(dāng)Creat.call(this)
    this.type = type
  }
}
var c2 = new Occ("小王",26,"老師")
c2.say();// 我叫小王,我今年26歲
c2.myJob()// 我的職業(yè)是司機(jī)
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末棉姐,一起剝皮案震驚了整個(gè)濱河市屠列,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌伞矩,老刑警劉巖笛洛,帶你破解...
    沈念sama閱讀 222,807評(píng)論 6 518
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異乃坤,居然都是意外死亡苛让,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,284評(píng)論 3 399
  • 文/潘曉璐 我一進(jìn)店門湿诊,熙熙樓的掌柜王于貴愁眉苦臉地迎上來蝌诡,“玉大人,你說我怎么就攤上這事枫吧∑趾担” “怎么了?”我有些...
    開封第一講書人閱讀 169,589評(píng)論 0 363
  • 文/不壞的土叔 我叫張陵九杂,是天一觀的道長颁湖。 經(jīng)常有香客問我,道長例隆,這世上最難降的妖魔是什么甥捺? 我笑而不...
    開封第一講書人閱讀 60,188評(píng)論 1 300
  • 正文 為了忘掉前任,我火速辦了婚禮镀层,結(jié)果婚禮上镰禾,老公的妹妹穿的比我還像新娘。我一直安慰自己唱逢,他們只是感情好吴侦,可當(dāng)我...
    茶點(diǎn)故事閱讀 69,185評(píng)論 6 398
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著坞古,像睡著了一般备韧。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上痪枫,一...
    開封第一講書人閱讀 52,785評(píng)論 1 314
  • 那天织堂,我揣著相機(jī)與錄音,去河邊找鬼奶陈。 笑死易阳,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的吃粒。 我是一名探鬼主播潦俺,決...
    沈念sama閱讀 41,220評(píng)論 3 423
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來了黑竞?” 一聲冷哼從身側(cè)響起捕发,我...
    開封第一講書人閱讀 40,167評(píng)論 0 277
  • 序言:老撾萬榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎很魂,沒想到半個(gè)月后扎酷,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,698評(píng)論 1 320
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡遏匆,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,767評(píng)論 3 343
  • 正文 我和宋清朗相戀三年法挨,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片幅聘。...
    茶點(diǎn)故事閱讀 40,912評(píng)論 1 353
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡凡纳,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出帝蒿,到底是詐尸還是另有隱情荐糜,我是刑警寧澤,帶...
    沈念sama閱讀 36,572評(píng)論 5 351
  • 正文 年R本政府宣布葛超,位于F島的核電站暴氏,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏绣张。R本人自食惡果不足惜答渔,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,254評(píng)論 3 336
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望侥涵。 院中可真熱鬧沼撕,春花似錦、人聲如沸芜飘。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,746評(píng)論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽燃箭。三九已至冲呢,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間招狸,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,859評(píng)論 1 274
  • 我被黑心中介騙來泰國打工邻薯, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留裙戏,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 49,359評(píng)論 3 379
  • 正文 我出身青樓厕诡,卻偏偏與公主長得像累榜,于是被迫代替她去往敵國和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,922評(píng)論 2 361

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

  • 概要 64學(xué)時(shí) 3.5學(xué)分 章節(jié)安排 電子商務(wù)網(wǎng)站概況 HTML5+CSS3 JavaScript Node 電子...
    阿啊阿吖丁閱讀 9,223評(píng)論 0 3
  • 第5章 引用類型(返回首頁) 本章內(nèi)容 使用對(duì)象 創(chuàng)建并操作數(shù)組 理解基本的JavaScript類型 使用基本類型...
    大學(xué)一百閱讀 3,238評(píng)論 0 4
  • [TOC] 參考阮一峰的ECMAScript 6 入門參考深入淺出ES6 let和const let和const都...
    郭子web閱讀 1,783評(píng)論 0 1
  • 官網(wǎng) 中文版本 好的網(wǎng)站 Content-type: text/htmlBASH Section: User ...
    不排版閱讀 4,408評(píng)論 0 5
  • 參考基礎(chǔ)教程的整理壹罚,方便記憶 一葛作、Object對(duì)象 (O大寫) 所有其他對(duì)象都繼承自這個(gè)對(duì)象。Object本身也是...
    Viaphlyn閱讀 2,332評(píng)論 0 0