Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

What are the common traps in JavaScript

2025-04-10 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/02 Report--

This article mainly explains "what are the common traps in JavaScript". The content of the explanation is simple and clear, and it is easy to learn and understand. Please follow the editor's train of thought to study and learn what are the common traps in JavaScript.

1. Have you ever tried to sort array elements?

JavaScript uses dictionary order (alphanumeric) to sort by default. Therefore, [1, 2, 5, 5, 10]. Sort () results in [1, 10, 2, 5].

If you want to sort correctly, you should do this: [1Jing 2jue 5je 10] .sort ((a, b) = > a-b)

2. New Date () is very useful

New Date () can be used in the following ways:

Do not receive any parameters: return the current time

Receive a parameter x: returns the value of January 1, 1970 + x milliseconds.

New Date (1,1,1) returns to February 1, 1901.

However... New Date (2016, 1, 1) will not add 2016 to 1900, but just means 2016.

3. There is no real replacement for the replacement function?

Let s = "bob"

Const replaced = s.replace ('baked,' l')

Replaced = = "lob" / / will only replace the first b

S = = "bob" / / and the value of s will not change

If you want to replace all the bs, use the regular:

"bob" .replace (/ bUnip g,'l') = = 'lol'

4. Be cautious about comparison operation

/ / these will do.

'abc' = =' abc' / / true

1 = 1 / / true

/ / however, these do not work.

[1pr 2jue 3] = / / false

{a: 1} = = / false

{} = / / false

Because [1BET 2p3] and [1JRO 2p3] are two different arrays, but their elements happen to be the same. Therefore, it cannot be judged simply by =.

5. Array is not a base type

Typeof {} = = 'object' / / true

Typeof'a'= = 'string' / / true

Typeof 1 = = number / / true

/ / but.

Typeof [] = = 'object' / / true

If you want to determine whether a variable var is an array, you need to use Array.isArray (var).

6. Closure

This is a classic JavaScript interview question:

Const Greeters = []

For (var I = 0; I

< 10 ; i++) { Greeters.push(function () { return console.log(i) }) } Greeters[0]() // 10 Greeters[1]() // 10 Greeters[2]() // 10 虽然期望输出0,1,2,…,然而实际上却不会。知道如何Debug嘛? 有两种方法: 使用let而不是var。备注:可以参考Fundebug的另一篇博客 ES6之"let"能替代"var"吗? 使用bind函数。备注:可以参考Fundebug的另一篇博客 JavaScript初学者必看"this" Greeters.push(console.log.bind(null, i)) 当然,还有很多解法。这两种是我最喜欢的! 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行的geet没有在正确的环境下执行。当然,也有很多方法解决这个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、你也可以使用箭头函数(=>

To prevent the scope from being modified Note: you can refer to another Fundebug blog JavaScript beginners must see "Arrowhead function".

AsyncGreet () {

This.someThingAsync () .then (() = > {

This.greet ()

})

}

8. Math.min () is larger than Math.max ()

Math.min () < Math.max () / / false

Thank you for your reading, the above is the content of "what are the common traps in JavaScript". After the study of this article, I believe you have a deeper understanding of the common traps in JavaScript, and the specific use needs to be verified in practice. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report