代码之家 › 专栏 › 技术社区 › RoZaR

Javascript中的复杂对象

prototype-programming javascript

-3

RoZaR · 技术社区 · 11 年前

我有BookingOrder类它是主容器类,我在主容器中嵌套了PickAddress之类的类。

如果我们启动BookingOrder类型的对象,那么我们将PickupAddress.EnteredAddress属性赋值,然后我们再次尝试启动另一个BookingOrder对象这个新对象中的PickupAddress.EnteredAddress具有旧值,这就是为什么它不会再次启动。

点击按钮
它将调用填充顺序函数,我将填充o.PickupAddress.EnteredAddress。
再次单击按钮。
它将调用fill-order函数并启动新的bookingorder(),但它会提醒您o.PickupAddress.EnteredAddress有值。

我需要知道为什么会发生这种情况,以及我应该做些什么来启动主要复杂对象中的所有对象。

 <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
        <script>
            function BookingOrder() { }
            BookingOrder.prototype = {
                "DriverLng": null,
                "AccountName": null,
                "ParaTransit": false,
                "PickupAddress": {
                    "EnteredAddress": null,
                    "EstablishmentName": null,
                    "GeoPoint": { "lat": 0, "lng": 0 }
                },
                "DropoffAddress": {
                    "EnteredAddress": null,
                    "EstablishmentName": null,
                    "GeoPoint": { "lat": 0, "lng": 0 }
                }
            };
            var o;
            function FillOrder() {
                debugger;
                o = new BookingOrder();
                if (o.PickupAddress.EnteredAddress != null & o.PickupAddress.EnteredAddress != '')
                    alert('Entered Address is not empty');
                else
                    o.PickupAddress.EnteredAddress = 'Test 123'
            }
        </script>
    </head>
    <body>
        <input type="button" onclick="FillOrder()" />
    </body>
    </html>

这样做的最佳选择是:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script>
        function BookingOrder() {
            return  {
                "DriverLng": null,
                "AccountName": null,
                "ParaTransit": false,
                "PickupAddress": {
                    "EnteredAddress": null,
                    "EstablishmentName": null,
                    "GeoPoint": { "lat": 0, "lng": 0 }
                },
                "DropoffAddress": {
                    "EnteredAddress": null,
                    "EstablishmentName": null,
                    "GeoPoint": { "lat": 0, "lng": 0 }
                }
            };
        }

        var o;
        function FillOrder() {
            debugger;
            o = new BookingOrder();
            if (o.PickupAddress.EnteredAddress != null & o.PickupAddress.EnteredAddress != '')
                alert('Entered Address is not empty');
            else
                o.PickupAddress.EnteredAddress = 'Test 123'
        }
    </script>
</head>
<body>
    <input type="button" onclick="FillOrder()" />
</body>
</html>

每次调用构造函数时,它都会返回新的对象和所有在不使用原型的情况下再次启动的嵌套对象,并再次清除构造函数中的所有值。

1 回复 | 直到 11 年前

1

Pointy 11 年前

当您引用“PickupAddress”对象时,您总是引用同一个对象。如果你需要为每个实例刷新它,你必须在构造函数中设置它。

    function BookingOrder() {
      this.PickupAddress = {
            "EnteredAddress": null,
            "EstablishmentName": null,
            "GeoPoint": { "lat": 0, "lng": 0 }
      };

    }

现在,对构造函数的每次调用都将确保例子具有自己的“PickupAddress”属性和自己的不同值(对象)。