diff --git a/src/components/DivElement.js b/src/components/DivElement.js index 7e22bcb..1149093 100644 --- a/src/components/DivElement.js +++ b/src/components/DivElement.js @@ -1,5 +1,11 @@ -// Import HTMLElement here +import HTMLElement from './HTMLElement'; -// Define class here +class DivElement extends HTMLElement { + constructor(content) { + super(content); + this.tag = 'div'; + this.content = content; + } +} -// Export class here +export default DivElement; diff --git a/src/components/HTMLElement.js b/src/components/HTMLElement.js index 559b785..f5bdd66 100644 --- a/src/components/HTMLElement.js +++ b/src/components/HTMLElement.js @@ -1,4 +1,15 @@ -// Define class here +class HTMLElement { + constructor(tag, content) { + this.tag = tag; + this.content = content; + } -// Export class here -export default {}; + render() { + const sTag = `<${this.tag}>`; + const eTag = ``; + const elem = sTag + this.content + eTag; + return elem; + } +} + +export default HTMLElement; diff --git a/src/rolodex/rolodexPrinter.js b/src/rolodex/rolodexPrinter.js index 0f12389..1cf7abd 100644 --- a/src/rolodex/rolodexPrinter.js +++ b/src/rolodex/rolodexPrinter.js @@ -1,11 +1,33 @@ import people from './people.json'; -people.forEach(function (person) { +people.forEach((person) => { const names = person.name.split(' '); const firstName = names[0]; const lastName = names[1]; - const email = person.email; - const phone = person.phone; + const { email } = person; + const { phone } = person; + console.log(`First name: ${firstName}\nLast name: ${lastName}\nEmail: ${email}\nPhone number: ${phone}\n`); +}); + +console.log('****** Refactor the code to use template literals *******'); +people.forEach((person) => { + const firstName = ` ${person.name.split(' ')[0]} `; + const lastName = ` ${person.name.split(' ')[1]} `; + const email = ` ${person.email} `; + const phone = ` ${person.phone}`; + console.log(`First name: ${firstName}\nLast name: ${lastName}\nEmail: ${email}\nPhone number: ${phone}\n`); +}); + +console.log('****** Refactor the code to use object destructuring ******'); +people.forEach((person) => { + const { name, email, phone } = person; + const [firstName, lastName] = name.split(' '); + console.log(`First name: ${firstName}\nLast name: ${lastName}\nEmail: ${email}\nPhone number: ${phone}\n`); +}); - console.log('First name: ' + firstName + '\nLast name: ' + lastName + '\nEmail: ' + email + '\nPhone number: ' + phone + '\n'); +console.log('******Refactor the code to use array destructuring. *****'); +people.forEach((person) => { + const [, name, , email, , phone] = Object.values(person); + const [firstName, lastName] = name.split(' '); + console.log(`First name: ${firstName}\nLast name: ${lastName}\nEmail: ${email}\nPhone number: ${phone}\n`); }); diff --git a/src/timer/Timer.js b/src/timer/Timer.js index 2453ed9..37c4392 100644 --- a/src/timer/Timer.js +++ b/src/timer/Timer.js @@ -1,17 +1,37 @@ -function Timer(seconds) { - this.seconds = seconds; -} +//* Examine the code in these two files and determine each script's behavior. +// function Timer(seconds) { +// this.seconds = seconds; +// } +// Timer.prototype.start = function () { +// var instance = this; +// var timerInterval = setInterval(function () { +// if (instance.seconds === 0) { +// clearInterval(timerInterval); +// } +// console.log(instance.seconds); +// instance.seconds -= 1; +// }, 1000); +// }; +// --- * Refactor the code to use the ES6 class syntax. +class Timer { + constructor(seconds) { + this.seconds = seconds; + } -Timer.prototype.start = function () { - var instance = this; - var timerInterval = setInterval(function () { - if (instance.seconds === 0) { - clearInterval(timerInterval); - } + start() { + // * Refactor the code to use `let/const`. + // * Refactor the code to avoid assigning `this` to a variable. + let instance = this.seconds; - console.log(instance.seconds); - instance.seconds -= 1; - }, 1000); -}; + // * Refactor the code to use arrow function(s). + const timerInterval = setInterval(() => { + if (instance === 0) { + clearInterval(timerInterval); + } + console.log(instance); + instance -= 1; + }, 1000); + } +} export default Timer;