"object[value] = true" meaning - javascript

i know this is kind of weird question but, i was creating a guard to prevent duplicate values in array i write some part and got a little help from stackoverflow but i can't understand code meaning properly
so i created Object with null prototype and iterated for loop over it to detect duplicate values (i know Set constructor is much easier but i am doing it in my server-side code and since older browsers does not support Set it would be dangerous to use Set). here is my code
var duplicateTagsGuard = Object.create(null);
for(var co = 0; co < tags.length; co++){
let val = tags[co];
if(val in duplicateTagsGuard){
return res.status(409).send({
message: ''
})
}
duplicateTagsGuard[val] = true
}
and the part i cant understand is duplicateTagsGuard[val] = true
so if we split my code step by step and explain it would be like
1.first create null Object
2.iterate for loop on it and declare variable val and make it equal to every element in tags array
3.then check if that val is in duplicateTagsGuard object and if it is use return statement to prevent continuing for loop and if it is not then we are adding val's value to object but i don't know how it is implemented with that part of code (duplicateTagsGuard[val] = true) if anyone can explain i will be glad

first create null Object
It is not creating a null object but it is creating an object with null as the prototype check the Object.create docs:
var duplicateTagsGuard = Object.create(null);
console.log(`duplicateTagsGuard is an empty object:`);
console.log(duplicateTagsGuard);
console.log(`Prototye of duplicateTagsGuard is null: `);
console.log(Object.getPrototypeOf(duplicateTagsGuard));
iterate for loop on it and declare variable val and make it equal to every element in tags array
This part is correct every time the loop runs a new variable is created with for block scope and is assigned the value of the current coth index value of the tags array.
then check if that val is in duplicateTagsGuard object and if it is use return statement to prevent continuing for loop and if it is not then we are adding val's value to object but i don't know how it is implemented with that part of code (duplicateTagsGuard[val] = true)
It is checking whether val is a property of the duplicateTagsGuard object, if it is already present then the return is used to return the response else it is adding that property to the duplicateTagsGuard object with the bracket notation [propertyName] and assigning it's value as true.
var duplicateTagsGuard = Object.create(null); //creating a new empty object with prototype as null
let val = "hello"; //creating a new variable
duplicateTagsGuard[val] = true; //adding the property with the value of the variable val
console.log(val in duplicateTagsGuard); //checking if the added property is present in the object

The code is creating a dictionary of val. Basically, when you iterate through the tags array, it checks whether the item in the array (accessed by tags[co]) is already present in the dictionary duplicateTagsGuard. If it has been encountered before, it will perform a certain action.
At the end of the loop, it simply injects the item into the dictionary. The dictionary therefore keep track of whether an item has been encountered before in the for loop.
The injection is done by using the item as the key in the dictionary, since it is easier to look it up (you simply have to do item in dictionary, which is basically val in duplicateTagsGuard in the actual implementation of the code). It does not matter what value you use, so a true value is used as a placeholder.

Related

Weird Array Objects - JavaScript

Arrays are quite something in JavaScript when compared with other programming languages and it's not without its full set of quirks.
Including this one:
// Making a normal array.
var normalArray = [];
normalArray.length = 0;
normalArray.push(1);
normalArray[1] = 2;
normalArray; // returns [1, 2]
normalArray.length // returns 2
So yes, the above is how we all know to make arrays and fill them with elements, right? (ignore the normalArray.length = 0 part for now)
But why is it that when the same sequence is applied on an object that's not purely an array, it looks a bit different and its length property is off by a bit?
// Making an object that inherits from the array prototype (i.e.: custom array)
var customArray = new (function MyArray() {
this.__proto__ = Object.create(Array.prototype);
return this
});
customArray.length = 0;
customArray.push(1);
customArray[1] = 2;
customArray; // returns [1, 1: 2]
customArray.length // returns 1
Not entirely sure what's going on here but some explanation will be much appreciated.
This may not be the perfect answer, but according to my understanding of Javascript arrays, they are a little bit different than usual objects. (Mainly due to the fact that it maintains a length property, and Objects don't).
So if we take your code for an example:
var normalArray = [];
This is the right way to create an array in Javascript. But what about the below one?
var customArray = new (function MyArray() {
this.__proto__ = Object.create(Array.prototype);
return this
});
Are they same? Let's see..
Array.isArray(normalArray); // true -> [object Array]
Array.isArray(customArray); // false -> [object Object]
So it is clear that although you inherit from the array prototype, it doesn't really create an object with Array type. It just creates a plain JS object, but with the inherited array functions. That's the reason why it updates the length when you set the value with customArray.push(1);.
But since your customArray is only a regular object and for a regular JS object, [] notation is used to set a property, it doesn't update the length (because Objects don't have a length property)
Hope it's clear :)
The array you are trying to create is not a pure array (as you are perhaps aware). Its basically a JavaScript object and is supposed to behave like an object.
While treating an object like an array, its up to you to maintain all it's array like features.
You specifically have to assign a length property to it and you did it correctly.
Next, the push method from Array.prototype is supposed to insert an element to the array and increment the length property (if any), so it did increment 0 to 1. There you go, the length now is 1.
Next you used the literal notation of property assignment to Object, which is similar to something like customArray['someProperty'] = 1.
While using literal notation, no method from Array.Prototype is being invoked and hence the customArray object never knows that it has to behave like an Array and its length property remains unaffected. It simply behaves like an object and you get what you got.
Remember the length is just a property on Array class and this property is appropriately incremented and decremented by every method on Array.
Note: Array like objects are not recommended and its up to you entirely to maintain the index and other Array stuff for such objects.
From what I can see, you have a problem with your function:
return this
This should be
return (this);
Just fixes any potential errors you might have. Another thing is you're not using the var keyword to declare customArray. These errors might be breaking your code.

