ES6: Use Destructuring Assignment to Assign Variables from Objects SEPT18

ES6: Use Destructuring Assignment to Assign Variables from Objects SEPT18
0
#1

I am trying to solve the ES6: Use Destructuring Assignment to Assign Variables from Objects challenge and I get this error message when I run the test:

// running tests
destructuring WITH reassignment was used
// tests completed

I must have made a mistake somewhere but I can’t find it. Here is my code:

const AVG_TEMPERATURES = {
  today: 77.5,
  tomorrow: 79
};

function getTempOfTmrw(avgTemperatures) {
  "use strict";
  // change code below this line
  const {tomorrow: tempOfTomorrow} = AVG_TEMPERATURES; // change this line
  // change code above this line
  return tempOfTomorrow;
}

console.log(getTempOfTmrw(AVG_TEMPERATURES)); // should be 79

What am I doing wrong?

Thanks for your help!

9 Likes
I cannot complete clause: 'destructuring with reassignment was used'
#2

You’re using the object used to test the function inside the function. The function takes an argument (avgTemperatures), and you can test it using the provided object AVG_TEMPERATURES, but you’re not to use that object in the function

17 Likes
#3

God! So simple once explained! Thanks a lot DanCouper!

1 Like
#4

Thanks guys I was strugling with the same problem. Finally I got it :slight_smile:

#5

Same problem. Thank you for the explanation!

#6

good, thank you so much

#7

I made the same mistake! Thank you!

#9

I made the same mistake:neutral_face:

#10

I made the same error, some of these assignments are so simple but the way they are explained makes hard to understand sometimes. This one took me about an hour to solve.

1 Like
#11

thank you @DanCouper same logic, same mistake :confused:

1 Like
#12

@DanCouper Thanks man!!

#13

Thanks @DanCouper, I just got the same error

#14

Same problem. Thank you for the explanation!

1 Like
#15
<title>Mini App</title>

<style>
  
  body {
    background: lavender;
  }
  
  div.user-photo {
    width: 150px;
    height: 150px;
    margin: 1em auto;
    background: #fff;
  }
  
  div.details {
    font-size: 2.3em;
    margin: 2.5em 0.2em 0.2em 0.2em;
    color: #fff;
    padding: 1.1em;
  }
  
  footer {
    width: calc(100% - 2em);
    z-index: 500;
    position: absolute;
    bottom: 0;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    margin: 0 1em;
  }
  
  footer button.mdc-icon-button {
    margin: 0.5em;
  }
  
</style>
<script>
  
  const notify = (msg) => {
    const toastr = document.querySelector('.messages');
    if(!toastr) return;
    
    toastr.textContent = msg;
    if(!toastr.classList.contains('on')) {
      toastr.classList.add('on');
    }
  };
  
  const clearNotice = () => {
    const toastr = document.querySelector('.messages');
    if(!toastr) return;
    
    toastr.textContent = '';
    toastr.classList.remove('on');
  };
  
  const displayUserPhotoAndName = (data) => {
    if(!data) return;
    
    // add your code here

//destrucure obj data
let {results} = data;
//destructure arr
let [profile] = results;

   //Assign Name
    document.querySelector('h2').textContent = profile.name.title + ' '+profile.name.last+' '+profile.name.first;
    //Display Image
    document.querySelector('img').src = profile.picture.large;
    a
    clearNotice();
  };
        
  const getAUserProfile = () => {
    const api = 'https://randomuser.me/api/';
    
    // make API call here
    fetch(api)
	.then(res => res.json())
	.then(results => {return displayUserPhotoAndName(results)});
    notify(`requesting profile data ...`);
    notify(`requesting profile data ...`);
  };
  
  const startApp = () => {
    // invoke the getAUserProfile here
      getAUserProfile();
  };

  startApp();
</script>
[quote="Gurrudfiss, post:1, topic:229773, full:true"] I am trying to solve the [ES6: Use Destructuring Assignment to Assign Variables from Objects](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-objects) challenge and I get this error message when I run the test:

// running tests
destructuring WITH reassignment was used
// tests completed

I must have made a mistake somewhere but I can’t find it. Here is my code:

const AVG_TEMPERATURES = {
  today: 77.5,
  tomorrow: 79
};

function getTempOfTmrw(avgTemperatures) {
  "use strict";
  // change code below this line
  const {tomorrow: tempOfTomorrow} = AVG_TEMPERATURES; // change this line
  // change code above this line
  return tempOfTomorrow;
}

