I have below javascript function-
function ResponseVal()
{
this.value1;
this.value2;
}
var Response = new ResponseVal();
I tried and execute above code in chrome consolebar.I could not understand why newly created object "Response" does not show property value1 and value2. Can anyone help me to understand it what is happening and why properties are not displaying.
You should set the values to something. All you've done is try to read them in the constructor.
function ResponseVal()
{
this.value1 = "";
this.value2 = "";
}
var Response = new ResponseVal();
Declaring a property without setting it essentially does nothing. While it won't result in an error, some interpreters will throw a warning—as will strict mode, I believe.
JavaScript doesn't make this immediately obvious. For example, if you do this:
function Hello() {
this.value1;
}
var h = new Hello;
alert(h.value1);
The alert will read undefined. However, the property value1 was never actually accessed—it doesn't exist at all because you did not provide a value for it.
Rather than throwing an error, JavaScript returns undefined any time you try to access a property that doesn't exist. So you will get the same result if you write, say:
alert(h.property_that_doesnt_exist); //alerts 'undefined'
Iterating through the properties of h shows clearly that the property value1 does not exist:
for (var key in h) {
alert(key + ' = ' + h[key]);
}
This alerts nothing, because no properties will be found. However, if you set the property to the JS primitive undefined, the property WILL exist:
function Hello() {
this.value1 = undefined;
}
var h = new Hello;
for (var key in h) {
alert(key + ' = ' + h[key]); //alerts 'undefined'
}
You can run the above code here: http://jsfiddle.net/Acdmn/
But there's no good reason to set a property/variable to undefined. To create a property with an "empty" value, JavaScript programmers typically use null:
function Hello() {
this.value1 = null;
}
This makes it clear that the property was created intentionally, but you're not ready to give it a meaningful value yet.
Lastly, note that property definitions work differently from "normal" (private) variables explicitly set with var (even though these are also properties, in this case of the window object). If you write:
var foo;
alert(foo);
alert(some_undefined_variable_name);
The first alert will say undefined. The variable foo was created, does exist, and contains the primitive value undefined (even though you didn't set it explicitly). The second alert, however, will throw a reference error:
ReferenceError: some_undefined_variable_name is not defined
So JavaScript is unforgiving about using undefined variables, but it doesn't care if you try to use an undefined property.
They are still undefined. They only exist once defined.
You need to assign values to value1 and value2, 'null' at least.
Related
This is a serious question, It has been nagging me for a while. In JavaScript you can declare a variable which has no type. It's type is often dynamic, depends on further value assigned to it.
e.g
var text;
typeof(text); //undefined
text = 'someText';
typeof(text); //string
So as we know that Javascript can dynamically change variable's type why these assignments are invalid then?
e.g
var someObj;
someObj.a = 'hello world';
console.log(someObj) //TypeError
var someTable;
someTable[0] = 'hello world';
console.log(someTable[0]) //TypeError
where this problem can be fixed just by adding definition to variable declaration:
var someObj = {};
var someTable = [];
I'd expect a good explanation of this problem. Thanks for answers.
There's a big difference between declaration and initialisation of variables.
When you declare a variable without initializing it with a value, its type will be undefined, so when you will try to call it or access it, it will give undefined, because simply there were no value defined for the variable.
That's why it should be initialized:
var someObj = {};
var someTable = [];
So you can treat it as a string, an object or an array according its initialized value.
Documentation:
Please take a look at variables MDN Reference for further reading, where it says:
A var statement declares variables that are scoped to the running execution context’s VariableEnvironment. Var variables are created when their containing Lexical Environment is instantiated and are initialized to undefined when created. [...] A variable defined by a VariableDeclaration with an Initializer is assigned the value of its Initializer’s AssignmentExpression when the VariableDeclaration is executed, not when the variable is created.
You're getting confused about where the error is thrown. In your first example:
var someObj;
someObj.a = 'hello world'; // the error is thrown here
That error is thrown because someObj is undefined (not undeclared). So, you can't access the property a on undefined.
The same explanation applies for your second example:
var someTable;
someTable[0] = 'hello world'; // the error is thrown here
You're trying to access index 0 of undefined.
The reason that defining them as {} and [], respectively, fixes your issue, is that you are then accessing property a of {} and index 0 of [].
1) Data types in Javascript are not dynamic, they are mutable. This means that depending on kind of operation you are applying to them they can change from being something into another thing (e.g. a number can become a string doing something like this: 4 + 'a').
2) The "error" is a consequence of having a variable not initialized. In Javascript when you are doing this:var something = 'a'
you are doing two operations, a declaration, and an assignment. If you don't do the assignment and you try to access to a property of the object you have declared it will throw an error. In your case, you are declaring a variable but not initializing it to the "compiler" can't access the "a" property or the position 1 because it is of type undefined.
On this page, it shows some example code, containing the following line:
var Subject = ( function( window, undefined ) {
What is the undefined as a function parameter?
This is used to prevent from overriding the value of undefined in non-strict mode.
In non-strict mode, the value of undefined can be override by assigning other value to it.
undefined = true; // Or any other value
So, using the value of undefined will not work as expected.
In strict-mode, undefined is read-only and assigning value to it will throw error.
In the code, the value to the last parameter is not passed, so it'll be implicitly passed as undefined.
var Subject = ( function( window, undefined ) {
}(window)); // <-- No parameter is passed for the last value
That is done to make sure that undefined always is undefined. In JavaScript, since undefined isn't a reserved word but a regular variable, this would be allowed for instance:
undefined = 2; // Assign a different value to undefined
if (undefined == 2) // Now this statement would be true
So in your case
var Subject = ( function( window, undefined ) {
They pass in window and use it , but then they don't pass a second value to the undefined parameter, thus undefined will be undefined.
Because you used to be able to redefine the value of undefined, but not anymore. Undefined is a special type that has several use cases. If it was redefined to true, code like this would break:
if(my_var === undefined) {
dont_load_missiles());
} else {
load_missiles();
}
I recently asked a similar question ( SO link ) and the community suggested this article.
Following statements in the selected answer ( link ) theoretically answers the question;
This is used to prevent from overriding the value of undefined in non-strict mode.
In non-strict mode, the value of undefined can be override by assigning other value to it.
I believe a practical example might be helpful
var undefined = 7;
function printUndefined(undefined) {
document.getElementById("output").innerHTML += undefined + "<br/>";
}
printUndefined(); // Output is undefined
printUndefined(undefined); // Output is 7
printUndefined(10); // Output is 10
JSfiddle
Therefore the only guarantee is that the method caller is in control of the context.
Recently, I've been learning JavaScript. I'm coming across a few JavaScript errors that say "__ is undefined" - What exactly does this mean, and why is this coming up? I'm looking more or less for an explanation on why this error is occurring and what can be done to fix it, or why it's generally occurring in the first place.
For example: Here are two functions (validate and onSearch) --- When I try to run "onSearch", I get the Ran SEARCH... trace in the console, however it disappears. Additionally, when I run it through JSHero (trying to debug), it tells me that "onSearch" is undefined, and I'm curious as to why.
I've go some experience developing with ActionScript, but I'm totally new to JavaScript. I'd really appreciate your input and explanation regarding what this actually means. Thanks you.
function validate(query){
console.log("Ran VALIDATE...");
// Trim whitespace from start and end of search query
while(query.charAt(0) === " "){
query = query.substring(1, query.length);
};
while(query.charAt(query.length-1) === ""){
query = query.substring(0, query.length-1);
};
console.log("Query length:",query.length);
console.log("Beginning conditional...");
// Check search length, must have 3 characters
if(query.length < 3){
console.log("Display alert...");
alert("Your search query is too small, try again.");
// (DO NOT FIX THE LINE DIRECTLY BELOW)
searchInput.focus();
}else{
console.log("Searching query...");
onSearch(query);
};
};
// Finds search matches
function onSearch(query){
//var search = function(query){
console.log("Ran SEARCH...");
// split the user's search query string into an array
var queryArray = query.join(" ");
// array to store matched results from database.js
var results = [];
// loop through each index of db array
for(var i=0, j=db.length; i<j; i++){
// each db[i] is a single video item, each title ends with a pipe "|"
// save a lowercase variable of the video title
var dbTitleEnd = db[i].indexOf('|');
var dbitem = db[i].tolowercase().substring(0, dbTitleEnd);
// loop through the user's search query words
// save a lowercase variable of the search keyword
for(var ii=0, jj=queryArray.length; ii<jj; ii++){
var qitem = queryArray[ii].tolowercase();
// is the keyword anywhere in the video title?
// If a match is found, push full db[i] into results array
var compare = dbitem.indexOf(qitem);
console.log("Compare:",compare);
if(compare != -1){
results.push(db[i]);
};
};
};
console.log("Hello");
results.sort();
// Check that matches were found, and run output functions
if(results.length === 0){
noMatch();
}else{
showMatches(results);
};
};
EDIT**
"db" is defined in an external file. It's just an array of URL's. It's still saying it's not defined as well, which is what I'm asking.
How do you define
1) A variable
2) A function
If you get a TypeError along the lines "Blah is undefined" or "cannot read property foo of undefined", it means that you have a variable or property that has the value undefined, which is the default value for a variable until you assign something to it.
This is as opposed to having a variable you haven't defined yet and trying to read its value, which will fire a ReferenceError instead.
For instance, consider the below:
var foo;
console.log(foo.bar); // "TypeError: Cannot read property 'bar' of undefined"
The foo variable exists, but its value is undefined, so trying to read a property from it causes an error.
Contrast that to:
console.log(missing); // "ReferenceError: missing is not defined"
Here, the symbol missing is not defined; the engine has no idea what you're talking about. This usually indicates a missing var statement.
Side note: JavaScript has a very surprising behavior if you assign to a variable you've never declared (in ES3 or in ES5 in "loose" mode): It creates a global variable. I call this The Horror of Implicit Globals. It means that if instead of console.log(missing); above, I did this:
missing = "foo";
...I'd be creating a new global variable, even if that code is within a function. Thankfully, in ES5, we can use "strict" mode, which makes this the ReferenceError it always should have been. :-)
It usually means that the 'thing' you're requesting does not exist(or atleast can't be found by the function requesting it). This can be a variable, object or a function.
In the case of the onSearch you're talking about is that the function can't be found, most likely. It could be that the file with the function in it is loaded after the file requests it(So onSearch is in b.js, the one requesting it is in a.js. a.js is in your <head> before b.js). Therefore it's not yet present, since javascript files load linear.
Your problem
The problem is not that onSearch is undefined, but it uses a variable db which is undefined.
Cases
(From now on I will assume qwertyuiopasddsghjdsvjkfhjkl is not declared)
You see undefined errors when:
You use variable you have not declared.
qwertyuiopasddsghjdsvjkfhjkl; // ReferenceError: qwertyuiopasddsghjdsvjkfhjkl is not defined
You use a property on a declared but undefined variable:
var a;
a.b; // TypeError: a is undefined
A variable is undefined when:
(Error) You have not declared it
// qwertyuiopasddsghjdsvjkfhjkl is undefined
qwertyuiopasddsghjdsvjkfhjkl; // ReferenceError: qwertyuiopasddsghjdsvjkfhjkl is not defined
(No error) You have declared it but it has no value
var a; //a is undefined
(No error) You assign a variable to void(0) (you can change 0 with everything) or and unmodified undefined
var a = undefined; //a is undefined
var a = void(0); //a is undefined
undefined = 'abc';
var a = undefined; //a is NOT undefined
How to check
If you don't know if a variable is undefined, you can use
typeof myVar === 'undefined'
It returns true if:
myVar is not declared
myVar is declared but is undefined
It returns false if myVar is declared and myVar is not undefined
myVar === void(0)
It returns true if myVar is declared and myVar is undefined
It returns false if myVar is declared and myVar is not undefined
It throws an error if myVar is not declared
myVar === undefined
It's the same as myVar === void(0) if undefined has not been modified.
!myVar, if(myVar)
It returns true if myVar is declared and
myVar is undefined
or
myVar is falsy (null, 0, false, '')
It returns false if myVar is declared and myVar is truthy
It throws an error if myVar is not declared
I want to create an object such that object.a is an array while object.b is the length of it and this is what I have:
var object = {
a:[1,2,3,2],
b: this.a.length
}
alert(b);
But this won't alert 4. There is something wrong with b: this.a.length:
Uncaught TypeError: Cannot read property 'length' of undefined
I'd be glad if someone can explain to me why this is happening.
It would actaully alert 4 if I write it this way:
var object = {
a:[1,2,3,2]
}
alert(object.a.length);
[update] even create the object this way, it doesn't work:
var object = {
a:[1,2,3,2],
b：object.a.length
}
The main problem is that in javascript data declaration like your first example, the value of this is not set to the object being defined. So since this is not your object, this.a inside the object declaration does not refer to the a property of your object.
It is whatever it was in the context right before your data declaration. If that was the global context, then this would be the window object and this.a probably doesn't exist. If it doesn't exist (e.g. it's undefined), then when you try to reference this.a.length, you are trying to read the property .length off something isn't an object and that is a javscript error.
As for solving this problem it is generally a bad idea to copy the length of an array to another property. That just gives you a chance for it to be wrong and out-of-sync with the actual length of the array. If you want the length of the array, you should just retrieve it upon demand with:
object.a.length
If you really want it to be a property (that has a fixed value and doesn't change when a changes), you can set it after you create the object:
var object = {
a:[1,2,3,2],
};
object.b = object.a.length;
alert(object.b);
all properties of an object are instantiated at once, so this refers to the window object when creating the property b. You'd need to defer the interpretation of b's value, one way is to use a function instead:
var object = {
a:[1,2,3,2],
b: function () {
return this.a.length;
}
}
Another way is to add the property b after the object literal has been declared:
var object = {
a:[1,2,3,2]
}
object.b = object.a.length;
Finally, on newer browsers you can take advantage of a getter:
var object = {
a:[1,2,3,2],
get b() {
return this.a.length;
}
}
In the first example 'b' is undefined, because it is looking for a variable named 'b' not the property 'b' inside of the object 'object'. You should use object.b instead.
Add b to the object after creating it:
var object = {
a:[1,2,3,2]
}
object.b = object.a.length
I have figure out this code
function getAllProperties(obj){
var result={
properties:[],
methods:[]
};
var proto = obj;
while(proto !== null){
var props = Object.getOwnPropertyNames(proto);
props.forEach(function(v){
typeof proto[v] === "function" ? result.methods.push(v) : result.properties.push(v);
});
proto = Object.getPrototypeOf(proto);
}
return result;
}
And the parameter I passed in is canvas context object(obtain by canvas.getContext('2d')).The code words fine with Chrome . But it comes out that firefox get the 'Illegal operation on WrappedNative prototype object' Error . Can anyone tell me what's wrong with it?
When you write proto[v] you might actually invoke property accessor functions (for example if the property has been defined with a get/set as per HTML5) without an actual instance context. This causes the error.
Try getting Object.getOwnPropertyDescriptor to access the property without actually invoking it. The result might have a value property or a get/set property that are actually invoked when you access the field.