TypeError: this.state.tasks.map is not a function

I am getting the following error in my code. Can you please help me to understand the issue. I have included my page component and task list component.

TypeError: this.state.tasks.map is not a function

Page Show.js

import React, { Component } from 'react';
import axios from 'axios';
import TasksList from './TasksList';

export default class Show extends Component {

    constructor(props)  {
        super(props);
        this.state = {tasks: [] };
    }

    componentDidMount(){
            axios.post('http://mohamed-bouhlel.com/p5/todolist/todophp/show.php')
            .then(response => { 
                this.setState({ tasks: response.data });
            })
            .catch(function (error) {
                console.log(error);
            })
        }

        tasksList(){
            return this.state.tasks.map(function(object,i){
                return <TasksList obj = {object} key={i} />;
            });
        }

    render() {
        return (
            <div>
                { this.tasksList() }
            </div>
        )
    }
}

Page TasksList.js

import React, { Component } from 'react';

export default class TasksList extends Component {

    render() {
        return (
            <div>
                <div>{this.props.obj.task}</div>
            </div>
        )
    }
}