We Keep Coding

TypeError: Cannot convert undefined or null to object, javascript

Exception from Finished function when I run it: TypeError: Undefined or null cannot be converted to object,
It gives this error, I couldn't find why it was caused or on which line, thanks for your help
Exception from Finished function when I run it: TypeError: Undefined or null cannot be converted to object,
It gives this error, I couldn't find why it was caused or on which line, thanks for your help
try {
fetch("https://www.tcmb.gov.tr/kurlar/today.xml")
.then((response) => response.text())
.then((data) => {
const parser = new DOMParser();
const xml = parser.parseFromString(data, "text/xml");
const jsonData = xmlToJson(xml);
const currencyData = jsonData.Tarih_Date.Currency;
currencyData.forEach(async (doviz) => {
await db.collection("currencies").add({
name: doviz.CurrencyName,
});
});
})
} catch (error) {
console.error(error);
}
My method to convert xml to json
function xmlToJson(xml) {
var obj = {};
if (xml.nodeType == 1) {
if (xml.attributes.length > 0) {
obj["#attributes"] = {};
for (var j = 0; j < xml.attributes.length; j++) {
var attribute = xml.attributes.item(j);
obj["#attributes"][attribute.nodeName] = attribute.nodeValue;
}
}
} else if (xml.nodeType == 3) {
obj = xml.nodeValue;
}
var textNodes = [].slice.call(xml.childNodes).filter(function(node) {
return node.nodeType === 3;
});
if (xml.hasChildNodes() && xml.childNodes.length === textNodes.length) {
obj = [].slice.call(xml.childNodes).reduce(function(text, node) {
return text + node.nodeValue;
}, "");
} else if (xml.hasChildNodes()) {
for (var i = 0; i < xml.childNodes.length; i++) {
var item = xml.childNodes.item(i);
var nodeName = item.nodeName;
if (typeof obj[nodeName] == "undefined") {
obj[nodeName] = xmlToJson(item);
} else {
if (typeof obj[nodeName].push == "undefined") {
var old = obj[nodeName];
obj[nodeName] = [];
obj[nodeName].push(old);
}
obj[nodeName].push(xmlToJson(item));
}
}
}
return obj;
}

convert html code to Json array using JavaScript function

I use this function to convert html element to Json file:
function converter(dom) {
if (dom.nodeType === Node.TEXT_NODE) {
return dom.nodeValue;
}
if (dom.nodeType === Node.DOCUMENT_NODE) {
dom = dom.documentElement;
}
const obj = {};
obj.nodeType = dom.nodeType;
if (dom.nodeType === Node.ELEMENT_NODE) {
obj.tagName = dom.tagName;
obj.attributes = []; // Array.from(obj.attributes) gives us a lot of things we don't want
for (let i = 0, len = dom.attributes.length; i < len; ++i) {
const attr = dom.attributes[i];
obj.attributes.push({name: attr.name, value: attr.value});
}
obj.children = [];
for (let child = dom.firstChild; child; child = child.nextSibling) {
obj.children.push(converter(child));
}
} else {
obj.nodeValue = dom.nodeValue;
}
return obj;
}
const jsonn = JSON.stringify(converter(document.getElementById("examplee")), null, 4);
var data = JSON.parse(jsonn);
console.log(data);
<div id='examplee'>text</div>
Now I want to make it accept HTML code in the conveter intstead of DOM
make it work like this:
function converter(dom) {
if (dom.nodeType === Node.TEXT_NODE) {
return dom.nodeValue;
}
if (dom.nodeType === Node.DOCUMENT_NODE) {
dom = dom.documentElement;
}
const obj = {};
obj.nodeType = dom.nodeType;
if (dom.nodeType === Node.ELEMENT_NODE) {
obj.tagName = dom.tagName;
obj.attributes = []; // Array.from(obj.attributes) gives us a lot of things we don't want
for (let i = 0, len = dom.attributes.length; i < len; ++i) {
const attr = dom.attributes[i];
obj.attributes.push({name: attr.name, value: attr.value});
}
obj.children = [];
for (let child = dom.firstChild; child; child = child.nextSibling) {
obj.children.push(converter(child));
}
} else {
obj.nodeValue = dom.nodeValue;
}
return obj;
}
const jsonn = JSON.stringify(converter("<div>12345</div>"), null, 4);
var data = JSON.parse(jsonn);
console.log(data);
But it returns empty tags. I want it to return the json when I put in the converter.
The problem is it accepts only the document.getElementById("examplee") and not accept the code like the snippet above