Pro AngularJS - Could you help explain part of this code?

I am reading a book called Pro AngularJS by Apress and I am just trying to ensure I understand all of the code and I am a bit baffled by the following code.
Below is a custom filter in the book, which accepts 2 arguments, the data array and a property name. In the book, the property name is the category key in the data, and is set up to remove duplicate categories in order to display a list of navigation links to each category without duplication.
angular.module("customFilters", [])
.filter("unique", function () {
return function (data, propertyName) {
if (angular.isArray(data) && angular.isString(propertyName)) {
var results = [];
var keys = {};
for (var i = 0; i < data.length; i++) {
var val = data[i][propertyName];
if (angular.isUndefined(keys[val])) {
keys[val] = true;
results.push(val);
}
}
return results;
} else {
return data;
}
} });
What I don't understand is the keys part within the for loop. Keys is defined as an object literal?
Then, within the for loop, for each item in the data that us looped over, if the keys[val] is undefined (what does this mean)?
Then keys[val] is set to true (what does this do?).
I sort of understand the rest, if it is undefined, we push the result to the results array to return it.
Thanks for your help :)
Put simply, it's just a way to remember that we already have processed the value val, and do not which to return duplicates, if it comes along again in the loop.
You have to put something in the keys object, like keys[val] = true;, so that keys[val] becomes defined in the next loop iteration.
If you don't put anything into keys[val], angular.isUndefined(keys[val]) in the next loop with same value val will evaluate to true, and then your result would be duplicated (which isn't unique)
Explanation and answer to your questions
if the keys[val] is undefined (what does this mean)?
Basically means the key val doesn't exist in the object keys,
e.g. an object {'age': 45} contains the key age but doesn't contain the key weight
Then keys[val] is set to true (what does this do?)
This sets the key val of the object keys to true, so somewhere keys object looks like this {<val>: true, <other key>: ...,}
So after that step, the key val is defined for the object keys, therefore angular.isUndefined(keys[val]) condition is false
what is the purpose of keys[val] in the first place? Sorry, just not clear on what it is doing.
The code uses an object keys = {} which behaves like a key/value data structure (a dictionary, or a map, in other languages), the goal is to remember that we already have processed val
If you don't remember the values you have already processed (returned), then you will return duplicates, and therefore your unique filter will no longer return unique values, which is the purpose of the code here
Let us see the first line return function(data, propertyName)
here data is the array of objects to be filtered against propertyName(category in this case).
Then we define var keys = {} i.e, an empty object.
Now through for loop we are putting the value of propertyName(category in this case) into variable val.
So for example the first object of data array is like this [{ product: "product 1", category: 'Category 3'}, ....]
Thus the value of val = data[i][propertyName] translates to data[0][category], which evaluates to Category 3.
Now the line angular.isUndefined(keys['Category 3']) would evaluate to true for if condition (here we are asking if the given condition is undefined, which evaluates to true, thus if condition passes).
Within if loop we set the keys[val] = true, so that again this category name is not pushed to the results array.

Array type being picked up as array value

I have some simple Javascript looping through an array of items (Tridion User Groups) to check if the user is a member of a specific group.
I can easily code around the issue shown below ( see && extensionGroup !== 'true') but I want to understand why the isArray = true is counted as a value in the array - any ideas?
The screenshot below demonstrates that the value extensionGroups has been set thus
var extensionGroups = ["NotEvenARealGroup", "Author", "ExampleGroupAfterOneUserIsActuallyIn"];
but returns the isArray value as a 4th value?
updated to show images a little clearer
You're using for in to iterate an array; don't do that. Use for (or forEach):
for(var i = 0; i < extensionGroups.length; i++) {
var extensionGroup = extensionGroups[i];
// ...
}
The reason this fails is because for in is used to iterate over an object's properties in JavaScript. Iterating over an array in this way means you get anything else assigned to it, such as this property or length.
And if you're able to use Array#forEach, it's probably most appropriate here:
extensionGroups.forEach(function(extensionGroup) {
// ...
});
For..in, technically speaking, doesn't iterate through values. It iterates through property names. In an array, the values ARE properties, under the hood. So when you iterate over them with for..in you get funky stuff like that happening.
Which highlights my next point: don't use for..in. Don't use it for arrays -- don't use it for anything, really. Ok -- maybe that's going a bit too far. How about this: if you feel the need to use for..in, think hard to see if it's justifiable before you do it.

