Как инициализировать дочерние объекты при использовании объекта в Typescript

Question

Все еще изучаю Машинопись, и у меня есть этот объект

export class Marker {
    position: {
        lat: number,
        lng: number,
    };
    label: {
        color: string,
        text: string,
    };
    title: string;
    options: {
        animation: any,
    };
}

и в моем коде, где я его использую, я делаю это так, но marker.position не определен

for (const ybEvent of this.Events) {
  const marker = new Marker();
  marker.title = ybEvent.name;
  marker.position.lat = ybEvent.latitude;
  marker.position.lng = ybEvent.longitude;
  marker.label.color = 'blue';
  marker.label.text = ybEvent.description;
  marker.options.animation = google.maps.Animation.BOUNCE;
  this.markers.push(marker);
}

Как лучше всего инициализировать позицию, метку и параметры в этом объекте?

Answer 1

Прежде всего, я бы порекомендовал вам использовать Typescript в строгом режиме.

При использовании машинописного текста в строгом режиме будет отображаться ошибка, если член класса не имеет никакой инициализации:

введите описание изображения здесь

Я бы также определил структуру каждого объекта (также внутри объектов).

interface Position {
    lat: number,
    lng: number,
}

interface Label {
        color: string,
        text: string,
};
interface Options {
        animation: any,
}

И если ваш объект Marker не требует каких-либо внутренних logi c, тогда я также установил бы его как интерфейс:

interface Marker {
    position: Position;
    label: Label;
    title: string;
    options: Options;
}

И ваша инициализация может быть примерно такой:

for (const ybEvent of this.Events) {
    const position: Position = {
        lat: ybEvent.latitude,
        lng: ybEvent.longitude,
    };

    const label: Label = {
        color: 'blue',
        text: ybEvent.description,
    }

    const options: Options = {
        animation: google.maps.Animation.BOUNCE
    }

    const marker: Marker = {
        position,
        label,
        options,
    }

    this.markers.push(marker);
}

Или без промежуточных объектов:

for (const ybEvent of this.Events) {

    const marker: Marker = {
        position: {
            lat: ybEvent.latitude,
            lng: ybEvent.longitude,
        },
        label: {
            color: 'blue',
            text: ybEvent.description,
        },
        options: {
            animation: google.maps.Animation.BOUNCE
        }
    }

    this.markers.push(marker);
}

Keep in Заметьте, идея Typescript заключается в обеспечении безопасности type. Если вы инициализируете объект таким образом myObject = {}, он не будет иметь никакой информации о типе.