Not sure if this is what you're after, but in the first example you're using an HTML element as an argument, whereas in the second example you're using a string as an argument. For that, I've added the following to the beginning of your function:
if (typeof dom === 'string') {
let tmp = document.createElement('template');
tmp.innerHTML = dom;
dom = tmp.content.childNodes[0]
}
function converter(dom) {
if (typeof dom === 'string') {
let tmp = document.createElement('template');
tmp.innerHTML = dom;
dom = tmp.content.childNodes[0]
}
if (dom.nodeType === Node.TEXT_NODE) {
return dom.nodeValue;
}
if (dom.nodeType === Node.DOCUMENT_NODE) {
dom = dom.documentElement;
}
const obj = {};
obj.nodeType = dom.nodeType;
if (dom.nodeType === Node.ELEMENT_NODE) {
obj.tagName = dom.tagName;
obj.attributes = []; // Array.from(obj.attributes) gives us a lot of things we don't want
for (let i = 0, len = dom.attributes.length; i < len; ++i) {
const attr = dom.attributes[i];
obj.attributes.push({
name: attr.name,
value: attr.value
});
}
obj.children = [];
for (let child = dom.firstChild; child; child = child.nextSibling) {
obj.children.push(converter(child));
}
} else {
obj.nodeValue = dom.nodeValue;
}
return obj;
}
const jsonn = JSON.stringify(converter("<div>12345</div>"), null, 4);
var data = JSON.parse(jsonn);
console.log(data);

Last Key in JavaScript array appearing as Length?

Bit of a weird one. Am using the following code build an array from a json object to make it easier to reference later in the code. However it would appear that when the last item of each array is created, rather than adding a new item, the Key of the item appears as the length of the array.
perfsJson = $.parseJSON(result);
var extras = new Array();
for (var i = perfsJson.length - 1; i >= 0; i--) {
var obj = perfsJson[i];
if (obj != null) {
if (obj.Extras != null) {
for (var perf_no in obj.Extras) {
if (extras[perf_no] == undefined) {
var arr = new Array();
for (var extra in obj.Extras[perf_no]) {
if (arr[extra] == undefined) {
arr[extra] = obj.Extras[perf_no][extra];
}
}
extras[perf_no] = arr;
}
}
break;
}
}
}
The resulting array appears as below:
Any ideas what's going on here?
Edit:
Sample of Json below
{"Extras":{"32516":{"24186":"Example text"},"32515":{"24186":"Example text"},"32514":{"24186":"Example text"},"32512":{"24186":"Example text"},"32513":{"24186":"Example text"},"32511":{"24186":"Example text"},"32510":{"24186":"Example text"},"32509":{"24186":"Example text"},"32507":{"24186":"Example text"},"32503":{"24186":"Example text"},"32506":{"24186":"Example text"},"32505":{"24186":"Example text"},"32508":{"24186":"Example text"},"32502":{},"32497":{}}}

