2000字范文,分享全网优秀范文,学习好帮手!
2000字范文 > 你绝对不知道的JS冷知识

你绝对不知道的JS冷知识

时间:2019-09-14 22:23:17

相关推荐

你绝对不知道的JS冷知识

1. **运算符

x*n 相当于 Math.pow(x,n) , 即x的n次方

一个是乘 两个*就是乘方了

2. 空值合并:??操作符

当我们想检查一个变量是否为 null 或 undefined 时,??操作符很有用。当它的左侧操作数为null 或 undefined时,它返回右侧的操作数,否则返回其左侧的操作数。

const foo = null ?? 'Hello';console.log(foo); // 'Hello'const bar = 'Not null' ?? 'Hello';console.log(bar); // 'Not null'const baz = 0 ?? 'Hello';console.log(baz); // 0

在第三个示例中,返回 0,因为即使 0 在 JS 中被认为是假的,但它不是null的或undefined的。你可能认为我们可以用||算子但这两者之间是有区别的

你可能认为我们可以在这里使用 || 操作符,但这两者之间是有区别的。

const cannotBeZero = 0 || 5;console.log(cannotBeZero); // 5const canBeZero = 0 ?? 5;console.log(canBeZero); // 0

3. es6 新数据类型BigInt

BigInt 类型是 JavaScript 中的数字原始类型,可以表示任意精度的整数。使用 BigInts,您可以安全地存储和操作大整数,甚至超出 Numbers 的安全整数限制。

BigInt 是通过附加n到整数的末尾或调用构造函数来创建的。

您可以使用常量 获得可以随 Numbers 递增的最大安全值Number.MAX_SAFE_INTEGER。随着 BigInts 的引入,您可以操作超出Number.MAX_SAFE_INTEGER.

下面例子演示了增加Number.MAX_SAFE_INTEGER返回预期结果的地方:

> const x = 2n ** 53n;9007199254740992n> const y = x + 1n;9007199254740993n

您可以将运算符+、*、-、**和%与 BigInts 一起使用——就像使用 Numbers 一样。BigInt 并不严格等于 Number,但大致如此。

在将 BigInt 转换为布尔值的情况下,BigInt 的行为类似于 Number:if, ||, &&, Boolean, !。

BigInts 不能与 Numbers 互换操作。而是TypeError会抛出 a 。

4. 类型判断之Object.prototype.toString

类型判断有好几种方式,分别为:

typeofinstanceofObject.prototype.toStringisXXX,比如 isArray

下面我们说说Object.prototype.toString进行判断:

当 toString 方法被调用的时候,下面的步骤会被执行: 如果 this 值是 undefined,就返回 [object Undefined]如果 this 的值是 null,就返回 [object Null]让 O 成为 ToObject(this) 的结果让 class 成为 O 的内部属性 [[Class]] 的值最后返回由 "[object " 和 class 和 “]” 三个部分组成的字符串

通过规范,我们至少知道了调用 Object.prototype.toString 会返回一个由 "[object " 和 class 和 “]” 组成的字符串,而 class 是要判断的对象的内部属性。

**那它能识别哪些数据类型呢?**我告诉你,有14种!

// 以下是11种:var number = 1;// [object Number]var string = '123';// [object String]var boolean = true;// [object Boolean]var und = undefined;// [object Undefined]var nul = null;// [object Null]var obj = {a: 1} // [object Object]var array = [1, 2, 3]; // [object Array]var date = new Date(); // [object Date]var error = new Error(); // [object Error]var reg = /a/g;// [object RegExp]var func = function a(){}; // [object Function]function checkType() {for (var i = 0; i < arguments.length; i++) {console.log(Object.prototype.toString.call(arguments[i]))}}checkType(number, string, boolean, und, nul, obj, array, date, error, reg, func)

//又是两种console.log(Object.prototype.toString.call(Math)); // [object Math]console.log(Object.prototype.toString.call(JSON)); // [object JSON]

//再来一种function a() {console.log(Object.prototype.toString.call(arguments)); // [object Arguments]}a();

5. css选择器 :empty | :blank | :not | :is | X[attribute]

:empty 伪类选择器匹配没有子元素(包括文本节点,包括空格)的每个元素。

:blank 伪类选择器匹配用户输入为空的输入框,如 和 (可以允许空格存在),不过目前这个选择器只是实验中的功能,慎用!。

:not(selector) 伪类选择器匹配非指定元素/选择器的每个元素。

:is() 伪类选择器来删除选择器列表中的重复项。

a[title] 这个属性选择器匹配的是带有title属性的链接元素。

6.startsWith()方法

查看字符串是否为“你好”的开头:

var str = “Hello world,欢迎来到前端阿彬的博客~” ;

var n = str.startsWith (“Hello”) ;

输出: true

后续补充。。。**

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。