facebook · nissy-dev · Oct 30, 2018
diff --git a/RNTester/js/LayoutEventsExample.js b/RNTester/js/LayoutEventsExample.js
@@ -10,9 +10,9 @@
 
 'use strict';
 
-var React = require('react');
-var ReactNative = require('react-native');
-var {Image, LayoutAnimation, StyleSheet, Text, View} = ReactNative;
+const React = require('react');
+const ReactNative = require('react-native');
+const {Image, LayoutAnimation, StyleSheet, Text, View} = ReactNative;
 
 import type {ViewLayout, ViewLayoutEvent} from 'ViewPropTypes';
 
@@ -71,9 +71,9 @@ class LayoutEventExample extends React.Component<{}, State> {
   };
 
   render() {
-    var viewStyle = [styles.view, this.state.viewStyle];
-    var textLayout = this.state.textLayout || {width: '?', height: '?'};
-    var imageLayout = this.state.imageLayout || {x: '?', y: '?'};
+    const viewStyle = [styles.view, this.state.viewStyle];
+    const textLayout = this.state.textLayout || {width: '?', height: '?'};
+    const imageLayout = this.state.imageLayout || {x: '?', y: '?'};
     return (
       <View style={this.state.containerStyle}>
         <Text>
@@ -113,7 +113,7 @@ class LayoutEventExample extends React.Component<{}, State> {
   }
 }
 
-var styles = StyleSheet.create({
+const styles = StyleSheet.create({
   view: {
     padding: 12,
     borderColor: 'black',

diff --git a/RNTester/js/LayoutExample.js b/RNTester/js/LayoutExample.js
@@ -10,17 +10,17 @@
 
 'use strict';
 
-var React = require('react');
-var ReactNative = require('react-native');
-var {StyleSheet, Text, View} = ReactNative;
+const React = require('react');
+const ReactNative = require('react-native');
+const {StyleSheet, Text, View} = ReactNative;
 
-var RNTesterBlock = require('./RNTesterBlock');
-var RNTesterPage = require('./RNTesterPage');
+const RNTesterBlock = require('./RNTesterBlock');
+const RNTesterPage = require('./RNTesterPage');
 
 class Circle extends React.Component<$FlowFixMeProps> {
   render() {
-    var size = this.props.size || 20;
-    var backgroundColor = this.props.bgColor || '#527fe4';
+    const size = this.props.size || 20;
+    const backgroundColor = this.props.bgColor || '#527fe4';
     return (
       <View
         style={{
@@ -37,7 +37,7 @@ class Circle extends React.Component<$FlowFixMeProps> {
 
 class CircleBlock extends React.Component<$FlowFixMeProps> {
   render() {
-    var circleStyle = {
+    const circleStyle = {
       flexDirection: 'row',
       backgroundColor: '#f6f7f8',
       borderWidth: 0.5,
@@ -56,7 +56,7 @@ class LayoutExample extends React.Component<$FlowFixMeProps> {
   static displayName = 'LayoutExample';
 
   render() {
-    var fiveColoredCircles = [
+    const fiveColoredCircles = [
       <Circle bgColor="#527fe4" key="blue" />,
       <Circle bgColor="#D443E3" key="violet" />,
       <Circle bgColor="#FF9049" key="orange" />,
@@ -186,7 +186,7 @@ class LayoutExample extends React.Component<$FlowFixMeProps> {
   }
 }
 
-var styles = StyleSheet.create({
+const styles = StyleSheet.create({
   overlay: {
     backgroundColor: '#aaccff',
     borderRadius: 10,

diff --git a/RNTester/js/ListViewExample.js b/RNTester/js/ListViewExample.js
@@ -69,8 +69,8 @@ class ListViewSimpleExample extends React.Component<RNTesterProps, State> {
     rowID: number,
     highlightRow: (sectionID: number, rowID: number) => void,
   ) => {
-    var rowHash = Math.abs(hashCode(rowData));
-    var imgSource = THUMB_URLS[rowHash % THUMB_URLS.length];
+    const rowHash = Math.abs(hashCode(rowData));
+    const imgSource = THUMB_URLS[rowHash % THUMB_URLS.length];
     return (
       <TouchableHighlight
         onPress={() => {
@@ -90,9 +90,9 @@ class ListViewSimpleExample extends React.Component<RNTesterProps, State> {
   };
 
   _genRows(pressData: {[key: number]: boolean}): Array<string> {
-    var dataBlob = [];
-    for (var ii = 0; ii < 100; ii++) {
-      var pressedText = pressData[ii] ? ' (pressed)' : '';
+    const dataBlob = [];
+    for (let ii = 0; ii < 100; ii++) {
+      const pressedText = pressData[ii] ? ' (pressed)' : '';
       dataBlob.push('Row ' + ii + pressedText);
     }
     return dataBlob;
@@ -124,7 +124,7 @@ class ListViewSimpleExample extends React.Component<RNTesterProps, State> {
   }
 }
 
-var THUMB_URLS = [
+const THUMB_URLS = [
   require('./Thumbnails/like.png'),
   require('./Thumbnails/dislike.png'),
   require('./Thumbnails/call.png'),
@@ -138,19 +138,19 @@ var THUMB_URLS = [
   require('./Thumbnails/superlike.png'),
   require('./Thumbnails/victory.png'),
 ];
-var LOREM_IPSUM =
+const LOREM_IPSUM =
   'Lorem ipsum dolor sit amet, ius ad pertinax oportere accommodare, an vix civibus corrumpit referrentur. Te nam case ludus inciderint, te mea facilisi adipiscing. Sea id integre luptatum. In tota sale consequuntur nec. Erat ocurreret mei ei. Eu paulo sapientem vulputate est, vel an accusam intellegam interesset. Nam eu stet pericula reprimique, ea vim illud modus, putant invidunt reprehendunt ne qui.';
 
 /* eslint no-bitwise: 0 */
-var hashCode = function(str) {
-  var hash = 15;
-  for (var ii = str.length - 1; ii >= 0; ii--) {
+const hashCode = function(str) {
+  let hash = 15;
+  for (let ii = str.length - 1; ii >= 0; ii--) {
     hash = (hash << 5) - hash + str.charCodeAt(ii);
   }
   return hash;
 };
 
-var styles = StyleSheet.create({
+const styles = StyleSheet.create({
   row: {
     flexDirection: 'row',
     justifyContent: 'center',

diff --git a/RNTester/js/ListViewGridLayoutExample.js b/RNTester/js/ListViewGridLayoutExample.js
@@ -24,7 +24,7 @@ const ListViewDataSource = require('ListViewDataSource');
 
 import type {RNTesterProps} from 'RNTesterTypes';
 
-var THUMB_URLS = [
+const THUMB_URLS = [
   require('./Thumbnails/like.png'),
   require('./Thumbnails/dislike.png'),
   require('./Thumbnails/call.png'),
@@ -78,8 +78,8 @@ class ListViewGridLayoutExample extends React.Component<RNTesterProps, State> {
   }
 
   _renderRow = (rowData: string, sectionID: number, rowID: number) => {
-    var rowHash = Math.abs(hashCode(rowData));
-    var imgSource = THUMB_URLS[rowHash % THUMB_URLS.length];
+    const rowHash = Math.abs(hashCode(rowData));
+    const imgSource = THUMB_URLS[rowHash % THUMB_URLS.length];
     return (
       <TouchableHighlight
         onPress={() => this._pressRow(rowID)}
@@ -95,9 +95,9 @@ class ListViewGridLayoutExample extends React.Component<RNTesterProps, State> {
   };
 
   _genRows(pressData: {[key: number]: boolean}): Array<string> {
-    var dataBlob = [];
-    for (var ii = 0; ii < 100; ii++) {
-      var pressedText = pressData[ii] ? ' (X)' : '';
+    const dataBlob = [];
+    for (let ii = 0; ii < 100; ii++) {
+      const pressedText = pressData[ii] ? ' (X)' : '';
       dataBlob.push('Cell ' + ii + pressedText);
     }
     return dataBlob;
@@ -114,15 +114,15 @@ class ListViewGridLayoutExample extends React.Component<RNTesterProps, State> {
 }
 
 /* eslint no-bitwise: 0 */
-var hashCode = function(str) {
-  var hash = 15;
-  for (var ii = str.length - 1; ii >= 0; ii--) {
+const hashCode = function(str) {
+  let hash = 15;
+  for (let ii = str.length - 1; ii >= 0; ii--) {
     hash = (hash << 5) - hash + str.charCodeAt(ii);
   }
   return hash;
 };
 
-var styles = StyleSheet.create({
+const styles = StyleSheet.create({
   list: {
     justifyContent: 'space-around',
     flexDirection: 'row',

diff --git a/RNTester/js/ListViewPagingExample.js b/RNTester/js/ListViewPagingExample.js
@@ -10,9 +10,9 @@
 
 'use strict';
 
-var React = require('react');
-var ReactNative = require('react-native');
-var {
+const React = require('react');
+const ReactNative = require('react-native');
+const {
   Image,
   LayoutAnimation,
   ListView,
@@ -22,10 +22,10 @@ var {
   View,
 } = ReactNative;
 
-var NativeModules = require('NativeModules');
-var {UIManager} = NativeModules;
+const NativeModules = require('NativeModules');
+const {UIManager} = NativeModules;
 
-var THUMB_URLS = [
+const THUMB_URLS = [
   require('./Thumbnails/like.png'),
   require('./Thumbnails/dislike.png'),
   require('./Thumbnails/call.png'),
@@ -39,8 +39,8 @@ var THUMB_URLS = [
   require('./Thumbnails/superlike.png'),
   require('./Thumbnails/victory.png'),
 ];
-var NUM_SECTIONS = 100;
-var NUM_ROWS_PER_SECTION = 10;
+const NUM_SECTIONS = 100;
+const NUM_ROWS_PER_SECTION = 10;
 
 class Thumb extends React.Component<{}, $FlowFixMeState> {
   UNSAFE_componentWillMount() {
@@ -53,7 +53,7 @@ class Thumb extends React.Component<{}, $FlowFixMeState> {
   };
 
   _onPressThumb = () => {
-    var config =
+    const config =
       layoutAnimationConfigs[
         this.state.thumbIndex % layoutAnimationConfigs.length
       ];
@@ -94,31 +94,31 @@ class ListViewPagingExample extends React.Component<$FlowFixMeProps, *> {
   // $FlowFixMe found when converting React.createClass to ES6
   constructor(props) {
     super(props);
-    var getSectionData = (dataBlob, sectionID) => {
+    const getSectionData = (dataBlob, sectionID) => {
       return dataBlob[sectionID];
     };
-    var getRowData = (dataBlob, sectionID, rowID) => {
+    const getRowData = (dataBlob, sectionID, rowID) => {
       return dataBlob[rowID];
     };
 
-    var dataSource = new ListView.DataSource({
+    const dataSource = new ListView.DataSource({
       getRowData: getRowData,
       getSectionHeaderData: getSectionData,
       rowHasChanged: (row1, row2) => row1 !== row2,
       sectionHeaderHasChanged: (s1, s2) => s1 !== s2,
     });
 
-    var dataBlob = {};
-    var sectionIDs = [];
-    var rowIDs = [];
-    for (var ii = 0; ii < NUM_SECTIONS; ii++) {
-      var sectionName = 'Section ' + ii;
+    const dataBlob = {};
+    const sectionIDs = [];
+    const rowIDs = [];
+    for (let ii = 0; ii < NUM_SECTIONS; ii++) {
+      const sectionName = 'Section ' + ii;
       sectionIDs.push(sectionName);
       dataBlob[sectionName] = sectionName;
       rowIDs[ii] = [];
 
-      for (var jj = 0; jj < NUM_ROWS_PER_SECTION; jj++) {
-        var rowName = 'S' + ii + ', R' + jj;
+      for (let jj = 0; jj < NUM_ROWS_PER_SECTION; jj++) {
+        const rowName = 'S' + ii + ', R' + jj;
         rowIDs[ii].push(rowName);
         dataBlob[rowName] = rowName;
       }
@@ -151,7 +151,7 @@ class ListViewPagingExample extends React.Component<$FlowFixMeProps, *> {
   };
 
   renderHeader = () => {
-    var headerLikeText =
+    const headerLikeText =
       this.state.headerPressCount % 2 ? (
         <View>
           <Text style={styles.text}>1 Like</Text>
@@ -198,7 +198,7 @@ class ListViewPagingExample extends React.Component<$FlowFixMeProps, *> {
   }
 
   _onPressHeader = () => {
-    var config =
+    const config =
       layoutAnimationConfigs[
         Math.floor(this.state.headerPressCount / 2) %
           layoutAnimationConfigs.length
@@ -208,7 +208,7 @@ class ListViewPagingExample extends React.Component<$FlowFixMeProps, *> {
   };
 }
 
-var styles = StyleSheet.create({
+const styles = StyleSheet.create({
   listview: {
     backgroundColor: '#B0C4DE',
   },
@@ -256,7 +256,7 @@ var styles = StyleSheet.create({
   },
 });
 
-var animations = {
+const animations = {
   layout: {
     spring: {
       duration: 750,
@@ -284,7 +284,7 @@ var animations = {
   },
 };
 
-var layoutAnimationConfigs = [
+const layoutAnimationConfigs = [
   animations.layout.spring,
   animations.layout.easeInEaseOut,
 ];

diff --git a/RNTester/js/ModalExample.js b/RNTester/js/ModalExample.js
@@ -10,9 +10,9 @@
 
 'use strict';
 
-var React = require('react');
-var ReactNative = require('react-native');
-var {
+const React = require('react');
+const ReactNative = require('react-native');
+const {
   Modal,
   Picker,
   Platform,
@@ -44,7 +44,7 @@ class Button extends React.Component<$FlowFixMeProps, $FlowFixMeState> {
   };
 
   render() {
-    var colorStyle = {
+    const colorStyle = {
       color: this.state.active ? '#fff' : '#000',
     };
     return (
@@ -106,15 +106,15 @@ class ModalExample extends React.Component<{}, $FlowFixMeState> {
   }
 
   render() {
-    var modalBackgroundStyle = {
+    const modalBackgroundStyle = {
       backgroundColor: this.state.transparent
         ? 'rgba(0, 0, 0, 0.5)'
         : '#f5fcff',
     };
-    var innerContainerTransparentStyle = this.state.transparent
+    const innerContainerTransparentStyle = this.state.transparent
       ? {backgroundColor: '#fff', padding: 20}
       : null;
-    var activeButtonStyle = {
+    const activeButtonStyle = {
       backgroundColor: '#ddd',
     };
 
@@ -241,7 +241,7 @@ exports.examples = [
   },
 ];
 
-var styles = StyleSheet.create({
+const styles = StyleSheet.create({
   container: {
     flex: 1,
     justifyContent: 'center',

diff --git a/RNTester/js/NativeAnimationsExample.js b/RNTester/js/NativeAnimationsExample.js
@@ -21,7 +21,7 @@ const {
   Slider,
 } = ReactNative;
 
-var AnimatedSlider = Animated.createAnimatedComponent(Slider);
+const AnimatedSlider = Animated.createAnimatedComponent(Slider);
 
 class Tester extends React.Component<$FlowFixMeProps, $FlowFixMeState> {
   state = {

diff --git a/RNTester/js/PanResponderExample.js b/RNTester/js/PanResponderExample.js
@@ -126,7 +126,7 @@ class PanResponderExample extends React.Component<Props> {
   }
 }
 
-var styles = StyleSheet.create({
+const styles = StyleSheet.create({
   circle: {
     width: CIRCLE_SIZE,
     height: CIRCLE_SIZE,