问题

假设我有一个JS文件包含2个React Component类定义和一堆其他事情:

 // a file called OuterComponent.react.js

import xxx from xxx;
import yyy from yyy;

// When does these run?
let a = 0;
a = 1;

export default class OuterComponent extends React.PureComponent<> {
  render() {
    return (
      <View>
       <InnerComponent />
      </View>
    );
  }
}

class InnerComponent extends React.PureComponent<> {
  //... something
}
 

问题

  1. ’a’运行的声明和值设置代码何时运行?当其他文件导入/需要此文件时它是否运行?

  2. 我可以在此文件中有一些标志并不时更改,然后从许多其他文件读取此标志的值吗? (就像单例管理器?)如果我可以,如何导出它并导入它?

  3. 创建多个文件实际上意味着什么? (除了它将大块代码分解为小块以获得更好的可读性)它是否有任何其他区别?

  最佳答案

问题1:’a’运行的声明和值设置代码何时运行?当其他文件导入/需要此文件时它是否运行?

第一次导入文件时运行.它不在子序列导入上执行.

问题2:我可以在此文件中有一些标志并不时更改,然后从许多其他文件读取此标志的值吗? (就像单例管理器?)如果我可以,如何导出它并导入它?

你可以。

出口:

 export let a = 0;
 

进口:

 import { a } from './filename.js';
 

问题3:创建多个文件实际上意味着什么? (除了它将大块代码分解为小块以获得更好的可读性)它是否有任何其他区别?

  • 将代码分解成小块;
  • 允许重用;和
  • 允许封装非导出的变量/函数。

-

检查模块使用情况的演示: http://plnkr.co/edit/0ImgQj2KzLj9O1D63Gq9?p=preview

请注意a.js如何只加载一次,即使它是由b.jsc.js导入的.还请看看它是如何导出和导入的,以及它如何更改时,更改在其他模块中被提取.

  相同标签的其他问题

javascriptreactjsreact-native