ES6——进阶

蔚落 2022-06-10 14:18 151阅读 0赞

import export

//假设我们有两个js文件: index.js和content.js,现在我们想要在index.js中使用content.js返回的结果，我们要怎么做呢？
    
    //content.js
    export default 'A cat'    
    export function say(){
        return 'Hello!'
    }    
    export const type = 'dog' 
    
    //index.js
    import animal, { say, type } from './content'  
    let says = say()
    console.log(`The ${type} says ${says} to ${animal}`)  //The dog says Hello to A cat
    
    //修改变量名
    //此时我们不喜欢type这个变量名，因为它有可能重名，所以我们需要修改一下它的变量名。在es6中可以用as实现一键换名。
    import animal, { say, type as animalType } from './content'  
    let says = say()
    console.log(`The ${animalType} says ${says} to ${animal}`)  
    //The dog says Hello to A cat
    
    //模块的整体加载
    //除了指定加载某个输出值，还可以使用整体加载，即用星号（*）指定一个对象，所有输出值都加载在这个对象上面。
    import animal, * as content from './content'  
    let says = content.say()
    console.log(`The ${content.type} says ${says} to ${animal}`)  
    //The dog says Hello to A cat
    
    //上面的content.js一共输出了三个变量（default, say, type）,假如我们的实际项目当中只需要用到type这一个变量，
    //其余两个我们暂时不需要。我们可以只输入一个变量(目前无论是webpack还是browserify都还不支持这一功能)：
    import { type } from './content'

希望更全面了解es6伙伴们可以去看阮一峰所著的电子书[ECMAScript 6入门][ECMAScript 6]

[ECMAScript 6]: http://es6.ruanyifeng.com/

发表评论取消回复

表情：

评论列表（有 0 条评论，151人围观）

还没有评论，来说两句吧...

相关阅读

相关 ES进阶教程

1.分片Shards 一个索引可以存储超出单个结点硬件限制的大量数据,es提供了将索引划分为多份的能力,每一份都称之为分片.当创建索引时,可以指定想要的分片数量.每个分片

男娘i/ 2024年03月31日 12:16/ 0 赞/ 54 阅读

相关 vue进阶实战 vue进阶课程 vue进阶

每个章节都有对接的文章链接 1. r e f s ， refs， refs，parent，$children 基础使用：参考vue官方文档 $refs 父

骑猪看日落/ 2022年12月22日 11:27/ 0 赞/ 307 阅读

相关 JavaScript进阶(8)-ES6简介及新增let和const关键字

![20201114123647219.gif][] 目录 1 什么是ES6 1.1 ECMAScript 1.2 ECMAScript版本 1.3 各版本浏览器对E

小鱼儿/ 2022年12月21日 03:21/ 0 赞/ 123 阅读

相关爬虫教程（ 6 ） --- 爬虫进阶、扩展

1. 前言 1. 先看一个最简单的爬虫。 import requests url = "http://www.cricode

Myth丶恋晨/ 2022年11月27日 06:47/ 0 赞/ 2599 阅读

相关 ReactNative进阶（二十八）：ES6 Symbol用法

文章目录什么是Symbol? 应用场景注意事项 -------------------- 什么是Symbol? `S

我就是我/ 2022年10月20日 13:45/ 0 赞/ 193 阅读

相关 ES6——进阶

import export //假设我们有两个js文件: index.js和content.js,现在我们想要在index.js中使用content.js返回的结果，

蔚落/ 2022年06月10日 14:18/ 0 赞/ 152 阅读

相关 springmvc进阶（6）：springmvc运行流程

借用一下尚硅谷的PPT图片 ![这里写图片描述][70] [70]: /images/20220523/bc69755c24a543c7891a03ae89df801a

逃离我推掉我的手/ 2022年05月23日 02:16/ 0 赞/ 190 阅读

相关前端进阶（十四）ES6+版本新特性

> ES全称ECMAScript，ECMAScript是ECMA制定的标准化脚本语言。目前JavaScript使用的ECMAScript版本为[ECMA-417][]。关

痛定思痛。/ 2022年02月20日 00:45/ 0 赞/ 161 阅读

相关 Kubernetes 学习6 Pod控制器应用进阶

一、资源配置清单　　1、自主式Pod资源　　2、资源的清单格式，大多数清单格式都遵循如下条件：　　　　a、一级字段：apiVersion（group/version

小灰灰/ 2021年12月22日 22:37/ 0 赞/ 272 阅读

相关笔记-迎难而上之Java基础进阶6

import java.io.; public class InputStreamDemo{ public static void main(String[] args

灰太狼/ 2021年12月03日 06:39/ 0 赞/ 156 阅读