zoukankan      html  css  js  c++  java
  • javascript模块化(简)

    这里书写一个个人理解以及整理的东西,关于模块化以及ES6语法推荐大家阅读阮一峰老师的ES6入门教程 地址:https://es6.ruanyifeng.com/

    比较散,请见谅

    以前的js是没有模块化这个概念,随着ES6的引入,使我们的代码能够优雅。

    模块不是对象,所以本质上还是需要什么加载什么

    1、这里有一个city.js

    1 // 这里定义一个数据
    2 const  cityList = [
    3     {name: '北京'},
    4     {name: ‘上海’}
    5 ]
    6 
    7 // 这里使用扩展
    8 module.exports = { cityList }

    然后在需要引入的地方,如mais.js

    // es6使用import来引入
    
    import { cityList } form 'city.js'
    
    // 借此,数据就可以使用了
    console.log(cityList)

    2、当然不止是数据可以引出,方法也如此,同样的位置

    1 const getList = () => {
    2     // 筛选出name为北京的项
    3     return cityList.filter(item => item.name === '北京')
    4 }
    5 
    6 module.exports = { cityList, getList } // 抛出

    在其他位置使用,如home.js

     1 import { getList } from 'city.js' 2 3 // 使用 4 getList() 

    很有趣的,在不同的位置引入,只取所需。

    作者: 一个热爱改BUG的猴子

    以梦为马
  • 相关阅读:
    JQ轮播
    JS中正则匹配的三个方法match exec test的用法
    JavaScript 表单验证
    JS 控制CSS样式表
    AJAX 的简单用法:
    shell之运用sed将其值存到变量
    shell之创建文件及内容
    修复vbox的共享文件夹的符号链接错误
    字符转码
    php魔术方法
  • 原文地址:https://www.cnblogs.com/lsAxy/p/12674996.html
Copyright © 2011-2022 走看看