remove intermediary object from map object

I have a couple of these and think (know) that I'm doing something wrong (or could be simpler).
html:
<div class='item-to-select' data-global-id='55'>some</div>
var l=$(this).map(function(){
t=new Object();
t.global_id=$(this).data('global-id');
return t;
}).get();
var list=l[0]; // want to remove this
How would I remove this intermediary object? Or a better way
thx
If you mean that you don't want to have to define the l variable just so you can use it once in setting up your list variable you can do this:
var list = $(this).map(function(){
return {
global_id : $(this).data('global-id')
};
}).get()[0]; // note the [0] directly after .get()
The return from any function that returns an array (or array-like object) doesn't have to be assigned to a variable before you can use it. So:
var temp = someFuncReturnsArray();
console.log(temp[0]);
// can be replaced by
console.log(someFuncReturnsArray()[0]);
Of course if you need to do further processing on the returned array you need to put it in a variable. E.g., if you need to test its length, or if the function could possibly return null in some situations, etc. In the example above if an empty array was returned then obviously [0] will be undefined.
But if you only need the return value once you can just use it directly.
Note that I've removed the t variable from your code too. When creating an empty object it is considered good practice to say obj = {} rather than saying obj = new Object(). But you can create an object with properties in one step if the property values are already known. In the case of your function the t object you create isn't manipulated in any way other than adding a single property to it before you return it, so you can simply return an object literal directly instead of doing it in three steps.
The jQuery .get() method accepts an index.
So, you can write :
var list=$(this).map(function(){
t=new Object();
t.global_id=$(this).data('global-id');
return t;
}).get(0);

Arrays in JavaScript

While reading a book about JavaScript I stumbled across an example:
var names = new Array("Paul","Catherine","Steve");
var ages = new Array(31,29,34);
var concatArray;
concatArray = names.concat(ages);
My question is, why doesn't the variable concatArray need to be define as a new Array() in order to store the concatenated data for both arrays name and ages , but when I try to treat the concatArray as an array by adding another line of code "document.write(concatArray[0])", it works just like an array and shows me the data stored in the first element. I just wonder why I'm not declaring the concatArray as a new array, yet it still works as one.
You are declaring concatArray as a new array but the declaration is implicit. The concat function returns a new array which contains concatenated copies of the original two arrays. The type of concatArray is inferred from the return type of the concat function.
Variable don’t have a specific data type in Javascript like in other languages. You can assign a variable every value you want.
That means var concatArray; declares the variable but the value is undefined:
var concatArray;
alert(typeof concatArray === "undefined");
Only when assigning the return value of names.concat(ages) (an array) to concatArray it get’s that type:
var names = new Array("Paul","Catherine","Steve");
var ages = new Array(31,29,34);
var concatArray;
alert(typeof concatArray === "undefined");
concatArray = names.concat(ages);
alert(concatArray.constructor === Array);
Javascript doesn't care what the contents of the var are when it is declared; that is why you can declare var concatArray without needing to specify it as an array. Once you assign it a value and a type (as the result of the concat() function) javascript treats the var as an array.
Simply put, w3schools says it pretty concisely:
The concat() method is used to join two or more arrays.
This method does not change the existing arrays, it only returns a copy of the joined arrays.
w3schools
Looks like Andrew and Matthew beat me to it anyway.
Because Javascript is dynamically typed. A variable doesn't have a specifuc type, and an array is an object that you can assign to any variable.
When you declare a variable without assigning it a value, it just exists with an undefined value:
var answer;
// now the variable exists, but it doesn't have a value
answer = 42;
// now the variable has the numerical value 42
answer = "hello";
// now the numerical value has been replaced with the string value "hello"
answer = [];
// now the variable contains an empty array
answer[0] = 1337;
// now the variable contains an array that contains an item with the value 1337
answer = -1
// now the array is gone and the variable contains the value -1
I would make an answer slightly different of Andrew's one.
JavaScript variables are not strongly typed. You can put a string, then a number, then an object in the same variable. When you use the variable, the interpreter checks its current type is suitable for the usage you try to make. If you write:
var a = 45;
alert(a[0]);
a = [ 5 ];
alert(a[0]);
you will get successively undefined then 5.

Categories