I am new to JavaScript. And I want to make sense of a feature in JavaScript. Please consider the following example:
function Dog(name) {
this.name = name
}
Dog.prototype.bark = function() {
console.log(this.name +" :Hello, human.");
}
var max = new Dog("Max", "Buddy")
max.bark();
As you can see two arguments were passed into making a new dog object while only one (name) was required.
I know that the second argument is unused, but where is it stored/ is there any utility to passing an extra argument?
Thank you in advance!
They can be retrieved in the arguments object:
arguments is an Array-like object accessible inside functions that
contains the values of the arguments passed to that function.
function Dog(name) {
console.log(arguments);
this.name = name;
}
Dog.prototype.bark = function() {
console.log(this.name +" :Hello, human.");
}
var max = new Dog("Max", "Buddy");
max.bark();
The modern alternative would be the spread operator:
function Dog(...names) {
console.log(names);
}
var max = new Dog("Max", "Buddy");
They are store in arguments array :
function Dog(name) {
this.name = name
console.log(arguments)
}
Dog.prototype.bark = function() {
console.log(this.name +" :Hello, human.");
}
var max = new Dog("Max", "Buddy", "Arm", {name: "Jacob"})
max.bark();
if you are not using js in strict mode you can access the arguments property of function.
function Dog(name) {
this.name = name
// all the arguments are inside arguments property of function
console.log(arguments);
}
Dog.prototype.bark = function() {
console.log(this.name +" :Hello, human.");
}
var max = new Dog("Max", "Buddy")
max.bark();
Javascript is a dynamic language. Same function can accept dynamic arguments. There are multiple way to access all variable passed 2 a function/constructor.
Using arguments.
Using vaargs or rest operator.
Mix of rest operator and arguments.
It depends how you want to use the values. See the below examples.
function DogArgs(name) {
this.name = name;
console.log(arguments); // array like structure [Arguments] { '0': 'Max', '1': 'Buddy' }
}
function DogRest(...names) {
this.name = names[0];
console.log(names); // Array [ 'Max', 'Buddy' ]
}
function DogPartialRest(name, ...others) {
this.name = name;
console.log(others); // Array [ 'Buddy' ]
}
var max1 = new DogArgs("Max", "Buddy");
var max2 = new DogRest("Max", "Buddy");
var max3 = new DogPartialRest("Max", "Buddy");
Example 1: Using arguments
function sum() {
const values = Array.from(arguments); // convertin array, since arguments is not array
return values.reduce((sum, val) => (sum += val), 0);
}
console.log(sum(1, 2, 3)); // 6
console.log(sum(1, 2, 3, 4)); // 10
Example 2: Using vaargs or rest operator.
function sum(...values) {
return values.reduce((sum, val) => (sum += val), 0);
}
console.log(sum(1, 2, 3)); // 6
console.log(sum(1, 2, 3, 4)); // 10
Example 3: Mix of rest operator and arguments
function Person(name, age, ...rest) {
this.name = name
this.age = age
this.salary = 0
if(rest.length) {
this.salary = rest[0]
this.address = rest[1] || ''
}
}
console.log(new Person("deepak", 30)) // Person { name: 'deepak', age: 30, salary: 0 }
console.log(new Person("deepak", 30, 2000)) // Person { name: 'deepak', age: 30, salary: 2000, address: '' }
Related
let construct = function(name = "john", last = "marks") {
return {
name: name,
last: last,
};
};
let me = new construct("mike", "tyson");
console.log(me);
You do not have a constructor function.
A constructor function is one you can call with the keyword new in order to produce a new instance of said function. However, yours that just produces plain objects with no inheritance:
Your implementation:
let construct = function(name = "john", last = "marks") {
return {
name: name,
last: last,
};
};
let me = new construct("mike", "tyson");
console.log(me instanceof construct); //false
Proper constructor function:
let construct = function(name = "john", last = "marks") {
this.name = name;
this.last = last;
};
let me = new construct("mike", "tyson");
console.log(me instanceof construct); //true
This matters if you want to use prototypal inheritance for the produced instances:
let construct = function(name = "john", last = "marks") {
this.name = name;
this.last = last;
};
let me = new construct("mike", "tyson");
construct.prototype.fullName = function() {
return `${this.name} ${this.last}`;
}
console.log(me.fullName()); //"mike tyson"
In order to produce proper instances with new, it needs to either return nothing (which implicitly produces undefined) or return anything other than an object:
function example() {
this.foo = "bar";
return "this is not an object";
}
console.log(example());
console.log(new example());
I have an array of objects, at this moment there is just one object inside. In this object i have a function that elaborate some properties of the same object.
The function is processed outside the array, but the result is NaN, i dont know how pass correctly the values..
Example
let arrayObj = [{
number1: 1,
number2: 2,
sum: sum(this.number1 , this.number2)
}
]
function sum(n1, n2) {
return console.log(n1 + n2);
}
Result: NaN.
for (let i in arrayObj){
console.log(arrayObj[i])
}
Result: {number1: 1, number2: 2, sum: undefined}
If you want a fully usable object during object creation, then use a Function object.
let arrayObj = [new function(){
this.number1 = 1;
this.number2 = 2;
this.sum = sum(this.number1 , this.number2)
}]
// minor edit to return the sum instead of returning the result of the console log
function sum(n1, n2) {
console.log(n1 + n2);
return n1 + n2;
}
for (let i in arrayObj){
console.log(arrayObj[i])
}
However, if you are in need of this function at a later time, and want it accessible for all of those objects, then stop using anonymous objects and create an actual class or prototype.
Prototype:
function Point(number1, number2){
this.number1 = number1;
this.number2 = number2;
}
Point.prototype.sum = function(){
return this.number1 + this.number2;
}
let arrayObj = [
new Point(1,2),
new Point(3,4),
new Point(15,30)
];
for (let i in arrayObj){
console.log(arrayObj[i].sum())
}
Class:
class Point {
constructor(number1, number2){
this.number1 = number1;
this.number2 = number2;
}
get sum(){
return this.number1 + this.number2;
}
}
let arrayObj = [
new Point(1,2),
new Point(3,4),
new Point(15,30)
];
for (let i in arrayObj){
console.log(arrayObj[i].sum)
}
You can add that property to the object when you are iterating over it.
const arrayObj = [{
number1: 1,
number2: 2,
}];
function sum(n1, n2) {
return n1 + n2;
}
for (let i in arrayObj){
arrayObj[i].sum = sum(arrayObj[i].number1, arrayObj[i].number2)
console.log(arrayObj[i])
}
There has a simple solution. you can put an instant function in your sum property and under that function, send the other required values of the object by converting them into variables. See below:
function sum(n1, n2) {
return n1 + n2;
}
const arrayObj = [{
'number1': 1,
'number2': 2,
'sum': function () {
let num1 = this.number1, num2 = this.number2;
return sum(num1, num2);
}
}];
console.log(arrayObj.sum())
You don't have to make a seperate function, you can also write the sum function in the object itself. Now when you access the sum field in your object, it will sum the two values and return it.
let arrayObj = [{
number1: 1,
number2: 2,
sum: function() {
return this.number1 + this.number2;
}
}]
console.log(arrayObj[0].sum());
I have found another interesting solution (I don't remember where I had found it.) for this problem. Using getter function of javascript the problem can solve easily.You can use this in your object directly to use the external function. If a property (key) of an object se the external function to get a value and it have to behave like normal "key:value" pair (not being a method/function), then the getter function is the best way to use to get the value. To know more about it please read it.
function sum(n1, n2) {
return n1 + n2;
}
const arrayObj =
{
get sum() {return sum(this.number1, this.number2)},
number1: 1,
number2: 2,
number3: 4,
get totalsum() {return sum(this.sum, this.number3)} //using the sum property (that used external function) in another property.
};
console.log(arrayObj);
console.log('the sum of '+arrayObj.number1+' & '+arrayObj.number2+' is: '+arrayObj.sum);
console.log('the sum of '+arrayObj.sum+' & '+arrayObj.number3+' is: '+arrayObj.totalsum);
I've been trying to find a way to correctly define an array as one of the constructor values. Let's say we have a student and we need to have an array with his grades and then using the array we need to get an average from the student's grades. Sadly, I only found some threads addressing this in other programming languages. This is what I thought would work:
function student(name, surname, number, grades) {
this.name = name;
this.surname = surname;
this.number = number;
this.grades = [];
this.average = function(grades) {
var sum = 0;
for(var i = 0; i < grades.length; i++) {
sum + = grades[i];}
var average = sum / grades.length;
return average;
}
}
And then
var student1 = new student("Peter","Cat",14444,[2,3,4]);
console.log(student1);
Unfortunately, it shows my grades array as blank and I can't see if my average function is working properly. Which part(s) should I change so that I would actually have some values in the grades array?
Thank you.
You have a couple things messed up. If you are going to pass the grades array in as an argument, then you need to set grades with this:
this.grades = grades;
Also in the average function you need to refer to grades with this.grades not just grades. This will allow you to add more grades later and still get the correct average. You could also consider making the grades optional by defining the constructor with something like:
function student(name, surname, number, grades =[])
Then if you don't pass in a value, an empty array will be waiting for you.
In the end you might have something like:
function student(name, surname, number, grades = []) {
this.name = name;
this.surname = surname;
this.number = number;
this.grades = grades;
this.average = function() {
return this.grades.reduce((a, c) => a + c, 0) / this.grades.length
}
}
var student1 = new student("Peter", "Cat", 14444, [2, 3, 4]);
console.log("Average: ", student1.average())
// add another grade:
student1.grades.push(6)
console.log("New Average: ", student1.average() )
You can solve same problem by using ES6, in your code, you are initializing this.grade=[] with an empty array inside function so further processing of average will be done on empty array only. For good practice, function parameters should be assigned with a default value, so that if mistakenly we do not pass an array as an argument then the function parameter will use the default value. Attaching code snippet for easy understanding in ES6.
class std{
constructor(name, surname, number, grades = []) {
this.name = name;
this.surname = surname;
this.number = number;
this.grades = grades;
}
average() {
if(this.grades.length !== 0){
return this.grades.reduce((previous, current) => previous + current, 0) /
this.grades.length
} else { return "no grades mentioned"; }
}
}
var student1 = new std("Peter", "Cat", 14444, [1, 3, 4]);
console.log("Average: ", student1.average());
//add new student
var student2 = new std("Prasanna", "sasne", 14444);
console.log(student2);
//student2.grades.push(7)
//console.log("New Average: ", student2.average() )
You're already passing grades into the student() function, so you don't need to pass it in to the student.average function (as the inner function will already have access to the outer function parameter). Because of this, you also don't need to set this.grades = [].
Also, sum + = grades[i] should be sum += grades[i].
Simply fixing this error, then omitting passing grades into the inner function will correctly show the average, as can be seen in the following:
function student(name, surname, number, grades) {
this.name = name;
this.surname = surname;
this.number = number;
this.average = function() {
var sum = 0;
for (var i = 0; i < grades.length; i++) {
sum += grades[i];
}
var average = sum / grades.length;
return average;
}
}
var student1 = new student("Peter", "Cat", 14444, [2, 3, 4]);
console.log(student1.average());
Your initialization of the variable is an empty array.
this.grades = [];
Should be
this.grades = grades;
However, I recommend that you study some javascript ES6 / ECMAScript 2015 and use classes.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes
class Student {
constructor(grades) {
//... Other code
this.grades = grades;
}
}
you can use this line :
function student(name, surname, number, grades){ }
instead of this:
function student(name, surname, number, grades = [ ]){ }
function student(name, surname, number, grades) {
this.name = name;
this.surname = surname;
this.number = number;
this.grades = grades;
this.average = function() {
return this.grades.reduce((a, c) => a + c, 0) / this.grades.length
}
}
var student1 = new student("Peter", "Cat", 14444, [2, 3, 4]);
console.log("Average: ", student1.average())
// add another grade:
student1.grades.push(6)
console.log("New Average: ", student1.average() )
We can use the Object Method to store the Average value:
function Student(name, surname, number, grades = [])
{
this.name = name;
this.surname = surname;
this.number = number;
this.grades = grades;
//Method to calculate the Average
this.average = function()
{
if(this.grades.length !==0)
{
//Return the Average Calculation
return this.grades.reduce((previous, current) => previous + current, 0) / this.grades.length
}
else
{
//This will return if grades not provided
return "No Grades Mentioned"
}
}
}
//With Grades
var student1 = new Student("Srinivasan", "Raja", 1635, [22,43,67,89,90]);
console.log(student1, "Average: "+ student1.average());
//Without Grades
var student1 = new Student("Denny", "Lawrence", 1635);
console.log(student1, "Average: "+ student1.average());
I am working on a Person constructor function that takes a name and age as its parameters, and trying to implement a method that retrieves all the 'Person' instances current age value and outputs the average. Here's my code...
var Person = (function() {
//private state
var inst = 1;
function Person(name, age) {
this.name = name;
this.age = age;
Object.defineProperty(this, "age", {
get: function() {
return age;
},
set: function(num) {
age = num;
}
});
Object.defineProperty(this, "_id", {
value: inst++
});
}
//Attempt to return number of instances divided by all current Person weights
Person.prototype.aveAge = function() {
return inst;
};
return Person;
}());
var jim = new Person("jim", 32);
var richard = new Person("richard", 27);
richard.age = 28;
var alfie = new Person("alfie", 42);
Person.aveAge() //Returns TypeError: Person.aveAge is not a function
I have set up a variable that is shared across all instances (inst) that increments each time an another instance is created and assigns a unique id. I cannot figure out how I can get to each 'age' value of all Person instances in existence using the aveAge prototype I have added at the bottom. I am also getting a 'TypeError: Person.aveAge is not a function' when I attempt to call it to even test that variable 'inst' holds the correct number of instances. Does anybody know where I am going wrong?
It feels strange to keep ages on a person when it references people. Notice that hanging things on __proto__ makes them available from the constructor (Person), while hanging things on prototype makes them available from the instance (richard). If Age is updated, it needs to be done via setAge so the PeopleTracker knows to update it's memory. Also, in my example, the average is only calculated when needed rather than each time a person wants to know what is is.
var peopleTracker = {
_count: 0,
_ages: [],
averageAge: 0,
addPerson: function (age) {
var pt = peopleTracker;
pt._count += 1;
pt._ages.push(age);
pt.getAverage();
},
getAverage: function () {
var sum = 0,
pt = peopleTracker;
sum = pt._ages.reduce(function (a, b) {
return a + b;
});
pt.averageAge = Math.round(sum / pt._count);
},
update: function (oldAge, newAge) {
var pt = peopleTracker,
ages = pt._ages,
i = ages.indexOf(oldAge);
ages.splice(i, 1, newAge);
pt.getAverage();
}
};
var Person = function (name, age) {
this.name = name;
this.age = age;
peopleTracker.addPerson(age);
};
Person.__proto__ = { // available from the constructor
Constructor: Person,
setAge: function (age) {
var oldAge = this.age;
this.age = age;
peopleTracker.update(oldAge, age);
},
aveAge: function () {
return peopleTracker.averageAge;
}
};
Person.prototype = Person.__proto__; // now also available from the instance
var jim = new Person("Jim", 32),
richard = new Person("Richard", 27),
alfie = new Person("Alfie", 42);
Person.aveAge(); // 34
richard.aveAge(); // 34
richard.setAge(20);
Person.aveAge(); // 31
richard.aveAge(); // 31
I am new to JS, and I have read a code that contains this line.
this.myArray[index](this._sender, args);
I wonder what it means?
It means that this array item is a function, and it is being called with arguments this._sender and args.
In this example, I declare an array, push a single-argument function to it, and call it.
var arr = [];
arr.push(function(str) {
document.body.innerHTML = "Hey, " + str;
});
arr[0]("Your name");
that means that the myArray[index] is the element of myArray that is function that is why it requires 2 arguments.
It is similar to following snippet:
var myClass = function () {
this._a = 5;
var index = arguments[0] || 0;
this.myArray = [
function (a, b) {
console.log(a, b);
},
function (a, b) {
console.log(a, b);
}
];
this.myArray[index](this._a, arguments);
};
var obj = new myClass(1, 2, 3);//5 [1, 2, 3]
In JavaScript, functions are first class objects so they can be passed around/referenced, stored, and accessed like any other value.
var myArray = [];
var myFunction = function(name) {
console.log("Hello, " + name + "!");
};
myFunction('World');
myArray[0] = myFunction;
myArray[0]('again');
function addDefault(func, defaultValue) {
return function(name) {
name = name ? name : defaultValue;
func(name);
}
}
var myFunctionWithDefault = addDefault(myFunction, 'stranger');
myFunctionWithDefault();
myFunctionWithDefault('goodbye');
JSBin: http://jsbin.com/wubuye/edit?js,console