React Native组件constructor内console.log与Alert未触发问题

构造函数完全不执行是两处基础语法错误导致的：

• 构造函数名大小写写错：JS类的构造函数是固定保留名，必须是全小写开头的constructor，你写的大写C开头的Constructor只会被识别为类的普通自定义方法，React实例化组件时不会自动触发这个方法
• super调用写法错误：调用父类Component的构造函数时不需要加this.前缀，直接写super(props)即可，this.super()本身就是非法语法，哪怕改对构造函数名，这么写也会直接报错。

import React, { Component } from 'react';
import { Text, Alert } from 'react-native';

class TestComponent extends Component {
  constructor(props){
    super(props);
    // 此处逻辑会在组件实例化时仅执行一次
    console.log("CalingConstructorLog");
    Alert.alert("CalingConstructorLog");
    // 初始化state、绑定实例方法这类启动时只需要跑一次的逻辑都可以正常写在这里
    this.state = {}
  }
  render() {
    return (
      <Text>It renders OK!</Text>
    );
  }
}
export default TestComponent;

补充：如果你的React Native版本支持React 16.8+的Hooks特性，也可以直接写函数组件，用useEffect(() => { /* 初始化逻辑 */ }, [])的方式实现挂载时仅执行一次的初始化，不需要改用undefined判断的绕路方案。

内容的提问来源于stack exchange，提问作者john