Some useful JS techniques that you may not know

stackvoid 发布于2019-08-22 15:18 / 2292人阅读

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.

专线服务服务器托管 js $$.use techniques May Know

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

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

某熊周刊系列:一周推荐外文技术资料(2.6)

摘要：某熊周刊系列一周推荐外文技术资料归纳于某熊周刊一周推荐外文技术资料是笔者每周浏览外文技术网站中时发现的不错的文章项目书籍教程的集锦，可以关注笔者的专栏某熊的全栈之路及时获取更新。另外，周刊中的技术知识框架图参照笔者的我的编程知识体系结构。某熊周刊系列:一周推荐外文技术资料(2.6)归纳于某熊周刊:一周推荐外文技术资料是笔者每周浏览外文技术网站中时发现的不错的文章/项目/书籍/教程的集...

whlong 2019-06-26 15:40 评论0 收藏0
Android NDK and OpenCV Development With Android St

摘要：说了一堆废话，言归正传，本文的重点是介绍如何在中进行开发目前它还不完全支持开发，难点是中还包含的动态库。最后的最后，本文剩下部分将使用英文，因为它要成为我在上的处女答，么么哒， ---------------- If you do NOT know Chinese, you can just skip this part ---------------- 一直打算将原来的XFace进...

xiaoqibTn 2019-06-24 18:55 评论0 收藏0
【OpenCV4 官方文档】机器学习概述

摘要：使用训练数据算法估计每个类别的平均向量和协方差矩阵，然后用它们进行预测。 Machine Learning Overview 文章目录 Machine Learn...

Labradors 2021-09-07 09:59 评论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...

leonardofed 2019-08-23 13:46 评论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 2019-08-02 12:08 评论0 收藏0