Object Destructuring in JavaScript

 // Object Destructuring in JavaScript



// old style
// const bioData =
// {
// name: "abhishek",
// age: 28,
// deg: "Mca",
// hob: {
// first: "palying",
// sec: "Programming"
// }
// }
// console.log(`My name is ${bioData.name} `)

// New Style
// let {name:Myname,deg,age, hob} = bioData;
// console.log(`My name is ${Myname}. My age is ${age}. my qualification is ${deg}.
// i love ${hob.sec}`);


// 2020 style

const ReactNativeKing =
{
Laptop: "Macbook Air",
Programming: "JavaScript",
FrameWork: "ReactNative",
secFrameWork: "ReactJs",
Dream: {
Place: "switzerland",
Car: "RangeRover",
Person: "Elon Musk"
}
}
let {Laptop,Programming,FrameWork,secFrameWork, Dream} = ReactNativeKing;
console.log(`My Laptop is ${Laptop}. My favrite programming language is
${Programming}.my fav framework is ${FrameWork}.my secend framework is ${secFrameWork}.
I want to live this place called ${Dream.Place}. My dream car is ${Dream.Car}.
I like tech guy ${Dream.Person}`);

Comments

Post a Comment

Popular posts from this blog

React Native FlatList

Image
 App Name: Test  Component Name: App.js ------------------------------------------------------------------------------------ import React , { useState } from 'react' ; import { StyleSheet , Text , View , FlatList , } from 'react-native' ; // class App extends Component { export default function App (){ const [ people , ] = useState ([ { name : 'ReactNative King' , id : '1' }, { name : 'ReactNative King' , id : '2' }, { name : 'ReactNative King' , id : '3' }, { name : 'ReactNative Kingaun' , id : '4' }, { name : 'ReactNative King' , id : '5' }, { name : 'ReactNative King' , id : '6' }, { name : 'ReactNative King' , id : '7' }, ]); // render() { return ( < View style = { styles . container } > < FlatList keyEtractor = { ( item ) => item . i...
Read more

React Native class component

Image
class component: class component access react lifecycle methods and render and state props functionality. app name : test component name: App.js ----------------------------------------------------------------------------------------------------------------------- /** * Sample React Native App * https://github.com/facebook/react-native * * @format * @flow strict-local */ import React , { Component } from 'react' import { View , Text , Button , } from 'react-native' ; class App extends Component { render () { function hello (){ alert ( "Welcome class component ReactNative King" ) } return ( < View > < Text > Class Component </ Text > < Button title = "Click Me " onPress = { hello } /> </ View > ) } } export default App ;
Read more