What's going on hear is that you are using for..in to iterate over an array, which is a no-no because it iterates properties that are not the array elements (such as the .length property). Instead, use Array#forEach:
perfsJson = $.parseJSON(result);
var extras = new Array();
for (var i = perfsJson.length - 1; i >= 0; i--) {
var obj = perfsJson[i];
if (obj != null) {
if (obj.Extras != null) {
obj.Extras.forEach(function (item, idx) {
if (typeof extras[idx] === 'undefined') {
var arr = new Array();
item.forEach(function (item2, idx2) {
if (typeof arr[idx2] === 'undefined') {
arr[idx2] = item2;
}
});
extras[idx] = arr;
}
});
break;
}
}
}
The innermost loop is pretty pointless and can be replaced with Array#slice:
perfsJson = $.parseJSON(result);
var extras = new Array();
for (var i = perfsJson.length - 1; i >= 0; i--) {
var obj = perfsJson[i];
if (obj != null) {
if (obj.Extras != null) {
obj.Extras.forEach(function (item, idx) {
if (typeof extras[idx] === 'undefined') {
extras[idx] = item.slice();
}
});
break;
}
}
}
The next inner loop can be replaced with Array#map and two if statements can be combined:
perfsJson = $.parseJSON(result);
var extras = new Array();
for (var i = perfsJson.length - 1; i >= 0; i--) {
var obj = perfsJson[i];
if (obj != null&& obj.Extras != null) {
extras = obj.Extras.map(function (item) {
return item.slice();
});
break;
}
}
In fact, most of this code can be simplified:
function findLastElement(arr) {
for (var i = arr.length - 1; i >= 0; i -= 1) {
if (arr[i] != null && arr[i].Extras != null) { return arr[i]; }
}
}
perfsJson = $.parseJSON(result);
var lastElement = findLastElement(perfsJson);
var extras = lastElement
? lastElement.Extras.map(function (item) { return item.slice(); })
: [];

Push to an array in a nested loop is repeating the last value

I am trying to push elements to an array in a nested loop, but only the last item is getting repeated in the final array, where am I going wrong, very new to javascript asynchronous concept.Below is the function in which I push the items to an array.
$scope.showBeList = function(feed) {
if (feed[srcServ.KEY_CONTENT_TEXT]) {
var content = JSON.parse(feed[srcServ.KEY_CONTENT_TEXT])
if (content) {
$scope.beList = {};
for (var key in content) {
var decorationVal;
//reading value from a lokijs collection
var decoration = dataServ[srcServ.CONST_COLLECTION_DECORATION].find({
'name': key
});
if (decoration && decoration.length) {
decorationVal = decoration[0];
if (decorationVal != null) {
var tempObj = JSON.parse(decorationVal.value);
if (tempObj) {
var header = tempObj[key][key + '_HEADER'];
if (header) {
var counter = content[key].length;
var tempItems = [];
for (var j = 0; j < content[key].length; j++) {
(function(j) {
var obj = {};
obj[srcServ.KEY_MAIN_HEADER] = tempObj[key][srcServ.KEY_DESC];
obj[srcServ.KEY_SUB_HEADER] = header[srcServ.KEY_DESC];
obj.id = j;
var itemVal = content[key][j][key + '_HEADER'];
var details = [];
var notes = [];
for (var item in itemVal) {
var val = null;
var found = false;
for (var i = 0; i < header.field.length; i++) {
if (header.field[i].name == item) {
val = header.field[i];
found = true;
break;
}
}
if (found && val != null) {
val[srcServ.KEY_DESC_VALUE] = itemVal[item];
details.push(val);
}
}
obj.details = details;
counter--;
if (counter == 0) {
$scope.showMoreDetails = true;
$scope.beList.beItems = tempItems;
console.log(JSON.stringify($scope.beList));
}
tempItems.push(obj)
})(j);
// $scope.beList.beItems.push(obj);
}
}
}
}
}
}
}
}
}

convert xml to json in Javascript

