资讯专栏INFORMATION COLUMN

Some useful JS techniques that you may not know

stackvoid / 2385人阅读

I complete reading JavaScript Enlightenment recently. The book is more about basics in JavaScript and suitable for beginners. Here are a list of my benefits and extensions from the book.

Math

JavaScript developers often capitalize the constructor name to distinguish the constructors from normal functions. Therefore, some developers may mistake Math as function since the name is capitalized while Math is really just an object.

console.log(typeof Math); // object
console.log(typeof Array); // function
Function

There are two ways to construct a function:

Function declaration/expression

function sum(x, y) {
    return x + y;
}
console.log(sum(3,4)); //7

Function constructor

let multiply = new Function("x", "y", "return x * y;");
console.log(multiply(3,4)); //12

In development, we often need to use call or apply to switch the function context. E.g.

function print(){
    console.log(this.a);
}

print.call({a: "hello"}); //hello

Some interview questions will ask why print doesn"t define call as its property but print.call() won"t throw error. It"s because print is an instance from Function constructor so it inherits all the methods defined in Function.prototype through prototype chain.

print.call === Function.prototype.call
How to do Array check

typeof can be used to determine the types for primitive datatypes. But it won"t be able to distinguish between arrays and objects.

console.log(typeof [1,2]); //object
console.log(typeof {}); //object

There are several wasy to do Array check:

API: Array.isArray

console.log(Array.isArray([1,2])); //true

toString

console.log(Object.prototype.toString.call([1,2])
            .toLowerCase() === "[object array]"); //true

Note here we have to use Object.prototype.toString with call to switch the calling context, as Array.prototype.toString is overriden.

console.log(Object.prototype.toString.call([1,2])); //[object Array]
console.log([1,2].toString()); //1,2

instanceof

[1,2] instanceof Array === true;

Object.prototype.toString won"t work for custom datatypes. In this case we can use instanceof to determine the type.

class Person {}

let mike = new Person();
console.log(Object.prototype.toString.call(mike)); // [object Object]
console.log(mike instanceof Person); // true
undefined vs null undefined - no value

There are two cases where a variable is undefined.

The variable is deifned but not assigned any value.

let s;
console.log(s); //undefined

The variable is NOT defined at all.

let obj1 = {};
console.log(obj1.a); //undefined
null - special value
let obj2 = {a: null};
console.log(obj2.a); //null

If we aim to filter out undefined and null, we can use weak comparison with double equality sign(i.e. ==).

console.log(null == undefined); //true
let arr = [null, undefined, 1];
let fil = arr.filter(it => {
    return it != null;
});
console.log(fil); //[1]
Reference

JavaScript Enlightenment

Notice

If you benefit from this Repo,Please「Star 」to Support.

If you want to follow the latest news/articles for the series of reading notes, Please 「Watch」to Subscribe.

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/93348.html

相关文章

  • Browsers Disabled Audio AutoPlay

    If you have used audio or video, I guess you probably know autoplay attribute. Sometimes, PM wants to use that. However, the browsers doesnt want that. When I was using autoplay on 2018.10, I find tha...

    leonardofed 评论0 收藏0
  • Browsers Disabled Audio AutoPlay

    If you have used audio or video, I guess you probably know autoplay attribute. Sometimes, PM wants to use that. However, the browsers doesnt want that. When I was using autoplay on 2018.10, I find tha...

    kycool 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<