在javaScript中字符串拼接很常见,但是如果在拼接过程中涉及到三目运算符的问题,就容易出错。
下面就该问题说一下个人的心得和意见
1.细心拼接字符串
图上代码发现有多处三目运算符的拼接,但都是针对于自定义的属性来进行拼接的,所以只需要理解一处,其他的都能理解。图上nodeId的拼接时需要先用双引号包裹起来在进行变量的拼接
h = $('<div class="nodeList" nodeId="' + r.id +'" '+
由于本人粗心没有用双引号包裹导致出现了拼接的问题,错误代码:
h = $('<div class="nodeList" nodeId=' + r.id +
(r.level ? ' nodeLevel=' + r.level + ' ' : r.level == 0 ? 'nodeLevel=0' : '') +
(r.combineCode ? ' nodeCombineCode=' + r.combineCode + ' ' : '') +
(r.parentId ? ' nodeParentId=' + r.parentId + ' ' : r.parentId == 0 ? 'nodeParentId=0' : '') +
(r.href ? ' nodeHref=' + r.href + ' >' : '>') +
(l ? '<i class="nodeIcon spreadIcon' + (t.spread ? 'spreadIconOn' : '') + '" ' + (t.spread ? 'spread="on"' : 'spread="off"') + '></i>' : ' <i class="nodeIcon"></i>') +
'<div class="nodeTop">' +
(t.showCheckbox ? '<i class="nodeIcon nodeCheck" nodecheck="off"></i>' : '') +
(t.showRadio ? '<i class="nodeIcon nodeRadio" noderadio="off"></i>' : '') +
'<span class="nodeMenu">' + r.title +
'</div>' +
'</span></div>');
就导致渲染元素时,出现了问题
所以拼接字符串时如果有复杂的情况一定要仔细
2三目运算符
在JavaScript中,字符串连接符号’+'的优先级高于三目运算符
图中代码拼接时三目运算符用括号包裹起来,使得三目运算符的结果为一块整体,提高优先级。这样代码块就会先执行括号内的元素,再进行拼接
h = $('<div class="nodeList" nodeId="' + r.id +'" '+
(r.level ? ' nodeLevel="' + r.level + '" ' : r.level == 0 ? 'nodeLevel=0' : '') +
最后个人在三目运算符内又嵌套了三目运算,发现是可行的。
以上就是关于此处代码块的个人心得