I have the following javascript function (which I got from Stack Overflow) which converts XML to JSON:
function xmlToJson(xml) {
try {
var obj = {};
if (xml.nodeType == 1) {
if (xml.attributes.length > 0) {
for (var j = 0; j < xml.attributes.length; j++) {
var attribute = xml.attributes.item(j);
obj[attribute.nodeName] = attribute.nodeValue;
}
}
} else if (xml.nodeType == 3) {
obj = xml.nodeValue;
}
if (xml.hasChildNodes()) {
for (var i = 0; i < xml.childNodes.length; i++) {
var item = xml.childNodes.item(i);
var nodeName = item.nodeName;
if (typeof (obj[nodeName]) == "undefined") {
obj[nodeName] = xmlToJson(item);
} else {
if (typeof (obj[nodeName].push) == "undefined") {
var old = obj[nodeName];
obj[nodeName] = [];
obj[nodeName].push(old);
}
obj[nodeName].push(xmlToJson(item));
}
}
}
console.log(JSON.stringify(obj));
return obj;
} catch (e) {
alert(e.message);
}
}
What I want is to return it as an array ([]) when a xml node has at-least single child node and it has a parent node also. In this code it returns map ({}) if xml node has single child node but it is fine with multiple child nodes.
For example, I'd like the XML
<pnode attr1="abc">
<cnode attr2="xyz"></cnode>
</pnode>
to be transformed into the JSON
{
"pnode": {
"attr1": "abc"
},
"cnode": [
{"attr2": "xyz"}
]
}

With the clarification about what you want to achieve, here is an algorithm.
I'll leave my other answer up because I still think the wisest choice is not to play with the structure
function flattenNodes(node, isChild) {
var obj = {}, obj2, i, key, attributes = {};
if (node.attributes && node.attributes.length)
for (i = 0; i < node.attributes.length; ++i)
attributes[node.attributes[i].nodeName] = node.attributes[i].nodeValue;
if (!isChild)
obj[node.nodeName] = attributes;
else {
if (!obj.hasOwnProperty(node.nodeName))
obj[node.nodeName] = [];
else if (!(obj[node.nodeName] instanceof Array))
obj[node.nodeName] = [obj[node.nodeName]];
obj[node.nodeName].push(attributes);
}
attributes = null; // free
if (node.childNodes && node.childNodes.length)
for (i = 0; i < node.childNodes.length; ++i) {
if (node.childNodes[i].nodeType === 3) continue; // skip text node
obj2 = flattenNodes(node.childNodes[i], 1); // recurse
for (key in obj2) // merge
if (obj2.hasOwnProperty(key))
if (!obj.hasOwnProperty(key)) {
obj[key] = obj2[key];
} else {
if (!(obj[key] instanceof Array))
obj[key] = [obj[key]];
obj[key] = obj[key].concat(obj2[key]);
}
}
return obj;
}
Example usage on Node root_node
var root_node;
root_node = new DOMParser().parseFromString(
'<pnode attr1="abc"><cnode attr2="xyz"></cnode></pnode>',
'text/xml'
).documentElement;
var o = flattenNodes(root_node); // create
JSON.stringify(o); // to JSON
// {"pnode":{"attr1":"abc"},"cnode":[{"attr2":"xyz"}]}
If you have XML of the form <foo bar="baz"><foo hello="world"></foo></foo>, the first iteration will cause {foo: {bar: "baz"}}, then the second encounter will modify this to the array form of {foo: [{bar: "baz"}, {hello: "world"}]}

I would form the object representing the XML differently;
Integer nodeType
String nodeName
String nodeValue
Array childNodes
Object attributes
Now you can have the same form independent of number of child nodes/etc
function nodeToObject(node) {
var obj = {}, i;
obj.nodeType = node.nodeType;
obj.nodeName = node.nodeName;
obj.nodeValue = node.nodeValue;
obj.childNodes = [];
obj.attributes = {};
if (node.childNodes && node.childNodes.length)
for (i = 0; i < node.childNodes.length; ++i)
obj.childNodes.push(nodeToObject(node.childNodes[i]));
if (node.attributes && node.attributes.length)
for (i = 0; i < node.attributes.length; ++i)
obj.attributes[node.attributes[i].nodeName] = node.attributes[i].nodeValue;
return obj;
}
And then to transform root_node to JSON,
JSON.stringify(nodeToObject(root_node));
Going in the opposite direction is also possible in JavaScript, with some minor logic based upon nodeType to choose the creation method.