// Set of possible check box values ( file: person.jsx )
Domain=[
     { id:0, name:"apple", value:"Apple" },
     { id:1, name:"orange", value:"Orange"  },
     { id:2, name:"banana", value:"Banana"  },
     { id:3, name:"rGrape", value:"Red grapes"  },
     { id:4, name:"gGrape", value:"Green grapes"  },
]


// a single user's preferences ( file: person.jsx )
state={
    userid:0,
    name:"Tom",
    gender:"Male",
    age:20,
    fruits:["apple", "rGrape"]
}

// ( file: person.jsx , inside render() )
{
this.Domain.map(
    (fruit, index) => (
        //console.log();
        <p>
            <li key={fruit.id}>
                <input type="checkbox"
                    defaultChecked=
                    { //false //if set to false all unchecked
                        this.state.fruits.map(
                            (stateFruit) =>(
                                 if(val.name === stateSym)
                                        return true;
                                 else
                                        console.log(false);
                                 console.log(fruit.name === stateFruit)
                            )
                        )
                    }
                    onChange={this.handleChangeChk} /> {fruit.value}
            </li>
        </p>
    )
)
}