最近在梳理大前端的知识,发现我对前端的知识真的欠缺了,连ES6都不了解,那就尝试一下ES6。
创建 common.js
//common.js
export class User{
constructor(name,age){
this.name = name
this.age = age
}
toString(){
return this.name + "," + this.age
}
}
创建 index.html
下面的关键代码是 type="module"
,如果没有这个是无法使用ES6
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
<script type="module">
import { User } from './common.js'
var user =new User("Wiki",18)
console.log(user.toString())
</script>
</body>
</html>
如果直接在浏览器打开file:///xxx/index.html
会报错
Access to script at 'file:///xxx/common.js' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
意思就是我们必须使用http前缀进行打开,我们可以简单部署在Tomcat或者Apache上面查看效果http://localhost:8080/index.html
,打开控制台,就可以看到了输出。
总结
ES6果然很强大,一改我对javascript的看法,更加接近高级面向对象语言的用法;但是各个浏览器对ES6的支持并不完整,有很多的语法无法直接使用,还是需要使用babel
进行转换。
网友评论