JavaScript中8个容易犯的错误

JavaScript中8个容易犯的错误

文章目录
1. 你是否尝试过对数组元素进行排序?
2. new Date() 十分好用
3. 替换函数没有真的替换?
4. 谨慎对待比较运算
5. 数组不是基础类型
6. 闭包
7. 关于bind
8. Math.min()比Math.max()大

原文标题:JavaScript中8个常见的陷阱
这里我们针对JavaScript初学者给出一些技巧和列出一些陷阱。如果你已经是一个砖家,也可以读一读。

  1. 你是否尝试过对数组元素进行排序?
    JavaScript默认使用字典序(alphanumeric)来排序。因此,[1,2,5,10].sort()的结果是[1, 10, 2, 5]。
    如果你想正确的排序,应该这样做:[1,2,5,10].sort((a, b) => a - b)

  2. new Date() 十分好用
    new Date()的使用方法有:
    不接收任何参数:返回当前时间;
    接收一个参数x: 返回1970年1月1日 + x毫秒的值。
    new Date(1, 1, 1): 返回1901年2月1号。
    然而….,new Date(2016, 1, 1)不会在1900年的基础上加2016,而只是表示2016年。

  3. 替换函数没有真的替换?
    let s = "bob"const replaced = s.replace('b', 'l')replaced === "lob" // 只会替换掉第一个bs === "bob" // 并且s的值不会变
    如果你想把所有的b都替换掉,要使用正则:
    "bob".replace(/b/g, 'l') === 'lol'

  4. 谨慎对待比较运算
    // 这些可以'abc' === 'abc' // true1 === 1 // true// 然而这些不行[1,2,3] === [1,2,3] // false{a: 1} === {a: 1} // false{} === {} // false
    因为[1,2,3]和[1,2,3]是两个不同的数组,只是它们的元素碰巧相同。因此,不能简单的通过===来判断。

  5. 数组不是基础类型
    typeof {} === 'object' // truetypeof 'a' === 'string' // truetypeof 1 === number // true// 但是....typeof [] === 'object' // true
    如果要判断一个变量var是否是数组,你需要使用Array.isArray(var)。

  6. 闭包
    这是一个经典的JavaScript面试题:
    const Greeters = []for (var i = 0 ; i < 10 ; i++) { Greeters.push(function () { return console.log(i) })}Greeters0 // 10Greeters1 // 10Greeters2 // 10
    虽然期望输出0,1,2,…,然而实际上却不会。知道如何Debug嘛?有两种方法:
    使用let而不是var。
    使用bind函数。

  7. 关于bind
    下面这段代码会输出什么结果?
    class Foo { constructor(name) { this.name = name } greet() { console.log('hello, this is ', this.name) } someThingAsync() { return Promise.resolve() } asyncGreet() { this.someThingAsync().then(this.greet) }}new Foo('dog').asyncGreet()
    程序会崩溃,并且报错:Cannot read property ‘name’ of undefined。
    1、因为第16行的greet没有在正确的环境下执行。当然,也有很多方法解决这个BUG!
    我喜欢使用bind函数来解决问题:
    asyncGreet () {this.someThingAsync().then(this.greet.bind(this))}
    这样会确保greet会被Foo的实例调用,而不是局部的函数的this。
    2、如果你想要greet永远不会绑定到错误的作用域,你可以在构造函数里面使用bind来绑 。
    class Foo { constructor(name) { this.name = name this.greet = this.greet.bind(this) }}
    3、你也可以使用箭头函数(=>)来防止作用域被修改。备注:可以参考Fundebug的另一篇博客 JavaScript初学者必看“箭头函数”。
    asyncGreet() { this.someThingAsync().then(() = >{ this.greet() })}

  8. Math.min()比Math.max()大
    Math.min() < Math.max() // false
    因为Math.min() 返回 Infinity, 而 Math.max()返回 -Infinity。

来自:https://blog.fundebug.com/2017/06/28/who-said-js-was-easy/
译者:fundebug
原文:https://hackernoon.com/who-said-javascript-easy-f4a1d5b399b8

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 199,519评论 5 468
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 83,842评论 2 376
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 146,544评论 0 330
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 53,742评论 1 271
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 62,646评论 5 359
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,027评论 1 275
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,513评论 3 390
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,169评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,324评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,268评论 2 317
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,299评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,996评论 3 315
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,591评论 3 303
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,667评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,911评论 1 255
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,288评论 2 345
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 41,871评论 2 341

推荐阅读更多精彩内容

  • 第5章 引用类型(返回首页) 本章内容 使用对象 创建并操作数组 理解基本的JavaScript类型 使用基本类型...
    大学一百阅读 3,204评论 0 4
  • //Clojure入门教程: Clojure – Functional Programming for the J...
    葡萄喃喃呓语阅读 3,612评论 0 7
  • 我终于剪断了我的长发。 那些黝黑的丝带。 铺满了青砖。 我拾起一缕。 一梳梳到尾。 二梳梳到白发齐眉。 三梳梳到儿...
    思为君臣阅读 271评论 0 0
  • 你在或者不在爱就在那里不曾永恒也不会流亡 爱或者不爱我就在那里不曾失去也不曾得到 你来或者不来春天就在那里
    心花园子阅读 214评论 0 2
  • 老刘一家部分成员 您们为了子女们您们辛苦了 爸妈你们辛苦了。 我们的兄弟姐妹们 未来栋梁。你们加油吧!
    刘东升阅读 157评论 0 0