网站ip域名查询,代做网页设计作业,网站建设首选唯美谷,网站基础代码html前言
如果我问在JavaScript中#xff0c;你用到的最常见的运算符是什么#xff0c;你可能会回答以下几种#xff1a;
、 -、 *、/、 %、 、 ?、 !、 、 ||、 、
如果我问你知道但是不常用、不会用的运算符#xff0c;你可能会回答以下几种#xff…前言
如果我问在JavaScript中你用到的最常见的运算符是什么你可能会回答以下几种
、 -、 *、/、 %、 、 ?、 !、 、 ||、 、
如果我问你知道但是不常用、不会用的运算符你可能会回答以下几种
、 |、 ~、 ^、 ,
但以上都不是本文要说的内容本文要说的是另外几种。
双感叹号!!
它并不能算是一种特殊的运算符而是对非运算符!的两次连续调用。
对于它没什么好说的懂得都懂。因为JavaScript具有隐式转换类型像、0、null、undefined会被转换为false。
但在一些源码当中为了好理解也可能是让代码更加严谨通常使用双感叹号来将一个空的状态强制转换为boolean类型用于后续更加严谨的判断。
空值合并运算符??
他的用法和||类似都是在取值时用于判定。
不同的是 ||在前值为false时才会去运算||后面的值。而??是在前值为 undefined 和 null 时才会运算后面的值。这也是他叫空值合并运算符的原因。
console.log(null ?? default string); // default string
console.log(undefined ?? 33); // 33
console.log(false ?? 22); // false
console.log( ?? 11); //
console.log(0 ?? 42); // 0使用场景大家应该都能想得到和||有些类似只不过他比||更细致。有点类似于ES6函数形参中默认赋值等于号的用法。
也相当于是对三目的一种省略看起来也简洁明了一点。
// let person data.xx ? data.xx : {name: NiGuang}; 三目
let person data.xx ?? {name: NiGuang};需要注意的是他不能与 或 || 运算符共用 因为空值合并运算符和其他逻辑运算符之间的运算优先级/运算顺序是未定义的这种情况下会抛出 [SyntaxError] 。
可选链式运算符?.
首先要注意的是这个运算符不是问号?而是?.后面多一个点二者有本质上的区别。 可选链运算符 ?. 允许读取位于连接对象链深处的属性的值而不必明确验证链中的每个引用是否有效。?. 运算符的功能类似于 . 链式运算符不同之处在于在引用为空 (nullish ) (null 或者 undefined) 的情况下不会引起错误该表达式短路返回值是 undefined。与函数调用一起使用时如果给定的函数不存在则返回 undefined。 当尝试访问可能不存在的对象属性时可选链运算符将会使表达式更短、更简明。在探索一个对象的内容时如果不能确定哪些属性必定存在可选链运算符也是很有帮助的。 看完MDN的介绍还是不太明白举个小例子告诉你怎么用 let grade {data: {productList: []},resp: success,code: 1000
}// 以前获取层级深得数据需要先用if判断每一层是否存在不然会报错。
console.log(grade.data.productList[0].name);// VM2765:9 Uncaught TypeError: Cannot read properties of undefined (reading name) at anonymous:9:39let grade1 {data: {},resp: success,code: 1000
}/** 使用了可选链式运算符之后直接写如果在其中一层没找到会自动赋值为undefined不再向 后查找避免了使用if进行一层层判断。
* 当接口未按规定返回时也不会报错阻塞程序导致白屏。
* 当然代价是你要对使用这个值进行判空处理不然在用的时候undefined还是会报错。
*/
console.log(grade1.data?.productList[0]?.name); // undefined
~~
就这就这前面你说的我都见过并且已经在用了。
那这个你见过吗
它与前面的双感叹号相同也不是一个特殊的运算符。而是对单一运算符的连续两次重复调用即对位运算符~的两次调用。位运算我们不常用不深入就主要来看~~的作用。
作用
他可以用来对小数向下取整。
就这就这溜了溜了说了半天还以为什么东西我直接Math.floor()完事。
兄弟先别走如果Math.floor()能解决那我当然不会说这个了。先说下我遇到他的经历。
经历
最近刷leetcode遇到这样一道题求一个数的平方根如果有小数就向下取整。例如8的平方根为2。
这一下给我整高兴了这用JavaScript实现和 1 1等于几有什么区别于是我就提交了Math.floor(Math.sqrt(x))。
提交后显示运行时间为68 ms击败79.59%的人大部分人都采用了这种方法。看着这个接近80%的数字我就在想那20%是用了什么方法比这个还快呢带着好奇心我点开了用时最少的代码就看到了~~(Math.sqrt(x))。
与Math.floor()的异同
快
前面说了他是连续两次位运算又介绍了我遇到他的经历。
那么它比Math.floor()的好处显而易见那就是快快快。只用了40ms比Math.floor()整整快了28ms。
负数也是向下取整
第二个区别就是再对负数取整时Math.floor()是按照数学上的小去取整负数值越大越小而~~依然是抹掉零头式取整。
console.log(Math.floor(-2.8)); // -3
console.log(~~-2.8); // -2这种一看就是个位运算符他的名字叫右移运算符。如果不是刷leetcode大概他我也一辈子不会遇到他吧。以下是MDN关于他的介绍 右移运算符 将一个操作数的二进制表示形式向右移动指定位数该操作数可以是数值或者 BigInt 类型。右边移出位被丢弃左边移出的空位补符号位最左边那位。该操作也称为“符号位传播右移”sign-propagating right shift或“算术右移”arithmetic right shift因为返回值的符号位与第一个操作数的符号位相同。 看不懂不要紧在我所见到的场景中大家使用它最多的地方就是求二分法中间值的索引。
在求中间值时要注意左边是两个数的加和右边永远是1.
例如下面的例子
// 求2,7的中间值
console.log(Math.floor(2 (7 - 2) / 2)); // 4
console.log(Math.floor((2 7) / 2)); // 4
console.log((2 7) 1); // 4同样它的好处依然是 快快快在leetcode中用时排名靠前的JavaScript算法基本都使用了位运算。它可以快到帮你超越10%的对手。
前端面试题库 面试必备 推荐★★★★★
地址前端面试题库
