• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

337
Vistas
TypeScript: Colon vs Igual a (Tutorial angular)

Estoy aprendiendo Angular4 y revisando los ejemplos del tutorial.

https://angular.io/docs/ts/latest/tutorial/toh-pt1.html

Tengo el siguiente código en el tutorial.

 import { Component } from '@angular/core'; @Component({ selector: 'my-app', template: `<h1>{{title}}</h1><h2>{{hero.name}} details!</h2>` }) export class AppComponent { title = 'Tour of Heroes'; // *1 hero: Hero = { id: 1, name: 'Windstorm' }; } export class Hero { id: number; // *2 name: string; }

En el código se definen 2 clases, AppComponent y Hero. No puedo entender por qué para la declaración de miembro de una clase, AppComponent sigue la propiedad de estilo = valor mientras que la clase Hero usa la propiedad de estilo: valor

Si cambio la clase AppComponent a la siguiente, el código no funciona como se esperaba.

 export class AppComponent { title : 'Tour of Heroes', hero: Hero : { id: 1, name: 'Windstorm' }; }

Me gustaría saber cuál es la diferencia entre usar : y usar = y cuándo, ¿qué se debe usar?

about 3 years ago · Santiago Trujillo
3 Respuestas
Responde la pregunta

0

Mire de nuevo el AppComponent :

 export class AppComponent { title = 'Tour of Heroes'; hero: Hero = { id: 1, name: 'Windstorm' }; }

La primera definición de campo:

 title = 'Tour of Heroes';

está asignando un valor de cadena. Como ese valor es una cadena, TS puede inferir el tipo. La línea es equivalente a:

 title: string = 'Tour of Heroes';

La segunda definición de campo

 hero: Hero = { id: 1, name: 'Windstorm' };

está asignando un objeto , que podría ser de any tipo. Entonces, aquí, para aprovechar al máximo TS, debemos ser específicos sobre el tipo de cosa que será. También se podría escribir:

 hero: { id: number, name: string } = {...};

En la clase Hero , solo está configurando tipos, sin valores predeterminados. El patrón es en realidad el mismo en ambos:

 name[: type][ = value];

Probablemente valga la pena echar un vistazo al manual de TS para obtener más información sobre tipos y definiciones de clase.

about 3 years ago · Santiago Trujillo Denunciar

0

: se usa en JSON para valor, ejemplo:

 { name: "name value" };

: también se usa en mecanografiado para definir un tipo de objetos. Por ejemplo:

 myObj: JSON;

= se utiliza para realizar una asignación fuera del JSON.

 myObj: JSON = { name: "name value" }; // meaning myObj has type JSON and is equal to { name: "name value" };

Los problemas en tu código:

 title : 'Tour of Heroes', <-- Here you are making titles **type** 'Tour of Heroes'

Le sugiero que lea la documentación básica de mecanografiado: https://www.typescriptlang.org/docs/handbook/basic-types.html

about 3 years ago · Santiago Trujillo Denunciar

0

Diría que es una especie de interfaz, pero en lugar de implementarla, puede usar esta clase como un tipo:

 export class Hero { id: number; // *2 name: string; } let a: Hero = 'some call to create new hero';

Se asegurará de que el objeto sea de tipo <Hero> , cualquier otra cosa será causa de error de tipo.

Aquí puedes ver que se ha utilizado como un tipo para crear un nuevo héroe de tipo héroe:

 hero: Hero = { id: 1, name: 'Windstorm' };
about 3 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda