发现问题
今天在写业务代码中,需要实现一个翻转功能,然后在pc端模拟移动端发现并未报错,之后尝试用手机端进行测试,一般浏览器并无异常,直到用uc浏览器和谷歌浏览器进行尝试,发现并未翻转
尝试找出问题
由于pc模拟的移动端并未报错,所以只能用window自带的error事件,并将error进行JSON.styingify(),下面是举一个简单的例子
<body>
<script>
window.addEventListener("error", e => {
document.querySelector(".error").innerHTML = JSON.stringify(e)
})
</script>
<div class="box"></div>
<div class="error"></div>
<script>
let str = '222222222222'
let leng1 = str?.length
document.querySelector(".box").innerHTML = leng1 + 'box'
</script>
</body>
正常浏览器页面显示12box,uc浏览器页面展示报错:{"isTrust":true},之后修改stringify():
document.querySelector(".error").innerHTML = JSON.stringify(e, ["message", "arguments", "type", "name"]) + "----------------" + e.message
页面显示报错: {"message":"Uncaught SyntaxError: Unexpected token '.'","type":"error"}----------------Uncaught SyntaxError: Unexpected token '.'
看到SyntaxError 查看js代码 唯一可能的就是 ?. 这个问题.
尝试解决问题
尝试修改 let leng1 = str?.length,改为
let leng1 = str ? str.length : undefined
之后发现报错没了....
查询原因
查了一圈,是uc浏览器不支持这个链式询问?.在构建AST的时候,词法分析无法识别 . 所以如果想让在uc浏览器运行的话需要打包成es2015(也就是es6)