// Your code here
// 1. Create a list containing any 4 strings.
list0 = ["fat", "dog", "bird", "paper"]
// 2. Print the 3rd item in the list
list0 [2]
// 3. Print the 1st and 2nd item in the list using [:] index slicing.
list0.slice(0,2) // Number in parenthesis indicate which words (order) we want to print
// 4. Add a new string with text “last” to the end of the list and print the list.
lista = [list0 + ",last"]
// 4. Add a new string with text “last” to the end of the list and print the list.
list_last = {
let list_last = list0.concat("last") // "concat" = concatenate --> makes the array stay linked together. If we use "push" instead, it will add "last" every time we press play
return list_last
}
// 5. Get the list length and print it.
list0.length
list_last.length
// 6. Replace the last item in the list with the string “new” and print
list_new = {
let list_new = list_last;
list_new.splice(4,1, "new") // Splice: The first number in the paranthesis indicates the word order. In this case 4 = "paper". The second number indicates how many words should be taken out of the array. In this case 1 = we only want to take out the word "last".
return list_new
}
array1=['I', 'am', 'learning','Javascript','to','munge','large','datasets','and','visualize','them']
// 1. Convert the list into a normal sentence with join(), then print.
array1.join( " " )
// 2. Reverse the order of this list [“them”,”visualize”,…]
array1.reverse()
// 3. Now sort the list using the default sort order in python
array1.sort()
// 4. Modify the sort to do a case insensitive alphabetic sort
array2 = array1.sort(function (a, b) {
return a.toLowerCase().localeCompare(b.toLowerCase());
}) // a and b are placeholders for the function, they could have any other name
// 5. Now print the list in reverse alphabetic sort order
array2.reverse()
// Your code here
html`
<html lang="en">
<!-- HEAD element containing meta information, style, and links -->
<head>These are my five favorite colors:</head>
<!-- BODY element containing all document content elements -->
<body>
<h2 id="header" style="background:pink; text-align: center; color: white;">pink</h2>
<h2 id="header" style="background:blue; text-align: center; color: white;">blue</h2>
<h2 id="header" style="background:green; text-align: center; color: white;">green</h2>
<h2 id="header" style="background:yellow; text-align: center; color: white;">yellow</h2>
<h2 id="header" style="background:red; text-align: center; color: white;">red</h2>
</body>
</html>
`
html`
<!-- OL defines an ordered list -->
<ol>
<head>These are my five favorite colors in an ordered list:</head>
<li> <span style="background:yellow;"> yellow </span> </li>
<li> <span style="background:pink;"> pink </span> </li>
<li> <span style="background:blue;"> blue </span> </li>
<li> <span style="background:green;"> green </span> </li>
<li> <span style="background:red;"> red </span> </li>
</ol>
`
html`
<head>These are my five favorite colors in a bullet list:</head>
<li> <span style="background:yellow;"> yellow </span> </li>
<li> <span style="background:pink;"> pink </span> </li>
<li> <span style="background:blue;"> blue </span> </li>
<li> <span style="background:green;"> green </span> </li>
<li> <span style="background:red;"> red </span> </li>
`
html`
<head>These are my five favorite colors, changing the text color instead of the background:</head>
<li> <span style="color: yellow;"> yellow </span> </li>
<li> <span style="color: pink;"> pink </span> </li>
<li> <span style="color: blue;"> blue </span> </li>
<li> <span style="color: green;"> green </span> </li>
<li> <span style="color: red;"> red </span> </li>
`
// Your code here
new Date()
md`This is showing the current time and date: ** *${new Date}* **`
favoritePlaces = [ // favoritePlaces is the name of the array and "[" indicates that the array begins
{ location: 'Lima',
name: 'Home',
latitude: '-12.090080',
longitude: '-76.952824',
country: 'Peru',
}, // Each object goes between {}. There needs to be a comma between each object.
{ location: 'Venice',
name: 'Piazza San Marco',
latitude: '45.434095',
longitude: '12.338504',
country: 'Italy',
},
{ location: 'New York',
name: 'Central Park',
latitude: '40.776945',
longitude: '-73.969834',
country: 'US',
},
{ location: 'Paris',
name: 'Eiffel Tower',
latitude: '48.858307',
longitude: '2.294685',
country: 'France',
},
{ location: 'Cusco',
name: 'Macchu Picchu',
latitude: '-13.163267',
longitude: '-72.544920',
country: 'Peru',
},
]
favoritePlaces[0].name // Number between [] indicates the object order number, then after the dot you insert the property you want to print
favoritePlaces[4].location
// Your code here
function firsttwo (array1) {
return array1[0].name.toUpperCase() + ", " + array1[1].name.toUpperCase()
} // "array 1" is a placeholder. Normally we put a general name because the array could change (e.g. you can apply this function to an array about something else, not favorite places.
firsttwo(favoritePlaces)
// Your code here
html`<a href="http://efectococuyo.com/efecto-cocuyo/la-migracion-venezolana-hacia-suramerica-se-disparo-895-entre-2015-y-2017/"><img src="http://45.33.96.230/wp-content/uploads/2018/03/Tendencias-migratorias-1.jpg"> />`
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
