写点什么

JavaScript 这几个“神(qi)奇 (pa)“设计也是醉了......

作者:掘金安东尼
  • 2022 年 9 月 14 日
    广东
  • 本文字数:1240 字

    阅读完需:约 4 分钟

JavaScript 这几个“神(qi)奇(pa)“设计也是醉了......

JavaScript 有太多“神奇”之处我想不用再多赘述!



本篇带来 JS 几个“神奇”设计,先别急着吐槽,有遇到过加强更正,没遇到过以后尽量避免!


奥力给,冲了!🏄‍

你有鹰眼吗?

请问以下这段代码,输出是?


const numbers = [1, 2, 3, 4];
for (var i = 0; i < numbers.length; i++);{
console.log(`The number is ${numbers[i]}`) }
复制代码


结果是:


// The number is undefined
复制代码


哈?先别急,再看一段代码:


const numbers = [1, 2, 3, 4];
for (var i = 0; i < numbers.length; i++){
console.log(`The number is ${numbers[i]}`) }
复制代码


它的打印才是:


// The number is 1// The number is 2// The number is 3// The number is 4
复制代码


你有鹰眼吗? 原来,这两端代码的差异在于 for 循环括号条件后的那个分号!!


for (var i = 0; i < numbers.length; i++); <==== 就是这个分号
复制代码


。。。u1s1,多少有点扯了,多个分号不会报错,并且是另外一种结果;

变量提升?

再猜下以下这段代码的输出:


numbers();
var numbers = function () { console.log("Number one");}
numbers();
function numbers() { console.log("Number two");}
numbers();
复制代码


答案是:


// Number two// Number one// Number one
复制代码


这也很神奇,以不同方式定义函数会带来不同的效果~


变量提升总会搞得人五迷三道~


除了 function numbers() 这样声明函数会导致变量提升,还有 var 声明方式导致的变量提升,比如:


console.log(a);
var a;
console.log(b);
复制代码


// undefined
// Uncaught ReferenceError: b is not defined
复制代码

闭包?

猜以下输出:


let counter = function() {  
let k = 0;
return () => k++;
}();
console.log(counter());console.log(counter());console.log(counter());console.log(counter());
复制代码


答案是:


// 0
// 1
// 2
// 3
复制代码


没错,闭包记录了执行结果;


闭包的另一种情况:


let count = 0;
(function immediate() {
if (count === 0) {
let count = 1;
console.log(count); // What is logged?
}
console.log(count); // What is logged?
})();
复制代码


结果是:


// 1
// 0
复制代码


神奇~ 闭包就得细看~

this 指向?

this 指向别提了,就更神奇!



猜以下代码输出:


var length = 4;
function callback() {
console.log(this.length);
}
const object = {
length: 5,
method() {
arguments[0]();
}};
object.method(callback, 1, 2);
复制代码


输出是:


// 3
复制代码

数组长度?

const fruits = [‘mango’, ‘apple’];
fruits.length = 0;
console.log(fruits[0]);
复制代码


竟然可以通过设置长度的方式,清除数组:


// undefined
复制代码


神奇~~


<hr>


小感:说是 JS 的神(qi)奇(pa),其实也就是 JS 作为脚本语言的灵活的特点,面对这些特点,得尤其小心使用,才不至于被搞蒙~~


OK,以上就是本篇分享~ 撰文不易,点赞鼓励👍👍👍


我是掘金安东尼,公众号同名,日拱一卒、日掘一金,再会~

发布于: 刚刚阅读数: 4
用户头像

安东尼陪你度过漫长编程岁月~ 2022.07.14 加入

社会我瓜哥,人狠话不多😎 微信 anthony1453,加我交个朋友😎 正联合【机械工业出版社】出版《程序员成长手册》,敬请期待😎 真正的大师,永远怀着一颗学徒的心(易)😎

评论

发布
暂无评论
JavaScript 这几个“神(qi)奇(pa)“设计也是醉了......_JavaScript_掘金安东尼_InfoQ写作社区