Related
I have this angularjs array: $scope.fav = [] where items (objects) get added with to it on a function call. an example of these objects are {quote: "Some text", controller: some_controller} When I add a new object to the array, the array is saved in localstorage. The array works exactly how I want it to except when I try to print it in console.log() i get many [object, Object], which I just assumed is the way it is printed. This isn't the main issue though because the array works how it needs to.
The issue I am having is with trying to find if an object is already in an array. I have tried
if ($scope.fav.indexOf({quote: q, controller: c}) == -1)
and this did not seem to work because every object going in was index -1 even if it was already in the array. I presume this is because it is not reading the object correctly.
Lastly I have resorted to this function:
$scope.containsObject = function(obj, list) {
var i;
for (i = 0; i < list.length; i++) {
if (list[i] === obj) {
return true;
}
}
return false;
}
which checks if the object is in the array. Here is how I call it:
$scope.addToFav = function(q, c) {
$scope.value = $scope.containsObject({quote: q, controller: c}, $scope.fav)
console.log($scope.value);
}
I keep getting a negative value for $scope.value even if the object is in the array.
Sorry for the long complicating explanation.
Thank you for your insight,
Ben
Array.indexOf() and the === operator compare object references and are only true when comparing references to the same instance of an object. {quote: q, controller: c} is an entirely different object instance than those in the array, even if its properties match an object in the array exactly.
Angular has a helper function called angular.equals() that checks of 2 objects are equivalent. You can use it in place of the ===...
$scope.containsObject = function(obj, list) {
var i;
for (i = 0; i < list.length; i++) {
if (angular.equals(list[i], obj)) {
return true;
}
}
return false;
};
Each time you're retrieving an object from local storage, you're actually creating a new object, probably using JSON.decode, to convert the string data stored in local storage, into an object.
Even if the new object contains the same data, it will fail the strict test === (and indeed, the loose ==) when compared to the existing (albeit apparently identical) object. indexOf uses the strict equality operator === so this would behave the same way.
So you need some code to test if an object is equal to another, and then apply it to a list. One way is to use a combination of angular.equals, which performs a deep comparison of objects, and filter:
$scope.containsObject = function(obj, list) {
return list.filter(function(listItem) {
return angular.equals(listItem, obj)
}).length > 0;
}
The filter function I don't believe is part of IE8. If you need IE8 supported, you can use the polyfill, or use another library, like lo-dash
$scope.containsObject = function(obj, list) {
return _.filter(list, function(listItem) {
return angular.equals(listItem, obj)
}).length > 0;
}
What's the fastest way to count the number of keys/properties of an object? Is it possible to do this without iterating over the object? I.e., without doing:
var count = 0;
for (k in myobj) if (myobj.hasOwnProperty(k)) ++count;
(Firefox did provide a magic __count__ property, but this was removed somewhere around version 4.)
To do this in any ES5-compatible environment, such as Node.js, Chrome, Internet Explorer 9+, Firefox 4+, or Safari 5+:
Object.keys(obj).length
Browser compatibility
Object.keys documentation (includes a method you can add to non-ES5 browsers)
You could use this code:
if (!Object.keys) {
Object.keys = function (obj) {
var keys = [],
k;
for (k in obj) {
if (Object.prototype.hasOwnProperty.call(obj, k)) {
keys.push(k);
}
}
return keys;
};
}
Then you can use this in older browsers as well:
var len = Object.keys(obj).length;
If you are using Underscore.js you can use _.size (thanks douwe):
_.size(obj)
Alternatively you can also use _.keys which might be clearer for some:
_.keys(obj).length
I highly recommend Underscore.js. It's a tight library for doing lots of basic things. Whenever possible, they match ECMAScript 5 and defer to the native implementation.
Otherwise I support Avi Flax' answer. I edited it to add a link to the MDC documentation which includes the keys() method you can add to non-ECMAScript 5 browsers.
The standard Object implementation (ES5.1 Object Internal Properties and Methods) does not require an Object to track its number of keys/properties, so there should be no standard way to determine the size of an Object without explicitly or implicitly iterating over its keys.
So here are the most commonly used alternatives:
1. ECMAScript's Object.keys()
Object.keys(obj).length; Works by internally iterating over the keys to compute a temporary array and returns its length.
Pros - Readable and clean syntax. No library or custom code required except a shim if native support is unavailable
Cons - Memory overhead due to the creation of the array.
2. Library-based solutions
Many library-based examples elsewhere in this topic are useful idioms in the context of their library. From a performance viewpoint, however, there is nothing to gain compared to a perfect no-library code since all those library methods actually encapsulate either a for-loop or ES5 Object.keys (native or shimmed).
3. Optimizing a for-loop
The slowest part of such a for-loop is generally the .hasOwnProperty() call, because of the function call overhead. So when I just want the number of entries of a JSON object, I just skip the .hasOwnProperty() call if I know that no code did nor will extend Object.prototype.
Otherwise, your code could be very slightly optimized by making k local (var k) and by using prefix-increment operator (++count) instead of postfix.
var count = 0;
for (var k in myobj) if (myobj.hasOwnProperty(k)) ++count;
Another idea relies on caching the hasOwnProperty method:
var hasOwn = Object.prototype.hasOwnProperty;
var count = 0;
for (var k in myobj) if (hasOwn.call(myobj, k)) ++count;
Whether this is faster or not on a given environment is a question of benchmarking. Very limited performance gain can be expected anyway.
Here are some performance tests for three methods;
https://jsperf.com/get-the-number-of-keys-in-an-object
Object.keys().length
20,735 operations per second
It is very simple and compatible and runs fast but expensive, because it creates a new array of keys, which then gets thrown away.
return Object.keys(objectToRead).length;
Loop through the keys
15,734 operations per second
let size=0;
for(let k in objectToRead) {
size++
}
return size;
It is slightly slower, but nowhere near the memory usage, so it is probably better if you're interested in optimising for mobile or other small machines.
Using Map instead of Object
953,839,338 operations per second
return mapToRead.size;
Basically, Map tracks its own size, so we're just returning a number field. It is far, far faster than any other method. If you have control of the object, convert them to maps instead.
If you are actually running into a performance problem I would suggest wrapping the calls that add/remove properties to/from the object with a function that also increments/decrements an appropriately named (size?) property.
You only need to calculate the initial number of properties once and move on from there. If there isn't an actual performance problem, don't bother. Just wrap that bit of code in a function getNumberOfProperties(object) and be done with it.
As answered in a previous answer: Object.keys(obj).length
But: as we have now a real Map class in ES6, I would suggest to use it instead of using the properties of an object.
const map = new Map();
map.set("key", "value");
map.size; // THE fastest way
this works for both, Arrays and Objects
//count objects/arrays
function count(obj){
return Object.keys(obj).length
}
count objects/arrays with a Loop
function count(obj){
var x=0;
for(k in obj){
x++;
}
return x;
}
count objects/arrays or also the length of a String
function count(obj){
if (typeof (obj) === 'string' || obj instanceof String)
{
return obj.toString().length;
}
return Object.keys(obj).length
}
As stated by Avi Flax,
Object.keys(obj).length
will do the trick for all enumerable properties on your object, but to also include the non-enumerable properties, you can instead use the Object.getOwnPropertyNames. Here's the difference:
var myObject = new Object();
Object.defineProperty(myObject, "nonEnumerableProp", {
enumerable: false
});
Object.defineProperty(myObject, "enumerableProp", {
enumerable: true
});
console.log(Object.getOwnPropertyNames(myObject).length); //outputs 2
console.log(Object.keys(myObject).length); //outputs 1
console.log(myObject.hasOwnProperty("nonEnumerableProp")); //outputs true
console.log(myObject.hasOwnProperty("enumerableProp")); //outputs true
console.log("nonEnumerableProp" in myObject); //outputs true
console.log("enumerableProp" in myObject); //outputs true
As stated here, this has the same browser support as Object.keys.
However, in most cases, you might not want to include the nonenumerables in these type of operations, but it's always good to know the difference ;)
To iterate on Avi Flax' answer, Object.keys(obj).length is correct for an object that doesn’t have functions tied to it.
Example:
obj = {"lol": "what", owo: "pfft"};
Object.keys(obj).length; // should be 2
versus
arr = [];
obj = {"lol": "what", owo: "pfft"};
obj.omg = function(){
_.each(obj, function(a){
arr.push(a);
});
};
Object.keys(obj).length; // should be 3 because it looks like this
/* obj === {"lol": "what", owo: "pfft", omg: function(){_.each(obj, function(a){arr.push(a);});}} */
Steps to avoid this:
do not put functions in an object that you want to count the number of keys in
use a separate object or make a new object specifically for functions (if you want to count how many functions there are in the file using Object.keys(obj).length)
Also, yes, I used the _ or Underscore.js module from Node.js in my example.
Documentation can be found here as well as its source on GitHub and various other information.
And finally a lodash implementation https://lodash.com/docs#size
_.size(obj)
I'm not aware of any way to do this. However, to keep the iterations to a minimum, you could try checking for the existence of __count__ and if it doesn't exist (i.e., not Firefox) then you could iterate over the object and define it for later use, e.g.:
if (myobj.__count__ === undefined) {
myobj.__count__ = ...
}
This way, any browser supporting __count__ would use that, and iterations would only be carried out for those which don't. If the count changes and you can't do this, you could always make it a function:
if (myobj.__count__ === undefined) {
myobj.__count__ = function() { return ... }
myobj.__count__.toString = function() { return this(); }
}
This way, any time you reference myobj.__count__ the function will fire and recalculate.
From Object.defineProperty():
Object.defineProperty(obj, prop, descriptor)
You can either add it to all your objects:
Object.defineProperty(Object.prototype, "length", {
enumerable: false,
get: function() {
return Object.keys(this).length;
}
});
Or a single object:
var myObj = {};
Object.defineProperty(myObj, "length", {
enumerable: false,
get: function() {
return Object.keys(this).length;
}
});
Example:
var myObj = {};
myObj.name = "John Doe";
myObj.email = "leaked#example.com";
myObj.length; // Output: 2
Added that way, it won't be displayed in for..in loops:
for(var i in myObj) {
console.log(i + ": " + myObj[i]);
}
Output:
name: John Doe
email: leaked#example.com
Note: it does not work in browsers before Internet Explorer 9.
For those who have Underscore.js included in their project you can do:
_({a:'', b:''}).size() // => 2
or functional style:
_.size({a:'', b:''}) // => 2
How I've solved this problem is to build my own implementation of a basic list which keeps a record of how many items are stored in the object. It’s very simple. Something like this:
function BasicList()
{
var items = {};
this.count = 0;
this.add = function(index, item)
{
items[index] = item;
this.count++;
}
this.remove = function (index)
{
delete items[index];
this.count--;
}
this.get = function(index)
{
if (undefined === index)
return items;
else
return items[index];
}
}
For those that have Ext JS 4 in their project, you can do:
Ext.Object.getSize(myobj);
The advantage of this is that it'll work on all Ext JS compatible browsers (Internet Explorer 6 - Internet Explorer 8 included). However, I believe the running time is no better than O(n) though, as with other suggested solutions.
You can use:
Object.keys(objectName).length;
and
Object.values(objectName).length;
The OP didn't specify if the object is a nodeList. If it is, then you can just use the length method on it directly. Example:
buttons = document.querySelectorAll('[id=button)) {
console.log('Found ' + buttons.length + ' on the screen');
If jQuery in previous answers does not work, then try
$(Object.Item).length
I try to make it available to all objects like this:
Object.defineProperty(Object.prototype,
"length",
{
get() {
if (!Object.keys) {
Object.keys = function (obj) {
var keys = [],k;
for (k in obj) {
if (Object.prototype.hasOwnProperty.call(obj, k)) {
keys.push(k);
}
}
return keys;
};
}
return Object.keys(this).length;
},});
console.log({"Name":"Joe", "Age":26}.length) // Returns 2
This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
Easiest way to find duplicate values in a JavaScript array
I am looking to find if two values are the same in an Array. I have written the following code:
function validatePassTimeFields(passtimes) {
var success = true;
var length = passtimes.length;
var hashMap = new Object();
for (var j=0; j<length; j++) {
if(hashMap[passtimes[j].value]==1) {
success = false;
alert("Duplicate Found");
break;
}
hashMap[passtimes[j].value]=1;
}
return success;
}
I am new to Javascript, so I tried using HashMap like to find if there is any duplicate. IS it the best way of finding a duplicate in JavaScript? or I can optimize it?
Your function is already very good, apart from the issue that it only works for arrays with strings or numbers. For a more difficile approach to care also about objects see this answer. I don't think that matters for you as you have an explicit and restricted use case (checking identity by the value property).
However, some points I'd do different:
Don't use the success variable and break from the loop, but just return from the whole function.
Instead of the constructor new Object usually the shortcut object literal {} is used
Instead of setting the values in the hashMap to 1 one might use true; you also could omit the equality operator == and just check for the truthiness of the property. I even would use the in operator.
function validatePassTimeFields(passtimes) {
var length = passtimes.length;
var hashMap = {};
for (var j=0; j<length; j++) {
if (passtimes[j].value in hashMap) {
alert("Duplicate Found");
return false;
}
hashMap[passtimes[j].value] = 1;
}
return true;
}
// You would only need to optimize it if you want to use it elsewhere-
function noduplicates(array){
var next, O= {},
L= array.length;
while(L){
next= array[--L];
if(O[next]) return false;
O[next]= 1;
}
return true;
}
function validatePassTimeFields(passtimes){
if (noduplicates(passtimes)) return true;
alert("Duplicate Found");
return false;
}
It might be worth checking out underscore's implementation of this functionality. If you are just looking to eliminate dupes, you can use _.uniq(), but if you are more interested in just knowing that there are dupes or the pure implementation details, you might enjoy checking out the source of this method, which is very nicely documented.
I know this isn't a direct code answer to the question - there are a few here already so it wouldn't be useful to repeat. But I thought it was worth mentioning as underscore is a great utility library and the source is a great place to learn more about well-written javascript.
It seems that you do not want to find the duplicates, only to see if there are any?
You're pretty close, here's a working function;
var hasDuplicates = function (arr) {
var _store = {};
for (var i = 0; i < arr.length; i++) {
if (typeof _store["_" + arr[i]] !== "undefined") {
return true;
}
_store["_" + arr[i]] = true;
}
return false;
};
The underscores in the associative array are necessary for storing numeric values. The hasDuplicates() function only works objects which have a toString() method.
To check for duplicates;
var yourArray = [1, 5, 7, 3, 5, 6];
if (hasDuplicates(yourArray)) {...
Does JavaScript have a convenient way to test if a variable matches one of many values?
This is my code,
function Start()
{
if(number==(0||3||6||8||9||11||13||14||15||18||19||22||23||25||27||28||31||34||43||46||47||49||54||58||59||62||63||68||71||74||75))
{
FirstFunction();
}
if(number==(1||4||5||7||12||16||17||20||21||26||29||32||33||42||45||48||50||51||53||55||56||57||60||61||64||65||67||69||70||73||76))
{
SecondFunction();
}
}
as you can see, I tried to use the "or" operator to check if number equals ANY of the listed. this, unfortunately, did not work. I know I can just code:
if(number==0||number==3||number==6....)
I think there should be an alternative to that, is there?
Thank you in advance.
You should insert all your elements in an array and use arr.indexOf(element)
It will return -1 if the element doesn't exist which you can use for your if logic
This is better than having lot of if statements
var x = new Array(1,7,15,18);
if ( x.indexOf(31) != -1 )
{
// Add your logic here
}
You can write something like this, which looks a bit nicer:
This Array prototype function will allow you check if an element exists in a JS array:
Array.prototype.exists = function (x) {
for (var i = 0; i < this.length; i++) {
if (this[i] == x) return true;
}
return false;
}
Then:
function Start()
{
var values1 =[0,3,6,8,9,11,13,14,15,18,19,22,23,25,27,28,31,34,43,46,47,49,54,58,59,62,63,68,71,74,75];
var values2 = [1,4,5,7,12,16,17,20,21,26,29,32,33,42,45,48,50,51,53,55,56,57,60,61,64,65,67,69,70,73,76];
if( values1.exists(number) )
{
FirstFunction();
} else if ( values2.exists(number) )
{
SecondFunction();
}
}
The array techniques already mentioned are good, e.g., [0, 3, 6, 8].indexOf(number) != -1, but note that not all browsers support .indexOf() on arrays (think older IE). If you have a look at the MDN page on .indexOf() you'll see they've provided an implementation of .indexOf() that you can add to the Array.prototype if it doesn't already exist.
But here's a non-array method that will work in older browsers at least as far back as IE6 without needing to add your own functions or modify the prototype of any built-in objects:
if (/^(0|3|6|8|9|11)$/.test(number)) {
// matched, so do something
}
The regex .text() method is expecting a string, but if you give it a number it'll cope.
I'd probably still recommend the array method, but it can't hurt to have another option.
This is so simple I am baffled. I have the following:
var x = 'shrimp';
var stypes = new Array('shrimp', 'crabs', 'oysters', 'fin_fish', 'crawfish', 'alligator');
for (t in stypes) {
if (stypes[t] != x) {
alert(stypes[t]);
}
}
Once the values have iterated it starts returning a dozen functions like
function (iterator, context) {
var index = 0;
iterator = iterator.bind(context);
try {
this._each(function (value) {iterator(value, index++);});
} catch (e) {
if (e != $break) {
throw e;
}
}
return this;
}
What the heck is going on?
Edit: In these scripts I am using http://script.aculo.us/prototype.js and http://script.aculo.us/scriptaculous.js I remember now reading about the way prototype extends arrays and I am betting this is part of it. How do I deal with it?
The for enumeration is going to go over every member of the object you passed it. In this case an array, which happens to have functions as members as well as the elements passed.
You could re-write your for loop to check if typeof stypes[t] == "function" or yada yada. But IMO you are better off just modifying your looping to only elements..
for(var i = 0, t; t = stypes[i]; ++i){
if (t != x) {
alert(t);
}
}
Or
for(var i = 0; i < stypes.length; ++i){
if (stypes[i] != x) {
alert(stypes[i]);
}
}
I wanted to migrate my last comment up to the answer to add the notice of the a caveat for the first type of loop.
from Simon Willison's "A re-introduction to JavaScript"..
for (var i = 0, item; item = a[i]; i++) {
// Do something with item
}
Here we are setting up two variables.
The assignment in the middle part of
the for loop is also tested for
truthfulness - if it succeeds, the
loop continues. Since i is incremented
each time, items from the array will
be assigned to item in sequential
order. The loop stops when a "falsy"
item is found (such as undefined).
Note that this trick should only be
used for arrays which you know do not
contain "falsy" values (arrays of
objects or DOM nodes for example). If
you are iterating over numeric data
that might include a 0 or string data
that might include the empty string
you should use the i, j idiom instead.
you want to do:
for (var i in object) {
if (!object.hasOwnProperty(i))
continue;
... do stuff ...
}
As for..in enumeration iterates over all properties (enumerable or otherwise) that exist on both the object and its prototype chain. The hasOwnProperty check restricts iteration to just those properties on the actual object you want to enumerate.
ES5 makes things a little better for library developers (and help avoid this stuff) but we won't see that ina shipping browser for quite a while :-(
[edit: replacing return with continue. lalalalala ;) ]
Since prototype has extended the array for your convenience you should take advantage of it. Your example could be rewritten as:
var x = 'shrimp';
var stypes = new Array('shrimp', 'crabs', 'oysters', 'fin_fish', 'crawfish', 'alligator');
stypes.without(x).each(alert);
It should be
for (t in stypes) {
if (t != x) {
alert(t);
}
}