必须要会的50个React面试题

4.props

// ES5 
var App = React.createClass({ 
    propTypes: { name: React.PropTypes.string }, 
    render: function() { 
        return 
            <h3>Hello, {this.props.name}!</h3>; 
    } 
}); 
 
// ES6 
class App extends React.Component { 
    render() { 
        return 
            <h3>Hello, {this.props.name}!</h3>; 
    } 
} 

5.state

// ES5 
var App = React.createClass({ 
    getInitialState: function() { 
        return { name: 'world' }; 
    }, 
    render: function() { 
        return 
            <h3>Hello, {this.state.name}!</h3>; 
    } 
}); 
 
// ES6 
class App extends React.Component { 
    constructor() { 
        super(); 
        this.state = { name: 'world' }; 
    } 
    render() { 
        return 
            <h3>Hello, {this.state.name}!</h3>; 
    } 
} 

10. React与Angular有何不同？

11. 你怎样理解“在React中，，一切都是组件”这句话。

组件是 React 应用 UI 的构建块。这些组件将整个 UI 分成小的独立并可重用的部分。每个组件彼此独立，而不会影响 UI 的其余部分。

12. 怎样解释 React 中 render() 的目的。

每个React组件强制要求必须有一个 render()。它返回一个 React 元素，是原生 DOM 组件的表示。如果需要渲染多个 HTML 元素，则必须将它们组合在一个封闭标记内，例如 <form>、<group>、<div> 等。此函数必须保持纯净，即必须每次调用时都返回相同的结果。

13. 如何将两个或多个组件嵌入到一个组件中？

可以通过以下方式将组件嵌入到一个组件中：

class MyComponent extends React.Component{ 
    render(){ 
        return(           
            <div> 
                <h1>Hello</h1> 
                <Header/> 
            </div> 
        ); 
    } 
} 
class Header extends React.Component{ 
    render(){ 
        return 
            <h1>Header Component</h1>    
   }; 
} 
ReactDOM.render( 
    <MyComponent/>, document.getElementById('content') 
); 

14. 什么是 Props?

（编辑：衡阳站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!