JS标准库

 学习一门编程语言不仅是掌握其语法。同等重要的是学习其标准库,从而熟练掌握语言本身提供的所有工具。

1 定型数组

js常规数组与C和Java等较低级语言的数组类型还是有很大区别。ES6新增了定型数组,与这些语言的低级数组非常接近。

定型数组严格来说并不是数组(Array.isArray()对它们返回false),但它们实现了所有数组方法,外加几个它们自己的方法。定型数组与常规数组存在如下几个非常重要的区别:

1)定型数组的元素全部都是数值。定型数组允许指定存储在数组中的数值类型和大小。

2)创建定型数组时必须指定长度,且该长度不能再改变。

3)定型数组的元素在创建时始终都会被初始化为0。

1.1 创建定型数组

1)调用相应的构造函数,并传入一个表示数组元素个数的数值参数:

let bytes = new Uint8Array(1024);

let rgba = new Uint8ClampedArray(4);

2) 静态工厂方法of():

let point = Int16Array.of(2,4,5);

3) 静态工厂方法from():

let newPoint = Int16Array.from(point);

4) 使用ArrayBuffer 。ArrayBuffer是对一块内存的不透明引用。通过其构造函数创建,参数为想分配内存的字节数。

let buffer = new ArrayBuffer(1024 * 1024);

buffer.byteLength; // 1M内存

ArrayBuffer不允许读取或写入分配的任何字节。但是可创建使用该缓冲区内存的定型数组,通过这个数组来读取或写入内存。在调用构造定型数组的构造函数时,需要将ArrayBuffer当作第一个参数,第2个参数时该缓冲区的字节偏移量,第3个参数是数组的长度。 如果省略第2及第3个参数,则数组会使用缓冲区的所有内存。

int lastk = new Uint8Array(buffer,0, 1024 / 8);

let ints2 = new Int32Array(buffer,1024,256);

上面2个定型数组提供了对ArrayBuffer所表示内存的2个不同视图。

所有定型数组底层都有一个ArrayBuffer,即使你没明确指定。之所以需要直接指定,是因为有时可能需要一个缓冲区的多个定型数组视图。

1.2 定型数组的方法与属性

1)set() 把其他常规数组或定型数组的元素复制到当前定型数组中。第1个参数是一个数组或定型数组,第2个参数时偏移量(不指定则为0)。

let arr = new Int8Array(6);
arr.set([1,2]);
console.log(arr); // [1,2,0,0,0,0]
arr.set([3,4],1);
console.log(arr); // [1,3,4,0,0,0]

2) subarray() 返回调用它的定型数组的一部分。第1个参数表示开始位置,第2个参数结束位置。subarray()不复制内存,只返回底层值的一个新视图。

let arr = new Int8Array([1,2,3,4,5,6]);
let subArr = arr.subarray(4);
console.log(subArr); // [5,6]
arr[4] = 99;
console.log(arr); // [1,2,3,4,99,6]
console.log(subArr); // [99,6]

3) 定型数组的属性:

arr.buffer; // 定型数组的ArrayBuffer对象

arr.buffer == subArr.buffer; // true,都是同一缓冲区的视图

subArr.byteOffset; // 4, 从缓冲区的字节4开始

subArr.byteLength; // 2 视图长度为2

2 正则表达式与模式匹配

正则表达式通过RegExp对象来表示。RegExp对象可以使用RegExp()构造函数创建,但更多时通过一种特殊的字面量语法来创建:包含在一对斜杠(/)字符之间的字符,例如 /he+[2]/。

2.1 模式匹配的字符串方法

1)search(),接收一个正则表达式参数,返回第一个匹配项起点字符的位置。

"hello word.what is this?".search(/\bw/); // 6

2) replace(),第一个参数是正则表达式,第二个参数是替换字符串。如果正则表达式带g标志,则其会替换所有匹配项,否则只替换第一个匹配项。

"He said 'stop'".replace(/'([^']*)'/g,"《$1》") // He said 《stop》

replace() 第二个参数还可以是一个函数,其第一个参数是匹配的整个文本。

"He said 'stop'".replace(/(?<=')([^']*)(?=')/g,text => "《" + text + "》") //He said '《stop》'

3) match(),唯一参数是一个正则表达式。返回一个数组,包含匹配的结果,如果正则表达式没有g标志,返回的第一个元素是匹配的字符串,剩下的所有元素是正则表达式中括号分组的捕获组匹配的子字符串。

let url = /(?<protocol>\w+):\/\/(?<host>[\w.]+)\/(?<path>\S*)/;
let text = "Visit my blog at https://blog.csdn.net/qq_25308331?type=blog";
let math = text.match(url);
console.log(math[0]); // https://blog.csdn.net/qq_25308331?type=blog
console.log(math.input); // "Visit my blog at https://blog.csdn.net/qq_25308331?type=blog";
console.log(math.index); // 17
console.log(math.groups.protocol); // https
console.log(math.groups.host); // blog.csdn.net
console.log(math.groups.path); // qq_25308331?type=blog

在非全局搜索的情况下,math()返回的数组除了可以通过数组索引元素,也有一些对象属性。

4) split(),接收一个正则表达式参数,注意,如果这个正则表达式中包含捕获组,则捕获组匹配的文本也会包含在返回的数组中。

"Testing<br/>1,2,3".split(/<([^>]+)>/) // [ 'Testing', 'br/', '1,2,3' ]

2.2 RegExp类

RegExp构造函数第一个参数是正则表达式,第二个参数代表正则表达式的标志:g 全局性,i 不区分大小写,m 以多行模式进行,s与m类似。这些标志可以任意组合。

1)test(),接收一个字符串,如果匹配则返回true。

/h[1-3]/.test("h34"); // true

2) exec(),接收一个字符串,如果没有找到匹配项,则返回null。如果找到,则返回一个数组,跟字符串的match()方法在非全局搜索时返回的数组一样。(无论是否有g标志,都只返回同样数组)。

3 其他函数

3.1 集合与映射

js的Object类型是一种万能结构,可用于把字符串(对象的属性名)映射为任意值。对象在js编程中经常被用作映射和集合,但却要受到对字符串约束的限制,另外对象正常都会继承带名字的属性。这些特征明显不是为映射和集合准备的。

ES6新增了真正的Set和Map类。

3.1.1 Set类

与数组类似,但集合没有索引,也不允许重复。

集合成员根据严格相等来判断是否重复的。

let set. = new Set();

set.add({}).add({}); // 添加了两个元素,因为这两个元素不等。

Set 最重要的是用来检查某个值是不是集合的成员(has()方法),该方法比数组的includes()方法执行速度快得多。

3.1.2 WeakMap和WeakSet

WeakMap(弱映射) 是Map类的一个变体(不是子类)。它不会阻止元素被当作垃圾收集。

WeakMap的主要用途是实现值与对象的关联而不导致内存泄露。

3.2 控制台API

console.trace(),会像console.log()一样打印它的参数,此外在输出之后还会打印栈跟踪信息。

console.count(),这个函数接收一个字符串参数,并打印该字符串,后面跟着已经通过该字符串调用的次数。在调试事件处理程序时,可以通过它来知道事件处理程序被触发的次数。

for (let i = 0; i < 5; i++) {
    console.count("hello");
}
// hello: 1
// hello: 2
// hello: 3
// hello: 4
// hello: 5

console.countReset(),接收一个字符串参数,并重置该字符串的计数器。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值