i want to check if the url contains ?query_param if so then get its value and compare that value to an id.
consider the url /path/20?query_parm=2234
and i have to get the param_id and compare it with the item id.
so i do something like below,
handle_location = (path) => {
let opened_item, param_id;
param_id = new
URLSearchParams(this.props.location.search).get('query_param');
if (this.state.items) {
opened_item = this.state.items.find(item => item.id ===
param_id);
}
};
the data structure for items is below,
items = [{
id: 2244;
attributes: something;
}
{
id: 33;
attributes: nothing;
}]
But this gives the opened_item value undefined since item.id is never equal to param_id... because of type being different.
How can i fix this...or is there a better way to find the query_param from url and get its value and use it accordingly to find the item that matches with the query_param value.
Given you understand that both data types are different, you could use avoid using strict equality and leverage type coercion which would work
item.id == param_id
The most efficient way though would be to convert param_id to the appropriate type before comparing e.g.
param_id = parseInt(param_id, 10);
It means one conversion and you can keep the strict equality
You will need to either cast both of the values to the same type(either Number or String) and then perform the comparison or you could use == operator which will try to coerce the types automatically(not recommended). You can also always fall back to some default value if none of the items matched the id.
if (this.state.items) {
opened_item = this.state.items.find(item => item.id ===
param_id) || 'some default value'
}
try this:
const param_id = this.props.match.params.id
Related
Getting the following error:
expression of type
?Product/798
cannot produce expected type
{id : Nat; name : Text; price : Nat; sku : Text}
when trying to loop over a list of ids, get the corresponding HashMap value, and add to a new array only if the get() function returns a Product.
for (id in productIds.vals()) {
var product: ?Product = products.products.get(id);
if (product != null) {
products_list := Array.append<Product>(products_list, [product]);
};
};
Am I maybe misunderstanding the best way to approach this? It seems like I shouldn't get any errors because if it's not a Product type (which is the "expected type" it references) it should just continue on, right?
The variable product is of type ?Product, but your instantiation of the Array.append function expects an array of values of plain type Product.
The comparison with null does not magically change the type of the variable. You'll need to pattern-match it with a switch to extract the actual value:
switch product {
case (?p) { products_list := Array.append<Product>(products_list, [p]) };
case null { ...do something else... };
}
I have this problem which may sounds stupid but I don't really understand the whys.
I declare it as a variable: let [ randomQuoterState, setrandomQuoterState ] = useState([]); Then pass it into a component inside the return: <UserOutput set={setrandomQuoterState} current={randomQuoterState} number={1}/>
The following code is inside the component:
let toSet = [];
toSet[props.number] = quoteArray[Math.floor(Math.random() * quoteArray.length)];
let quote = props.current;
if (quote[props.number]){
delete quote[props.number];
console.log("deleted")
}else {
console.log("this does not exist");
}
console.log(typeof(toSet[props.number]));
console.log(toSet[props.number].lenght)
console.log(toSet[props.number]);
quote[props.number] = toSet[props.number][Math.floor(Math.random() * toSet[props.number].lenght)];
props.set(quote);
The Consol displays it as an array, but the typeof function says its an object, and it doesn't have a length property.
I would appreciate any help or explanation, I thought about it a lot, but I couldn't come up with anything.
Arrays are objects in Javascript. In fact, there is no array type.
To see if it is an array, you should try console.log((toSet[props.number]).constructor.name) and do your checks against toSet[props.number] instanceof Array.
Do not use (toSet[props.number]).constructor.name == 'Array' in your comparisons, because you could have something that has inherited from Array but whose constructor name is different.
In JavaScript both object and array are of type Object.
In case you want to determine exact type, you can use constructor property.
const data = {};
data.contructor.name === 'Object'; // Returns True
const data = [];
data.contructor.name === 'Object'; // Returns True
data.contructor.name === 'Object'; // Returns False
Above can used to determine String, Date etc as well.
Alternatively you can use libraries like lodash which has function for these things.
However that is overkill I guess.
Hope it helps.
I am getting started with fp-ts and was wondering what is the advantage of using Option type over typescript's default notion of optional values represented by question mark?
Typescript tells you whether or not you have the value or not with the question mark. However, often you'll want to perform some sort of computation on them and this is when the Option type from fp-ts shines.
For example, let's say we have two items in a shop and they optionally have prices and we want to write a function to get the price of both of them otherwise we return some value that represents "not for sale". First we'll see how we would do this in vanilla typescript
type ShopItem = {
price?:number
}
const getPrice = (item1: ShopItem, item2: ShopItem):number | null => {
const price1 = item1.price;
const price2 = item2.price;
if (price1 && price2) {
return price1 + price2;
}
return null;
}
This has a few problems. First, there's a bug in there because if the price was 0, then the item should be for sale but instead our falsey check would short circuit out and return null. Secondly, it doesn't scale very well. If we wanted to add multiple ShopItems or even other types of items with optional values, we'll need to keep checking whether or not those values were null.
Now let's compare this to the fp-ts example
https://codesandbox.io/s/laughing-wu-pffe3
import { some, none, ap, Option } from "fp-ts/lib/Option";
import { pipe } from 'fp-ts/lib/pipeable'
type ShopItem = {
price:Option<number> //this type will either be a Some<number> or None
}
const getPrice = (item1: ShopItem, item2: ShopItem): Option<number> =>
pipe(
some((a:number) => (b:number) => a + b),
ap(item1.price),
ap(item2.price)
);
The way this works is that we get the item1 price and the item2 price and we feed it into the addition function inside the some. Notice how there aren't any null checks as this has been abstracted away into our None type.
The problem with the ECMA standard for sort of Object.keys() is known:
Object.keys() handle all keys with integer (example: 168), including integer as strings (example: "168"), as a integer. The result is, both are the same (168 === "168"), and overwrite itself.
var object = {};
object["168"] = 'x';
object[168] = 'y';
Object.keys(object); // Array [ "168" ]
object[Object.keys(object)]; // "y"
Interestingly, all keys (including pure integer keys) are returned as a string.
The ecma262 wrote about this: All keys will be handle as a integer, expect the key is a String but is not an array index.
https://tc39.es/ecma262/#sec-ordinaryownpropertykeys
That should tell us: 168 === "168". A toString() do not solve the problem.
var object = {};
object[[3].toString()] = 'z';
object[[1].toString()] = 'x';
object[[2].toString()] = 'y';
Object.keys(object);
// Array(3) [ "1", "2", "3" ]
Paradoxically, in this case, only integer apply as "enumerable" (it's ignoring array.sort(), that sort also strings with letters.).
My question about this is simple: How can i prevent the sort function in Object.keys()? I have testet the Object.defineProperties(object, 1, {value: "a", enumerable: true/false}), but that mean not realy enumerable in the case of integer or string or integer-like string. It means only should it be counted with or not. It means "counted" like omit (if it false), not "enumerabled" like ascending or descending.
A answere like that is not a good answer: Please use only letters [a-zA-Z] or leastwise a letter at the first position of keyword.
What I want: That the keys are not sorted, but output in the order in which they were entered, whether integer, string or symbol.
Disclaimer: Please solutions only in JavaScript.
Javascript Objects are unordered by their nature. If you need an ordered object-like variable I would suggest using a map.
To achieve what you're looking for with a map instead of object you'd do something like the below:
var map1 = new Map();
map1.set("123", "c");
map1.set(123, "b");
var iterator1 = map1.keys();
var myarray = [];
for (var i = 0; i < map1.size; i++) {
myarray.push(iterator1.next().value);
}
console.log(myarray);
// Array ["123", 123]
Unfortunately it's not compatible with IE and I'm not sure how else you could achieve what you need without it. A quick Google did return something about jQuery maps, though.
If you don't want to use jQuery and still need to support IE some points are below:
Is there anything stopping you using an array rather than JS object to store the data you need? This will retain the order per your requirements unlike objects. You could have an object entry in each iteration which represents the key then use a traditional foreach to obtain them as an array. I.e.
The array:
var test_array = [
{key: 123, value: 'a value here'},
{key: "123", value: 'another value here'}
];
// console.log(test_array);
Getting the keys:
var test_array_keys = [];
test_array.forEach(function(obj) { test_array_keys.push(obj['key']); } );
// console.log(test_array_keys);
Then if you needed to check whether the key exists before adding a new entry (to prevent duplicates) you could do:
function key_exists(key, array)
{
return array.indexOf(key) !== -1;
}
if(key_exists('12345', test_array_keys))
{
// won't get here, this is just for example
console.log('Key 12345 exists in array');
}
else if(key_exists('123', test_array_keys))
{
console.log('Key 123 exists in array');
}
Would that work? If not then the only other suggestion would be keeping a separate array alongside the object which tracks the keys and is updated when an entry is added or removed to/from the object.
Object Keys sorted and store in array
First Creating student Object. then sort by key in object,last keys to store in array
const student={tamil:100, english:55, sci:85,soc:57}
const sortobj =Object.fromEntries(Object.entries(student).sort())
console.log(Object.keys(sortobj))
use map instead of an object.
let map = new Map()
map.set("a", 5)
map.set("d", 6)
map.set("b", 12)
to sort the keys (for example, to update a chart data)
let newMap = new Map([...map.entries()].sort())
let keys = Array.from(newMap.keys()) // ['a','b','d']
let values = Array.from(newMap.values()) // [5,12,6]
I have Array of Object and each object have different properties inside it. What I am trying to do is filter the object in that array by its different properties but my problem is the name of the properties and number of properties are changing. How can I filter it by not declaring hard code values on it.
I have used the following code before but the number of filtering is static
events={MainObject.filter(
itemX =>
FilteringParameter["DropdownFilter2"].find(
parameter => parameter === itemX["DropdownFilter2"]
) &&
(FilteringParameter["DropdownFilter1"].find(
parameter => parameter === itemX["DropdownFilter1"]
) ||
!FilteringParameter["DropdownFilter1"].length)
)}
On my code above the "DropdownFilter1" and "DropdownFilter2" is based on a multi select dropdown and has a value based on the distinct values from my Objects
Wow I figure it out how to make it dynamic filter. I am not sure if this is the best answer but I made a loop that will filter my data each loop
let z = RawData
filterObject.map(e => {
z = z.filter(d => {
return d[e.Title] === e.Value
})
})
My filterObject holds all my dropdown value which has two properties. Title is the property name while Value holds the value of the dropdown.