Best way to write a JavaScript function [closed]

Navigation
-1

What is the best way to write the following function?

This? 

function DOMtoString(document_root) {
    var html = '',
        node = document_root.firstChild;
    while (node) {
        switch (node.nodeType) {
        case Node.ELEMENT_NODE:
            html += node.outerHTML;
            break;
        case Node.TEXT_NODE:
            html += node.nodeValue;
            break;
        case Node.CDATA_SECTION_NODE:
            html += '<![CDATA[' + node.nodeValue + ']]>';
            break;
        case Node.COMMENT_NODE:
            html += '<!--' + node.nodeValue + '-->';
            break;
        case Node.DOCUMENT_TYPE_NODE:
            // (X)HTML documents are identified by public identifiers
            html += "<!DOCTYPE " + node.name + (node.publicId ? ' PUBLIC "' + node.publicId + '"' : '') + (!node.publicId && node.systemId ? ' SYSTEM' : '') + (node.systemId ? ' "' + node.systemId + '"' : '') + '>\n';
            break;
        }
        node = node.nextSibling;
    }
    return html;
}

Or is this? 

function DOMtoString(a) {
    var b = "",
        c = a["firstChild"];
    while (c) {
        switch (c["nodeType"]) {
            case Node["ELEMENT_NODE"]:
                b += c["outerHTML"];
                break;
            case Node["TEXT_NODE"]:
                b += c["nodeValue"];
                break;
            case Node["CDATA_SECTION_NODE"]:
                b += "<![CDATA[" + c["nodeValue"] + "]]>";
                break;
            case Node["COMMENT_NODE"]:
                b += "<!--" + c["nodeValue"] + "-->";
                break;
            case Node["DOCUMENT_TYPE_NODE"]:
                b += "<!DOCTYPE " + c["name"] + (c["publicId"] ? " PUBLIC \"" + c["publicId"] + "\"" : "") + (!c["publicId"] && c["systemId"] ? " SYSTEM" : "") + (c["systemId"] ? " \"" + c["systemId"] + "\"" : "") + ">";
                break;
        }
        c = c["nextSibling"];
    }
    return b;
}
    
asked by anonymous 05.05.2016 / 20:42

3 answers

2

Use dotted notation for defined properties and bracketed / straight parent notation in programmatic properties, which you receive via variables.

That is, in the case of document_root.firstChild dotted notation is the correct, most used usage.

In case of 

var prop = element.tagName == 'INPUT' ? 'value' : 'innerHTML';
var valor = element[prop];

You should use bracketed / straight parent notation, which is the only way to access element / object properties that vary programmatically.

    
05.05.2016 / 20:47
2

Clearly the former is better written because it has better variable names. The code should be self-documenting. So you can say that the former is better.

The access style for members of Node as object members (in the first) and not elements of the array (in the second) seems to be a bit more readable, but it's like. Using as a member of array would only be interesting if you needed to use a variable as an "access index", which is not the case.

Otherwise I see no relevant differences.

Both work perfectly identically. It's just a question of readability. The second will load slightly faster because it is smaller, but the gain is negligible in this case.

    
05.05.2016 / 20:48
0

As far as I know, the best way is to use dotted notation for the normal use of objects and bracketed notation when we are going to modify the object programmatically.

In your case, therefore, the 1st notation is more correct. If you want access to all members of the object, remove or add them, you can use the notation in brackets.

    
05.05.2016 / 21:06
Search text file and compare with others Use default Android Activity template to switch between editing and previewing [closed]