JavaScript Fundamentals:
What are they main Data Types in Javascript?
What is an Object?
1. A collection of properties
2. The collection possess properties that have an association between a name (or key) and a value
3. In Javascript the Object collection and Array collection are both of the data type Object.
When an Object has a function definition assigned to a property it is called a method .
All Objects in Javascript inherit methods from the Object prototype.
Prototype - a first, typical or preliminary model of something, especially a machine, from which other forms are developed or copied.
lets abstract this a little bit...
All objects inherit methods and properties from Object.prototype
The Array prototype actually inherits from the Object prototype and also has its own methods as well!
Because Arrays are an ordered collection it is necessary for the data structure to possess native methods specific to its own needs. The .length() method is a one example of this specific need.
var exampleArray = new Array(10);
var collectionCheck = function(collection) {
if(Array.isArray(collection) {
console.log("This is an Array checked by the isArray method!");
}else {
console.log("This is not an Array");
}
}
collectionCheck(exampleArray)
//This is an Array checked by the isArray method!
Native methods FTW!
Concepts we'll cover:
Bring together all of the concepts we've learned to and see the correlation between them and native methods.
var pocketmons = ['Charisaur', 'Bulbazard', 'Twomew'];
var logger = function(val){
console.log(val);
};
pocketmons.forEach(logger);
//'Charisaur'
//'Bulbazard'
//'Twomew'
//list.forEach(iterator)
var each = function(list, iterator) {
//function body here to make each work
};
//Example invocation:
pocketmons.each(function(element){
console.log(element);
});
//'Charisaur'
//'Bulbazard'
//'Twomew'
list.each = function(callback) {
//loop through the collection
//invoke the callback on each element in the collection
};
list.each = function(callback) {
for (var i = 0; i < list.length; i++) {
callback(list[i], i, list);
};
};
// Let's use _.each to solve this problem:
var addTwoToAllElements = function(arr){
_.each(arr, function(val, index, collection){
collection[index] = val + 2;
});
};
var arr = [1, 2, 3, 4, 5];
addTwoToAllElements(arr);
console.log(arr) // [3, 4, 5, 6, 7];
Let's solve a problem using each.
// Let's use .forEach to solve this problem:
var addTwoToAllElements = function(arr){
arr.forEach(function(val, index, collection){
collection[index] = val + 2;
});
};
var arr = [1, 2, 3, 4, 5];
addTwoToAllElements(arr);
console.log(arr) // [3, 4, 5, 6, 7];
var pocketmon = ['Charisaur', 'Bulbazard', 'Twomew'];
var stokedFunc = function(val){
return val + '!!!';
};
var stokedPocketmon = pocketmon.map(stokedFunc);
//list.map(iterator)
console.log(stokedPocketmon);
//['Charisaur!!!','Bulbazard!!!','Twomew!!!']
list.map = function(iterator) {
var result = []; // make a new array
this.forEach(function(item, index) {
result.push(iterator(item, index));
});
return result;
};
function AnimalMaker(name) {
return {
speak: function () {
console.log("my name is ", name);
}
};
};
var animalNames = ['Frog', 'Falcon', 'Fox'];
// Remember coding WITHOUT Underscore?
var farm = [];
for(var i = 0; i < animalNames.length; i++){
farm.push(AnimalMaker(animalNames[i]));
}
function AnimalMaker(name) {
return {
speak: function () {
console.log("my name is ", name);
}
};
};
var animalNames = ['Frog', 'Falcon', 'Fox'];
// Mapping builds up an array and returns it.
var farm = animalNames.map(function (name) {
return AnimalMaker(name);
});
// A forEach loop returns nothing.
// Just use it to iterate over an array.
farm.forEach(function (animal) {
animal.speak();
});
I want to simply loop through an array or object.
I want a new array based on an existing one.