javaScript字符串拼接涉及到三目运算符问题

在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' : '') +

最后个人在三目运算符内又嵌套了三目运算,发现是可行的。
三目运算符内嵌套三目运算
以上就是关于此处代码块的个人心得

  • 2
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值