jasonseminara/index.html

## index.html
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>

<script id="jsbin-javascript">
const colors = 'red orange red yellow green blue yellow indigo violet red indigo orange green blue';


// Challenge: remove dupes, preserving order; return a string
// one simple way could be to use a hash and remove the dupes, preserving the order it was in:

const colorsMapped = colors.split(' ').reduce((set, item, i) => {
  if (item in set) return set;

  // if the item isn't in the set, put it in and record its position
  // don't do any mutations!
  // [item] sets a dynamic key in the newly destructured (and cloned) object
  return {
    ...set,
    [item]: i,
  }

}, {});


// Object.entries converts our unsortable object into an array we can sort
// @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries
// each item will be [color, order]
const solution1 = Object.entries(colorsMapped)
    /* destructure the args so each item will be [color, order]; sort by order */
  .sort(([ ,orderA], [ ,orderB]) => orderA - orderB)
    /* sort doesn't let us modify the array, so let's map over and grab only what we need */
  .map(([colorName]) => colorName)
    /* convert to a string */
  .join(' ');

console.log(solution1);


/**
 * one-line solution with sets!
 */

const oneliner = [...new Set(colors.split(' '))].join(' ');
console.log(oneliner);

/**
 * WHOAH! let's break that down!
 */

// break up the string on spaces
const colorArray = colors.split(' ');

// use the Set constructor to convert the array into a non-repeating set
// @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set#Description
const colorSet = new Set(colorArray);

// we want
</script>


<script id="jsbin-source-javascript" type="text/javascript">
const colors = 'red orange red yellow green blue yellow indigo violet red indigo orange green blue';


// Challenge: remove dupes, preserving order; return a string
// one simple way could be to use a hash and remove the dupes, preserving the order it was in:

const colorsMapped = colors.split(' ').reduce((set, item, i) => {
  if (item in set) return set;

  // if the item isn't in the set, put it in and record its position
  // don't do any mutations!
  // [item] sets a dynamic key in the newly destructured (and cloned) object
  return {
    ...set,
    [item]: i,
  }

}, {});


// Object.entries converts our unsortable object into an array we can sort
// @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries
// each item will be [color, order]
const solution1 = Object.entries(colorsMapped)
    /* destructure the args so each item will be [color, order]; sort by order */
  .sort(([ ,orderA], [ ,orderB]) => orderA - orderB)
    /* sort doesn't let us modify the array, so let's map over and grab only what we need */
  .map(([colorName]) => colorName)
    /* convert to a string */
  .join(' ');

console.log(solution1);


/**
 * one-line solution with sets!
 */

const oneliner = [...new Set(colors.split(' '))].join(' ');
console.log(oneliner);

/**
 * WHOAH! let's break that down!
 */

// break up the string on spaces
const colorArray = colors.split(' ');

// use the Set constructor to convert the array into a non-repeating set
// @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set#Description
const colorSet = new Set(colorArray);

// we want </script></body>
</html>

## jsbin.luwewetezu.js
const colors = 'red orange red yellow green blue yellow indigo violet red indigo orange green blue';


// Challenge: remove dupes, preserving order; return a string
// one simple way could be to use a hash and remove the dupes, preserving the order it was in:

const colorsMapped = colors.split(' ').reduce((set, item, i) => {
  if (item in set) return set;

  // if the item isn't in the set, put it in and record its position
  // don't do any mutations!
  // [item] sets a dynamic key in the newly destructured (and cloned) object
  return {
    ...set,
    [item]: i,
  }

}, {});


// Object.entries converts our unsortable object into an array we can sort
// @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries
// each item will be [color, order]
const solution1 = Object.entries(colorsMapped)
    /* destructure the args so each item will be [color, order]; sort by order */
  .sort(([ ,orderA], [ ,orderB]) => orderA - orderB)
    /* sort doesn't let us modify the array, so let's map over and grab only what we need */
  .map(([colorName]) => colorName)
    /* convert to a string */
  .join(' ');

console.log(solution1);


/**
 * one-line solution with sets!
 */

const oneliner = [...new Set(colors.split(' '))].join(' ');
console.log(oneliner);

/**
 * WHOAH! let's break that down!
 */

// break up the string on spaces
const colorArray = colors.split(' ');

// use the Set constructor to convert the array into a non-repeating set
// @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set#Description
const colorSet = new Set(colorArray);

// we want
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width">
	<title>JS Bin</title>
	</head>
	<body>

	<script id="jsbin-javascript">
	const colors = 'red orange red yellow green blue yellow indigo violet red indigo orange green blue';


	// Challenge: remove dupes, preserving order; return a string
	// one simple way could be to use a hash and remove the dupes, preserving the order it was in:

	const colorsMapped = colors.split(' ').reduce((set, item, i) => {
	if (item in set) return set;

	// if the item isn't in the set, put it in and record its position
	// don't do any mutations!
	// [item] sets a dynamic key in the newly destructured (and cloned) object
	return {
	...set,
	[item]: i,
	}

	}, {});



	// Object.entries converts our unsortable object into an array we can sort
	// @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries
	// each item will be [color, order]
	const solution1 = Object.entries(colorsMapped)
	/* destructure the args so each item will be [color, order]; sort by order */
	.sort(([ ,orderA], [ ,orderB]) => orderA - orderB)
	/* sort doesn't let us modify the array, so let's map over and grab only what we need */
	.map(([colorName]) => colorName)
	/* convert to a string */
	.join(' ');

	console.log(solution1);



	/**
	* one-line solution with sets!
	*/

	const oneliner = [...new Set(colors.split(' '))].join(' ');
	console.log(oneliner);

	/**
	* WHOAH! let's break that down!
	*/

	// break up the string on spaces
	const colorArray = colors.split(' ');

	// use the Set constructor to convert the array into a non-repeating set
	// @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set#Description
	const colorSet = new Set(colorArray);

	// we want
	</script>



	<script id="jsbin-source-javascript" type="text/javascript">
	const colors = 'red orange red yellow green blue yellow indigo violet red indigo orange green blue';


	// Challenge: remove dupes, preserving order; return a string
	// one simple way could be to use a hash and remove the dupes, preserving the order it was in:

	const colorsMapped = colors.split(' ').reduce((set, item, i) => {
	if (item in set) return set;

	// if the item isn't in the set, put it in and record its position
	// don't do any mutations!
	// [item] sets a dynamic key in the newly destructured (and cloned) object
	return {
	...set,
	[item]: i,
	}

	}, {});



	// Object.entries converts our unsortable object into an array we can sort
	// @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries
	// each item will be [color, order]
	const solution1 = Object.entries(colorsMapped)
	/* destructure the args so each item will be [color, order]; sort by order */
	.sort(([ ,orderA], [ ,orderB]) => orderA - orderB)
	/* sort doesn't let us modify the array, so let's map over and grab only what we need */
	.map(([colorName]) => colorName)
	/* convert to a string */
	.join(' ');

	console.log(solution1);



	/**
	* one-line solution with sets!
	*/

	const oneliner = [...new Set(colors.split(' '))].join(' ');
	console.log(oneliner);

	/**
	* WHOAH! let's break that down!
	*/

	// break up the string on spaces
	const colorArray = colors.split(' ');

	// use the Set constructor to convert the array into a non-repeating set
	// @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set#Description
	const colorSet = new Set(colorArray);

	// we want </script></body>
	</html>