Javascript React 组件状态

Question

[...Array(totalStars)] 在 React Component 下返回了什么？

它是否返回一个长度为 5 的数组，数组中的确切元素是什么？

感谢您的回答。

class StarRating extends Component {

    static propTypes = {
        totalStars: PropTypes.number
    }

    static defaultProps = {
        totalStars: 5
    }

    constructor(props) {
        super(props)
        this.state = {
            starsSelected: 0
        }
        this.change = this.change.bind(this)
    }

    change(starsSelected) {
        this.setState({starsSelected})
    }

    render() {
        const {totalStars} = this.props
        const {starsSelected} = this.state
        return (
            <div className="star-rating">
                {[...Array(totalStars)].map((n, i) =>
                    <Star key={i}
                          selected={i<starsSelected}
                          onClick={() => this.change(i+1)}
                    />
                )}
                <p>{starsSelected} of {totalStars} stars</p>
            </div>
        )
    }

}

Answer 1

[...Array(totalStars)] 在 React Component 下面返回了什么？

It creates an array with the length of 5 and Array has 5 undefined values, like [undefined, undefined, undefined, undefined, undefined].

它是否返回一个长度为 5 的数组，数组中的确切元素是什么？

Yes, it returns an array length of 5. In your map function return 5 star elements.