美文网首页
ECMAScript 6 初尝试

ECMAScript 6 初尝试

作者: ImWiki | 来源:发表于2019-04-24 23:05 被阅读0次

    最近在梳理大前端的知识,发现我对前端的知识真的欠缺了,连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进行转换。

    相关文章

      网友评论

          本文标题:ECMAScript 6 初尝试

          本文链接:https://www.haomeiwen.com/subject/vhcogqtx.html