Help me to understand these codes!?

[newbe123]

I'm totally new when it comes to JavaScript and I'm trying to learn new things. Here I found the codes I tried it and it works but I would like to have comments for the code to understand how they have proceeded.

can someone help me and explain these codes with comments?

I really appreciate it.

 

var config = {
    "tags": "vfx+compositing",
    "user": "andreasl",
    "scriptTagTarget": "scriptTagDiv",
    "deliciousTarget": "deliciousLinks",
    "callbackFunction": "fetchDelicious"
};

window.onload = function() {
    var url = 'http://feeds.delicious.com/v2/json/' + config.user + '/' + config.tags + '?callback=' + config.callbackFunction;
    var scriptDiv = document.getElementById(config.scriptTagTarget);
    addScriptTag(url, scriptDiv);
};



function addScriptTag(url, scriptDiv) {

    if (scriptDiv.hasChildNodes())
    {
        scriptDiv.removeChild(scriptDiv.firstChild)
    };

    var scriptElement = document.createElement('script');
    scriptElement.setAttribute('src', url);
    scriptDiv.appendChild(scriptElement);
}


function fetchDelicious(json) {
var html = "";
for (var i = 0; i < json.length; i++) {
	var uri = json[i].u;
	var description = json[i].d;
	var tags = json[i].t; //array
	var time = json[i].dt; 
	//var n = json[i].n; //new?
	var author = json[i].a;
	var bHtml = "<li><a href=\":u\"></a>:t</li>".replace(":u", uri).replace("", description); 
	var tagHtml = ""; 
	for(var n = 0; n < tags.length; n++)  { 
	tagHtml += "<li><a href=\"http://delicious.com/:u\"></a></li>".replace(":u", [author,tags[n]].join("/")).replace("", tags[n]); 
	}
	tagHtml = "<ul>" + tagHtml + "</ul>";
	html += bHtml.replace(":t", tagHtml); 
}
html = "<ul>" + html + "</ul>"; 
document.getElementById(config.deliciousTarget).innerHTML = html;
   

}

[newbe123]

It is this last bit that I would like some help with. I really appreciate if someone could help me and write some comments for these codes.

I would really help

 

 

function fetchDelicious(json) {
   var html = "";
   for (var i = 0; i < json.length; i++) {
      var uri = json[i].u;
      var description = json[i].d;
      var tags = json[i].t; //array
      var time = json[i].dt;
      //var n = json[i].n; //new?
      var author = json[i].a;
      var bHtml = "<li><a href=\":u\"></a>:t</li>".replace(":u", uri).replace("", description);
      var tagHtml = "";
      for(var n = 0; n < tags.length; n++)  {
      tagHtml += "<li><a href=\"http://delicious.com/:u\"></a></li>".replace(":u", [author,tags[n]].join("/")).replace("", tags[n]);
      }
      tagHtml = "<ul>" + tagHtml + "</ul>";
      html += bHtml.replace(":t", tagHtml);
   }
   html = "<ul>" + html + "</ul>";
   document.getElementById(config.deliciousTarget).innerHTML = html;
   

}

[newbe123]

This is how I understand the codes, do not know if I am right or not?

Can someone help me and see if my comments are right?

 

function fetchDelicious(json) {

var html = ""; / / Create variable html

/ / Go through all the links json pick up and populate the list

for (var i = 0; i < json.length; i++) {

	var uri = json[i].u;
	var description = json[i].d;
	var tags = json[i].t; //array
	var time = json[i].dt; 

	var author = json[i].a;

/ / (li do not seem to be used to create 'html', removed)

	var bHtml = "<li><a href=\":u\"></a>:t</li>".replace(":u", uri).replace("", description); 
/ / Li tags with links placed in the variable bHtml 

	var tagHtml = ""; / / TagHtml harboring tags / bookmarks for each link

/ / Go through all the tags / bookmarks, and populate the level-two-list
	for(var n = 0; n < tags.length; n++)  { 
	tagHtml += "<li><a href=\"http://delicious.com/:u\"></a></li>".replace(":u", [author,tags[n]].join("/")).replace("", tags[n]); 
	}
	tagHtml = "<ul>" + tagHtml + "</ul>"; 
	html += bHtml.replace(":t", tagHtml); / / List is created with the li-tags that contain new ul-list of tags / bookmarks
}
html = "<ul>" + html + "</ul>"; 
document.getElementById(config.deliciousTarget).innerHTML = html;
   

}

[ignace]

fetchDelicious() takes a JSON encoded string and transforms it to a list in html. The .replace(':u', ..) and likes seem overhead IMO.

 

var config = {};

 

Creates an object literal like [] creates an array literal.

 

window.onload = function() {};

 

Attaches a function to execute upon window has been loaded. The function used is a closure: any variables that exists within it's parent scope are automatically copied into the function's scope.

 

var helloWorld = 'Hello!';
var hello = function() { alert(helloWorld); };

hello();

[newbe123]

I really appreciate your help but I wonder if you could take a look at the codes below and see if my comments are right and what I've missed perhaps? Thank u so much

 

 

function fetchDelicious(json) {

   var html = ""; / / Create variable html

   / / Go through all the links json pick up and populate the list

   for (var i = 0; i < json.length; i++) {

      var uri = json[i].u;
      var description = json[i].d;
      var tags = json[i].t; //array
      var time = json[i].dt;

      var author = json[i].a;

/ / (li do not seem to be used to create 'html', removed)

      var bHtml = "<li><a href=\":u\"></a>:t</li>".replace(":u", uri).replace("", description);
/ / Li tags with links placed in the variable bHtml

      var tagHtml = ""; / / TagHtml harboring tags / bookmarks for each link

/ / Go through all the tags / bookmarks, and populate the level-two-list
      for(var n = 0; n < tags.length; n++)  {
      tagHtml += "<li><a href=\"http://delicious.com/:u\"></a></li>".replace(":u", [author,tags[n]].join("/")).replace("", tags[n]);
      }
      tagHtml = "<ul>" + tagHtml + "</ul>";
      html += bHtml.replace(":t", tagHtml); / / List is created with the li-tags that contain new ul-list of tags / bookmarks
   }
   html = "<ul>" + html + "</ul>";
   document.getElementById(config.deliciousTarget).innerHTML = html;
   

}

[newbe123]

can someone please help me with this?

Please

[ignace]

Yes, your comments are correct.