Migrate a bunch of classes in react-native/src/private to use private fields

packages/react-native/src/private/webapis/dom/geometry/DOMRectReadOnly.js

@@ -33,10 +33,10 @@ function castToNumber(value: mixed): number {
  * This is a (mostly) spec-compliant version of `DOMRectReadOnly` (https://developer.mozilla.org/en-US/docs/Web/API/DOMRectReadOnly).
  */
 export default class DOMRectReadOnly {
-  _x: number;
-  _y: number;
-  _width: number;
-  _height: number;
+  #x: number;
+  #y: number;
+  #width: number;
+  #height: number;
 
   constructor(x: ?number, y: ?number, width: ?number, height: ?number) {
     this.__setInternalX(x);
@@ -49,36 +49,36 @@ export default class DOMRectReadOnly {
    * The x coordinate of the `DOMRectReadOnly`'s origin.
    */
   get x(): number {
-    return this._x;
+    return this.#x;
   }
 
   /**
    * The y coordinate of the `DOMRectReadOnly`'s origin.
    */
   get y(): number {
-    return this._y;
+    return this.#y;
   }
 
   /**
    * The width of the `DOMRectReadOnly`.
    */
   get width(): number {
-    return this._width;
+    return this.#width;
   }
 
   /**
    * The height of the `DOMRectReadOnly`.
    */
   get height(): number {
-    return this._height;
+    return this.#height;
   }
 
   /**
    * Returns the top coordinate value of the `DOMRect` (has the same value as `y`, or `y + height` if `height` is negative).
    */
   get top(): number {
-    const height = this._height;
-    const y = this._y;
+    const height = this.#height;
+    const y = this.#y;
 
     if (height < 0) {
       return y + height;
@@ -91,8 +91,8 @@ export default class DOMRectReadOnly {
    * Returns the right coordinate value of the `DOMRect` (has the same value as ``x + width`, or `x` if `width` is negative).
    */
   get right(): number {
-    const width = this._width;
-    const x = this._x;
+    const width = this.#width;
+    const x = this.#x;
 
     if (width < 0) {
       return x;
@@ -105,8 +105,8 @@ export default class DOMRectReadOnly {
    * Returns the bottom coordinate value of the `DOMRect` (has the same value as `y + height`, or `y` if `height` is negative).
    */
   get bottom(): number {
-    const height = this._height;
-    const y = this._y;
+    const height = this.#height;
+    const y = this.#y;
 
     if (height < 0) {
       return y;
@@ -119,8 +119,8 @@ export default class DOMRectReadOnly {
    * Returns the left coordinate value of the `DOMRect` (has the same value as `x`, or `x + width` if `width` is negative).
    */
   get left(): number {
-    const width = this._width;
-    const x = this._x;
+    const width = this.#width;
+    const x = this.#x;
 
     if (width < 0) {
       return x + width;
@@ -155,34 +155,34 @@ export default class DOMRectReadOnly {
   }
 
   __getInternalX(): number {
-    return this._x;
+    return this.#x;
   }
 
   __getInternalY(): number {
-    return this._y;
+    return this.#y;
   }
 
   __getInternalWidth(): number {
-    return this._width;
+    return this.#width;
   }
 
   __getInternalHeight(): number {
-    return this._height;
+    return this.#height;
   }
 
   __setInternalX(x: ?number) {
-    this._x = castToNumber(x);
+    this.#x = castToNumber(x);
   }
 
   __setInternalY(y: ?number) {
-    this._y = castToNumber(y);
+    this.#y = castToNumber(y);
   }
 
   __setInternalWidth(width: ?number) {
-    this._width = castToNumber(width);
+    this.#width = castToNumber(width);
   }
 
   __setInternalHeight(height: ?number) {
-    this._height = castToNumber(height);
+    this.#height = castToNumber(height);
   }
 }

packages/react-native/src/private/webapis/dom/nodes/ReactNativeElement.js

@@ -44,7 +44,7 @@ export default class ReactNativeElement
   __nativeTag: number;
   __internalInstanceHandle: InternalInstanceHandle;
 
-  _viewConfig: ViewConfig;
+  #viewConfig: ViewConfig;
 
   constructor(
     tag: number,
@@ -55,7 +55,7 @@ export default class ReactNativeElement
 
     this.__nativeTag = tag;
     this.__internalInstanceHandle = internalInstanceHandle;
-    this._viewConfig = viewConfig;
+    this.#viewConfig = viewConfig;
   }
 
   get offsetHeight(): number {
@@ -172,12 +172,12 @@ export default class ReactNativeElement
 
   setNativeProps(nativeProps: {...}): void {
     if (__DEV__) {
-      warnForStyleProps(nativeProps, this._viewConfig.validAttributes);
+      warnForStyleProps(nativeProps, this.#viewConfig.validAttributes);
     }
 
     const updatePayload = createAttributePayload(
       nativeProps,
-      this._viewConfig.validAttributes,
+      this.#viewConfig.validAttributes,
     );
 
     const node = getShadowNode(this);

packages/react-native/src/private/webapis/dom/oldstylecollections/DOMRectList.js

@@ -20,7 +20,7 @@ import {createValueIterator} from './ArrayLikeUtils';
 
 // $FlowIssue[prop-missing] Flow doesn't understand [Symbol.iterator]() {} and thinks this class doesn't implement the Iterable interface.
 export default class DOMRectList implements Iterable<DOMRectReadOnly> {
-  _length: number;
+  #length: number;
 
   /**
    * Use `createDOMRectList` to create instances of this class.
@@ -38,15 +38,15 @@ export default class DOMRectList implements Iterable<DOMRectReadOnly> {
       });
     }
 
-    this._length = elements.length;
+    this.#length = elements.length;
   }
 
   get length(): number {
-    return this._length;
+    return this.#length;
   }
 
   item(index: number): DOMRectReadOnly | null {
-    if (index < 0 || index >= this._length) {
+    if (index < 0 || index >= this.#length) {
       return null;
     }
 

packages/react-native/src/private/webapis/dom/oldstylecollections/HTMLCollection.js

@@ -19,7 +19,7 @@ import {createValueIterator} from './ArrayLikeUtils';
 
 // $FlowIssue[prop-missing] Flow doesn't understand [Symbol.iterator]() {} and thinks this class doesn't implement the Iterable<T> interface.
 export default class HTMLCollection<T> implements Iterable<T>, ArrayLike<T> {
-  _length: number;
+  #length: number;
 
   /**
    * Use `createHTMLCollection` to create instances of this class.
@@ -37,15 +37,15 @@ export default class HTMLCollection<T> implements Iterable<T>, ArrayLike<T> {
       });
     }
 
-    this._length = elements.length;
+    this.#length = elements.length;
   }
 
   get length(): number {
-    return this._length;
+    return this.#length;
   }
 
   item(index: number): T | null {
-    if (index < 0 || index >= this._length) {
+    if (index < 0 || index >= this.#length) {
       return null;
     }
 

packages/react-native/src/private/webapis/dom/oldstylecollections/NodeList.js

@@ -23,7 +23,7 @@ import {
 
 // $FlowIssue[prop-missing] Flow doesn't understand [Symbol.iterator]() {} and thinks this class doesn't implement the Iterable<T> interface.
 export default class NodeList<T> implements Iterable<T>, ArrayLike<T> {
-  _length: number;
+  #length: number;
 
   /**
    * Use `createNodeList` to create instances of this class.
@@ -38,15 +38,15 @@ export default class NodeList<T> implements Iterable<T>, ArrayLike<T> {
         writable: false,
       });
     }
-    this._length = elements.length;
+    this.#length = elements.length;
   }
 
   get length(): number {
-    return this._length;
+    return this.#length;
   }
 
   item(index: number): T | null {
-    if (index < 0 || index >= this._length) {
+    if (index < 0 || index >= this.#length) {
       return null;
     }
 
@@ -70,7 +70,7 @@ export default class NodeList<T> implements Iterable<T>, ArrayLike<T> {
     // eslint-disable-next-line consistent-this
     const arrayLike: ArrayLike<T> = this;
 
-    for (let index = 0; index < this._length; index++) {
+    for (let index = 0; index < this.#length; index++) {
       if (thisArg == null) {
         callbackFn(arrayLike[index], index, this);
       } else {