JavaScript Samples with Arrays & Functions

arraysamples.js

var consoleHeader = "color: rebeccapurple; font-size: large";
console.header = function(text) {console.log(`%c${text}`,consoleHeader)}



console.header("Array of Objects");

// delcare array of objects
var links = [
    { title: "first item", address: "/project"},
	{ title: "second item", address: "/homepage"}
]
console.log(links);


console.header("Parameters can have names or be anonymous");

// store string as variable, and pass in variable
var kyle = "hi"
console.log(kyle)

// pass in string direclty
console.log("hi")


console.header("Using Functions Example #1");

// declare a function named potato
// the first item in the that function is called lamp
function potato(lamp) {

	// exeucte we code we want
	console.log(lamp);
}

// call a function named potato twice with different input
potato("television")
potato("computer")



console.header("Using Functions Example #2");

function KylesFunc(personName) {
    console.log(`${personName} is cool`)
}

var myName = "JJ Cool J"
KylesFunc(myName)



console.header("Using Functions Example #3");

// take in any array as a parameter and return it's length
function HowBigIsThisArray(myArray) {
    return myArray.length;
 }
 HowBigIsThisArray(links)



 console.header("Using Functions Example #4");

// we want to loop through items in an array and log each position

// do everything inline
for(i = 0; i < links.length; i++) {
    console.log(i)
}

// use a function and take in any array as a parameter and log each index position
function LogEachArrayPosition(myArray) {
	for(i = 0; i < myArray.length; i++) {
		console.log(i)
    }
}
LogEachArrayPosition(links)



console.header("Using Functions Example #5");

function DoSomethingToEachItemInArray(array) {
	for(i = 0; i < array.length; i++) {
        var item = array[i];
		
		// do something to item
		console.log(item)
    }
}

console.header("Using Functions Example #6");

var customLog = function (myDiffItemName) {
	console.log(myDiffItemName)
}
customLog("sefe")



console.header("Using Functions Example #7");

function DoSomethingToEachItemInArray(array, callback) {
	
	for(i = 0; i < array.length; i++) {
        var item = array[i];
		
		// execute any code

		// console.log(i)
		// console.log(item);
		// customLog(item);
        callback(item);
		
    }
}

var customLog = function (myDiffItemName) {
	console.log(myDiffItemName)
}

DoSomethingToEachItemInArray(links, function (myDiffItemName) {
	console.log(myDiffItemName)
})




console.header("Extending Base Objects");

// base objects have methods that are available to them
// we can add to that collection
var greeting = "Hi Kyle"

// write a function that takes in strings
var convertToJames = function(someString) {
	// instead of parameter, use 'this' to grab object
	return someString.replace("Kyle","James");
}
console.log(convertToJames(greeting))

// extend string object
String.prototype.convertToJames = function() {
	// instead of parameter, use 'this' to grab object
	return this.replace("Kyle","James");
}
console.log(greeting.convertToJames())



console.header("Custom Array For Each");

Array.prototype.ForEachItem = function (callback) {
	for(i = 0; i < this.length; i++) {
        var item = this[i];
        callback(item);	
    }
}
links.ForEachItem(function(link) {console.log(link)})


console.header("Array handling");

// delcare array of objects
var links = [
    { title: "first item", address: "/project"},
	{ title: "second item", address: "/homepage"}
]

// indexed for loop
for (var i = 0; i < links.length; i++ ) {
	var myLink = links[i];
	
	console.log(myLink);
}

// for each loop
links.forEach(function(myLink) {

    console.log(myLink);
});

// for ... in loop  (not for arrays in js)
// for (var link in links) {
// 	console.log(link)
// }