console.log(getTempOfTmrw(AVG_TEMPERATURES)); // should be 79

What am I doing wrong?

Thanks for your help!
[/quote]

i have been stuck here for days, Please what am i not doing right ?

#16

If you want help with a challenge of you use the Ask for help button

There are s lot of things in your message, what is it exactly that you need help with?

#17
type or paste the code here
```<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />

    <title>Mini App</title>

    <style>
      
      body {
        background: lavender;
      }
      
      div.user-photo {
        width: 150px;
        height: 150px;
        margin: 1em auto;
        background: #fff;
      }
      
      div.details {
        font-size: 2.3em;
        margin: 2.5em 0.2em 0.2em 0.2em;
        color: #fff;
        padding: 1.1em;
      }
      
      footer {
        width: calc(100% - 2em);
        z-index: 500;
        position: absolute;
        bottom: 0;
        overflow: hidden;
        display: flex;
        justify-content: space-between;
        margin: 0 1em;
      }
      
      footer button.mdc-icon-button {
        margin: 0.5em;
      }
      
    </style>
  </head>
  <body>
    
    <script>
      
      const notify = (msg) => {
        const toastr = document.querySelector('.messages');
        if(!toastr) return;
        
        toastr.textContent = msg;
        if(!toastr.classList.contains('on')) {
          toastr.classList.add('on');
        }
      };
      
      const clearNotice = () => {
        const toastr = document.querySelector('.messages');
        if(!toastr) return;
        
        toastr.textContent = '';
        toastr.classList.remove('on');
      };
      
      const displayUserPhotoAndName = (data) => {
        if(!data) return;
        
        // add your code here
   //destrucure obj data
   let {results} = data;
        //destructure arr 
        let [profile] = results;
        
       //Assign Name
        document.querySelector('h2').textContent = profile.name.title + ' '+profile.name.last+' '+profile.name.first;
        //Display Image
        document.querySelector('img').src = profile.picture.large;
        a
        clearNotice();
      };
            
      const getAUserProfile = () => {
        const api = 'https://randomuser.me/api/';
        
        // make API call here
        fetch(api)
		.then(res => res.json())
		.then(results => {return displayUserPhotoAndName(results)});
        notify(`requesting profile data ...`);
        notify(`requesting profile data ...`);
      };
      
      const startApp = () => {
        // invoke the getAUserProfile here
          getAUserProfile();
      };

      startApp();
    </script>
  </body>
</html>
#18

I was given this assignment two days ago without an instruction

type or paste code here
```<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />

    <title>Mini App</title>

    <style>
      
      body {
        background: lavender;
      }
      
      div.user-photo {
        width: 150px;
        height: 150px;
        margin: 1em auto;
        background: #fff;
      }
      
      div.details {
        font-size: 2.3em;
        margin: 2.5em 0.2em 0.2em 0.2em;
        color: #fff;
        padding: 1.1em;
      }
      
      footer {
        width: calc(100% - 2em);
        z-index: 500;
        position: absolute;
        bottom: 0;
        overflow: hidden;
        display: flex;
        justify-content: space-between;
        margin: 0 1em;
      }
      
      footer button.mdc-icon-button {
        margin: 0.5em;
      }
      
    </style>
  </head>
  <body>
    
    <script>
      
      const notify = (msg) => {
        const toastr = document.querySelector('.messages');
        if(!toastr) return;
        
        toastr.textContent = msg;
        if(!toastr.classList.contains('on')) {
          toastr.classList.add('on');
        }
      };
      
      const clearNotice = () => {
        const toastr = document.querySelector('.messages');
        if(!toastr) return;
        
        toastr.textContent = '';
        toastr.classList.remove('on');
      };
      
      const displayUserPhotoAndName = (data) => {
        if(!data) return;
        
        // add your code here

        clearNotice();
      };
            
      const getAUserProfile = () => {
        const api = 'https://randomuser.me/api/';
        
        // make API call here
        
        notify(`requesting profile data ...`);
      };
      
      const startApp = () => {
        // invoke the getAUserProfile here
      };

      startApp();
    </script>
  </body>
</html>
#19

Open a thread just for you, so that people will be able to help you without deviate from the original topic of this thread

#20

how do i find the thread

#21

You don’t find it, you click the “new topic” button when you are on the main page of the forum and create it.