myArray =["My", "first", "array"]
//create a function which generate a copy of the values in the myArray for later transformation. Or any edits upon an array will be reflected back to the previous arguments.
function makeCopy(source)
{
var target={}
var tem=source.join(" ")
//turn the array into string, so that the orginal values will not be modified
target=tem.split(" ")
//split the generated string into array again, and we are able to edit target (the copy of source) without changing the values of source
return target
}
myArray[2]
{
let arraySlice= myArray
return arraySlice.slice(0, 2)
}
myArrayCopy=makeCopy(myArray)
{
myArrayCopy.push("last")
return myArrayCopy
}
myArrayCopy.length
{
var myArrayCopy2=makeCopy(myArrayCopy)
myArrayCopy2.pop()
myArrayCopy2.push("new")
return myArrayCopy2
}
array1=['I', 'am', 'learning','Javascript','to','munge','large','datasets','and','visualize','them']
{
let arrayCopy1=makeCopy(array1)
return arrayCopy1.join(" ")
}
{
let arrayCopy1=makeCopy(array1)
return arrayCopy1.reverse()
}
{
let arrayCopy1=makeCopy(array1)
return arrayCopy1.sort()
}
{
let arrayCopy1=makeCopy(array1)
return arrayCopy1.sort(function(a,b){
return a.toLowerCase().localeCompare(b.toLowerCase())
})
}
html`
My facorite color is
<i style="background:pink;">pink</i>,
<i style="background:purple;">purple</i>,
<i style="background:yellow;">yellow</i>,
<i style="background:red;">red</i>,
<i style="background:blue;">blue</i>.
`
md`
The current time is
***${new Date(now).toLocaleTimeString()}***
***${new Date(now).toLocaleDateString()}***.
`
//refer to https://support.discordapp.com/hc/en-us/articles/210298617-Markdown-Text-101-Chat-Formatting-Bold-Italic-Underline-
directory = {
const myFavoritePlace = {"place":[
{"location":"735 Massachusetts Ave", "name":"Shanghai Fresh","latitude":"42.367165", "longitude":"-71.105062", "country":"US" },
{"location":"4 Jingshan Front St", "name":"The Palace Museum","latitude":"39.916575", "longitude":"116.397144", "country":"China" },
{"location":"Xihu", "name":"West Lake","latitude":"30.245044", "longitude":"120.150190", "country":"China" },
{"location":"204 Freedom Trail", "name":"The Freedom Trail Foundation","latitude":"42.363173", "longitude":"-71.056131", "country":"US" },
{"location":"19 Xinjiangongmen Rd", "name":"Summer Palace","latitude":"40.000188", "longitude":"116.275482", "country":"China" }
]};
return myFavoritePlace
}
directory.place[1]
function Upper(place){
place[0].name=place[0].name.toUpperCase();
place[1].name=place[1].name.toUpperCase();
return place
}
//"place[0].name.toUpperCase()" will not change the original object, maybe due to the characteristics of toUpperCase function?
//test
Upper(directory.place)
html`
<a href="https://publications.iom.int/system/files/pdf/fatal_journeys_volume_3_part_1.pdf">
<img width="600" src="https://i.imgur.com/0RIIUBz.jpg"></img>
</a>
`
//add the picture inside <a> </a> so make the link on the picture.
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.
