Question

我有这个对象TrSet从dom接收节点。有时那些dom元素可以为null，我想处理节点的属性，遗憾的是，我无法弄清楚如何在undefined属性上使用空条件赋值。

var TrSet = function(valid,stat,txt,dd){
     this.validateField = valid || "";
     this.statusDropDown = stat || "";
     this.txtValue = txt || "";
     this.ddValue = dd || "";
     this.txtValue.value = txt.value || ""; //Cannot read property value of undefined
     this.ddValue.style.visibility = dd.style.visibility || "hidden"; //same

     this.validate = function () {
         /// Even when attempting to access 
         /// the property with hasOwnProperty throws the error 
         ///"Cannot read property 'hasOwnProperty' of null"!
       if (this.statusDropDown.hasOwnProperty("value") && this.validateField.hasOwnProperty("style")) {

我不明白其中任何一个是如何失败的。如果它为null或未定义，则应对空字符串求值为true，并将其设置为等于该值。

为清晰度编辑

在第一个例子中

var TrSet = function(txt) {
    this.txtValue = txt || "";
    this.txtValue.value = txt.value || "";
}

如果txt为空，则设为等于""，如果txt.value为空，则设为等于""。这怎么会失败？

第二个例子

var TrSet = function(stat) {
    this.statusDropDown = stat || "";

    if (this.statusDropDown.hasOwnProperty("value")) { }

如果stat为空，则设置statusDropDown等于""。然后我检查它是否hasOwnProperty。为什么这会失败？

Answer 1

我不明白其中任何一个是如何失败的。如果它为null或未定义，则应对空字符串求值为true，并将其设置为等于。

不完全：语句txt || "" 将返回 txt或""的值，以先到者为准。它不在任何地方分配该值，尤其不是txt。你单独分配。

因此，在您的示例中（例如缩小为必要部分）：

var TrSet = function(valid,stat,txt,dd){ this.txtValue = txt || ""; console.log('txt will still be undefined but txtValue will not be', txt, this.txtValue); this.txtValue.value = txt.value || ""; }

要做你期望的事情，你需要再次默认txt，如下：

var TrSet = function(valid,stat,txt,dd){ this.txtValue = txt || ""; console.log('txt will still be undefined but txtValue will not be', txt, this.txtValue); this.txtValue.value = (txt || "").value || ""; // <- change here }

当然，这在很大程度上是不可读的（.value || ''群怎么样？你一眼就知道了吗？），所以我们可能会缓存它：

var TrSet = function(valid,stat,txt,dd){ var realTxt = txt || "" this.txtValue = realTxt; this.txtValue.value = realTxt.value || ""; }

现在，这有效，但不太理想。 ES6添加了直接在参数列表中提供默认值的功能，这更加清晰：

var TrSet = function(valid = "", stat = "", txt = "", dd = "") { this.txtValue = txt; this.txtValue.value = txt.value || ""; }

直接解决您添加的两个简短问题：

var TrSet = function(txt) { this.txtValue = txt || ""; this.txtValue.value = txt.value || ""; }

如果txt为null，则设为等于＆＃34;＆＃34;，如果txt.value为null，则设为等于＆＃34;＆＃34;。这怎么会失败？

由于txt || "" 不将分配给txt，因此只需返回 txt 或 ""并将该返回值分配给this.txtValue。

var TrSet = function(stat) { this.statusDropDown = stat || ""; if (this.statusDropDown.hasOwnProperty("value")) { }

如果stat为null，则设置statusDropDown等于＆＃34;＆＃34;。然后我检查它是否hasOwnProperty。为什么这会失败？

可能是因为this没有绑定，所以它实际上没有statusDropDown的值。在JavaScript中，this可以根据函数的调用方式而改变。查看this question了解详情。

Answer 2

在这一行：

this.txtValue.value = txt.value || "";

txt为null，尝试引用空对象上的属性会导致错误。您需要将其更改为：

this.txtValue.value = txt ? (txt.value || "") : "";

在尝试取消引用之前测试变量为null。

在空对象中分配属性默认值Javascript

2 个答案: