Why the following code does not increase the variable a for 1 ?
var a =5;
function abc(y){
y++;
}
abc(a);
//a is 5 not 6 why?
but this does
var a = 5;
function abc(){
a++;
}
abc();
//a is 6
Because primitive values are passed by value in JavaScript.
To get the value to be updated, you could put a on an object and take advantage of the fact that objects are passed by reference (well, mostly, really a copy of the reference is passed, but we won't worry about that):
var obj = { a: 5 };
function abc(o){
o.a++;
}
abc(obj);
it takes the argument, but doesn't return any values.
y is just an argument for this I suggest two ways to do this
var a = 10
function increase(){
a++
}
increase();
var a = 10;
function increase(a){
return a++;
}
a = increase(a);
For a beginner's sake,
In simple words, when you call function by abc(a), 'a' is not passed to function abc but its value is copied to 'y'. (Its called pass by value). Since only 'y' in increased, you dont see an updated value of 'a'.
Related
I would like to extend Number with a plusPlus2 function that will increment the number by 2.
The problem is that I don't know how to assign the result back to the number in the extension function. Something like:
Number.prototype.plusPlus2 = function() {
this = this + 2;
}
And the usage would be:
x = 1;
x.plusPlus2(); // expect x to be 3
Primitives (numbers, strings, booleans) are immutable in javascript.
So anytime you change a primitive, you need to assign it to another variable (or even reassign it to itself).
That being said, you cannot do what you propose, you need to return a new value, containing the value you want, let's say:
Number.prototype.plusplus2 = function() {
return this + 2;
}
And then reassign it:
let x = 5;
x = x.plusplus2();
Then, you may be wondering: how x++ works?
And the answer is, x++ is a syntax sugar for x = x + 1, meaning that, in fact, you are not changing x, but instead, adding 1 to x and reassigning it to itself.
You cannot. That has various reasons:
1) this is read only, as you don't expect it to change during the execution of a method.
2) What you access with this is a Number object that wraps the primitive number. It gets thrown away after the call. So even if you could change the internal value property containing the number, the value of x won't change.
Number.prototype.example = function() { this.stuff = "you see" };
let x = 1; // primitive
x.example(); // wrapped object
// wrapped object gets thrown away
console.log(x.stuff); // undefined, another wrapped object
3) Numbers are immutable and primitive. You can write a new number into x, but you can't turn all 1s into 3s.
You could create a new number, but then you have the problem that you have to write that number into x.
Number.prototype.plus2 = function() { return this + 2 };
let x = 1;
x = x.plus2();
Number.prototype.plus2 = function() {
return this + 2
}
let a = 2
console.log(a.plus2())
I was watching a JavaScript talk, and the tutor said that if we pass a property of an object in a function it will actually change the real value, because we will be passing the variable by reference. Here is the slide:
but when I tried to practice the concept, that wasn't the case. Here is my code:
var obj = {val: 5};
function changeVal(x) {
x = x+5;
return x;
}
console.log(obj.val) // 5
console.log(changeVal(obj.val)) // 10
console.log(obj.val) // 5
I was expecting obj.val to change to 10.
Please tell me what's wrong here, and correct me if I am wrong. Thanks
You are passing not the object, but the primitive type. So when you pass the val of the obj, it is a number and is a primitive type.It copies the val and passes the copy to the object.
If you pass like this, it will work
var obj = {val: 5};
function changeVal( param ) {
param.val = param.val + 5;
return param.val ;
}
console.log(obj.val) // 5
console.log(changeVal(obj)) // 10
console.log(obj.val) // 10
You are not actually passing an object, just passing the value of property(val).
If you will pass obj in changeVal(), then it will actually change the value of the property of passed object.
For that you need to do like:
var obj = {val: 5};
function changeVal(x)
{
x = x+5;
return x;
}
console.log(obj.val); // 5
changeVal(obj); // Need to pass object instead of value of the property's value
console.log(obj.val); // 10
Primitive types (string, integer, boolean, etc...) are immutable, which means if you change one of the values inside a function, the callee (scope which calls your function) will not see the change.
function doSomething(a) {
a = a + 1;
}
var value = 2;
console.log(value); // result: 2
doSomething(value);
console.log(value); // result: 2
Pass-by-reference only works for objects. Like this:
function doSomething(obj) {
obj.attribute = obj.attribute + 1;
}
var myObject = {attribute: 2};
console.log(myObject.attribute); // result: 2
doSomething(myObject);
console.log(myObject.attribute); // result: 3
More reading about Javascript types:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures
Say for instance you have an Iphone . Now lets say a manufacturing company calls you and asks to borrow your Iphone for a reference just so they can design an Iphone that is similar and sell it to customers . Your original Iphone still exists and is never gone , but every now and then the factory needs to use it for a reference , think of your function as the factory that just make a copy of obj.
//Original data
var obj = {val: 5};
Once your function returns something , it technically becomes a value
Example :
return 3; is a value of 3
so
function changeVal(x) {
x = x+5;
return x;
}
is a new value of x which in this case would be x + 5;
x is a copy of whatever you pass into the function .
Hope this helps.
var a = 1;
function x() {
a = 2
console.log(a) // 2
}
x();
console.log(a); // 2
and :
var a = 1;
function x(p) {
p = 2
console.log(p) // 2
}
x(a);
console.log(a); // 1
Why is the output of the second example 1 instead of 2?
It's because your p variable exists only inside function x(p). So, you have a new space in memory, a copy variable a. In the first example, it's a pointer to memory address of variable a.
In other hand, objects have a "pass by reference", so if you do this:
var obj = { foo: 1 };
function x(paramObj) {
paramObj.foo = "2";
}
x(obj);
alert(obj.foo);
You will see "2" instead of "1".
Because function arguments are 'created' when the function gets executed.
var a = 1;
function x(p) {
p = 2
console.log(p) // 2
};
In this piece of code you create global variable a = 1; Then you pass it to the x function. Inside the function you set the given parameter to 2 and console.log it; But what really happens is this:
var a = 1;
function x(given_argument) {
var p = given_argument;
p = 2; // global a variable still equals 1;
console.log(p) // 2
};
This is because there are 2 types of variables in Javascript. Values like number, string, boolean etc that are just values and referential types like arrays, objects.
If you know C++ then this should lighten things up a bit. Here is equivalent of what happens in Javascript, written in C++:
// javascript
var a = 1; // plain value
// c++
int a = 1; // plain value
// javascript
var a = {}; // referential type, this is a pointer behind the scenes
// or
var a = new Object(); // if you prefer it this way
// c++
Object* a = new Object(); // this is a pointer to the object, but in C++ you make it a pointer explicitly, in Javascript this happens 'automagically'.
Referential types in Javascript are pointers, it means they can be changed from inside function, if passed as arguments. But if you pass normal value like number or boolean, it is declared inside the function, and it happens implicitly.
I hope it clarified the problem.
I have recently encountered a nasty issue in JS.
Let say we pass a map, an array of objects to a function f.
var o=[{a:0}];
function f(a){
for(var i in a){
if (a.hasOwnProperty(i)){
a[i]=null;
}
}
return a;
};
var outp=f(o);
alert(outp[0]+" === "+o[0]+" : "+(outp[0]===o[0]));
// here we expect loose equality, and equality in type,
//furthermore it should identically equal as well, and we got right!
But, we can not pass total responsibility of an object to a function as argument, same like in functional paradigm o=(function(o){return o})(), because any kind of modification to o is not referenced!
var o=[];
function ff(a){
return (a=undefined);
};
var outp=ff(o);
alert(outp+" === "+o.constructor+" : "+(outp===o));
// here we expect true, but we got false!
Why is the above described reference loss and
presumably different referencce handling in the second use case,
though in both case, functions got the array argument in the 0. position?
Javascript always passes arguments by value, so this won't work:
function foo(x) {
x = 100;
}
y = 5
foo(y)
y == 100 // nope
However this does work:
function foo(x) {
x.bar = 100;
}
y = {}
foo(y)
y.bar == 100 // yes
In the second snippet x is still passed by value, but this very value is a reference (pointer) to an object. So it's possible in a function to dereference it and access what's "inside" the object.
I'm learning JS here, and have a question regarding primitive values when passed in as arguments. Say I have a simple function:
var first = 5;
var second = 6;
function func(){
first+=second;
}
func();
alert(first); //outputs 11
So in this case the value of first becomes 11.. But if I try it by passing in first as an argument to the function, first remains 5..
var first = 5;
var second = 6;
function func(first){
first+=second;
}
func(first);
alert(first); //outputs 5
wondering if someone could explain this to me.
It happens because when you call function first() with no arguments, it uses the global var "first". But when you call function first(first), you says to browser that now first is a local variable (only inside the function) and it doesn't make any changes to the global var first. Here's the code:
var first = 5;
var second = 6;
function func(first){
first += second; //Local var "first" + global var "second"
alert(first); //Local var, outputs 11
}
func(first);
alert(first); //Global var, outputs 5
Due to Javascript's scoping, the scoped variable first is overriding the global variable first. In other words, you're adding second to the scoped version of first inside your function (which is scoped because you're declaring it inside the function), and the global version of first is unaffected.
If you remove the first's declaration from the function, Javascript goes for the next version of first it can find--in this case, the global one.
var first= 5;
var second= 6;
function func(first){
first+=second; // change the local first variable
}
func(first);
alert(first);//outputs 5 - the outer variable wasn't changed.
var first= 5; // global var
var second= 6;
function func(){ // first wasn't defined in the inner scope.
first+=second; // change the global bar
}
func();
alert(first);//outputs 11 - the outer variable was changed.
Mark Linus got your answer right, but I want to add an important note. Primitive values in JavaScript are always passed by value, where Array's and Object's are always passed by reference. Example:
var first = [ 'a', 'b' ];
function func( arr ) {
arr.push( 'c' );
}
func( first );
alert( first.join( ',' )); // output is 'a,b,c'
It gets more complicated if you have Objects in Objects or Arrays. Just remember that an alteration will affect all instances in your program.