关于javascript:ES11中的globalThis和可选链

小编明天更新的这两个新个性次要是编码能够更不便，同时也减少了兼容性，globalThis次要是提供了一个规范的形式去获取不同环境下的全局对象。可选链次要是减少了对象中获取内容的安全性。
一、globalThis
对于WEB(浏览器)环境下，js中的全局变量是window/self，置信大家对于window理解的比拟多，也比拟相熟，小编也是明天才晓得self的这个对象，从目前来看，能够认为是一样的。上面是延时实例

setTimeout(() => {
      console.log('lilei')
},1000) // lilei

因为下面的例子是在全局下的办法，如果写全的话，应该是这样

window.setTimeout(() => {
      console.log('lilei')
},1000) // lilei

self.setTimeout(() => {
      console.log('lilei')
},1000) // lilei

同样，咱们能够自定义一个获取不同环境下的全局变量办法，就像这样

const getGlobal = () => {
    if(typeof self !== 'undefined'){
        return self
    }
    if(typeof window !== 'undefined'){
        return window
    }
    if(typeof global !== 'undefined'){
        return global
    }
    throw new Error('无奈找到全局对象')
}

const testGlobal  = getGlobal()
console.log(testGlobal)

在es11引入globalThis后，下面的一堆代码就能够简写成这样

console.log(globalThis)

二、可选链
之前小编在看他人代码的时候发现过这个符号，然而在网上搜寻的时候，基本不晓得怎么去搜寻，也就长期搁下了，直到看到了可选链的概念，我才豁然开朗。
先举一个理论的例子，咱们在调用对象的属性或者办法的时候，很多时候咱们不晓得后端传递过去的数据是不是确切有指定属性，这时候，咱们的代码就会写成这样：

const user = {
    address:{
        street:'No.1 Street',
        getNum(){
            return '88号'
        }
    }
}

const street = user && user.address && user.address.street
console.log(street) // No.1 Street

const streetNum= user && user.address && user.address.getNum && user.address.getNum() // 是否存在之后才去调用
console.log(streetNum) // 88号

有了可选链，咱们的代码就能够写成这样

const street = user ?.address ?.street
console.log(street) // No.1 Street

const streetNum= user ?.address ?.getNum ?.()
console.log(streetNum) // 88号

是不是很不便也很清晰？明天的分享就到这里，又是提高的一天，一起加油！
大家还能够扫描二维码，关注我的微信公众号，蜗牛全栈