TypeScript - объекты
An object- это экземпляр, содержащий набор пар ключ-значение. Значения могут быть скалярными значениями или функциями или даже массивом других объектов. Синтаксис приведен ниже -
Синтаксис
var object_name = {
key1: “value1”, //scalar value
key2: “value”,
key3: function() {
//functions
},
key4:[“content1”, “content2”] //collection
};
Как показано выше, объект может содержать скалярные значения, функции и структуры, такие как массивы и кортежи.
Пример: буквенное обозначение объекта
var person = {
firstname:"Tom",
lastname:"Hanks"
};
//access the object values
console.log(person.firstname)
console.log(person.lastname)
При компиляции он сгенерирует тот же код в JavaScript.
Вывод приведенного выше кода выглядит следующим образом:
Tom
Hanks
Шаблон типа TypeScript
Допустим, вы создали литерал объекта в JavaScript как -
var person = {
firstname:"Tom",
lastname:"Hanks"
};
Если вы хотите добавить какое-то значение к объекту, JavaScript позволяет внести необходимые изменения. Предположим, нам нужно будет добавить функцию к объекту person позже, таким образом вы можете это сделать.
person.sayHello = function(){ return "hello";}
Если вы используете тот же код в Typescript, компилятор выдает ошибку. Это связано с тем, что в Typescript конкретные объекты должны иметь шаблон типа. Объекты в Typescript должны быть экземпляром определенного типа.
Вы можете решить эту проблему, используя шаблон метода в объявлении.
Пример: шаблон типа машинописного текста
var person = {
firstName:"Tom",
lastName:"Hanks",
sayHello:function() { } //Type template
}
person.sayHello = function() {
console.log("hello "+person.firstName)
}
person.sayHello()
При компиляции он сгенерирует тот же код в JavaScript.
Вывод приведенного выше кода выглядит следующим образом:
hello Tom
Объекты также могут быть переданы как параметры функции.
Пример: объекты как параметры функции
var person = {
firstname:"Tom",
lastname:"Hanks"
};
var invokeperson = function(obj: { firstname:string, lastname :string }) {
console.log("first name :"+obj.firstname)
console.log("last name :"+obj.lastname)
}
invokeperson(person)
В примере объявляется литерал объекта. Выражение функции вызывается передающим объектом person.
При компиляции он сгенерирует следующий код JavaScript.
//Generated by typescript 1.8.10
var person = {
firstname: "Tom",
lastname: "Hanks"
};
var invokeperson = function (obj) {
console.log("first name :" + obj.firstname);
console.log("last name :" + obj.lastname);
};
invokeperson(person);
Его вывод выглядит следующим образом -
first name :Tom
last name :Hanks
Вы можете создавать и передавать анонимный объект на лету.
Пример: анонимный объект
var invokeperson = function(obj:{ firstname:string, lastname :string}) {
console.log("first name :"+obj.firstname)
console.log("last name :"+obj.lastname)
}
invokeperson({firstname:"Sachin",lastname:"Tendulkar"});
При компиляции он сгенерирует следующий код JavaScript.
//Generated by typescript 1.8.10
var invokeperson = function (obj) {
console.log("first name :" + obj.firstname);
console.log("last name :" + obj.lastname);
};
invokeperson({ firstname: "Sachin", lastname: "Tendulkar" });
invokeperson({ firstname: "Sachin", lastname: "Tendulkar" });
Его вывод выглядит следующим образом -
first name :Sachin
last name :Tendulkar
Утиная печать
При утином наборе два объекта считаются одним типом, если оба имеют одинаковый набор свойств. Утиная печать проверяет наличие определенных свойств в объектах, а не их фактический тип, чтобы проверить их пригодность. Концепция обычно объясняется следующей фразой -
«Когда я вижу птицу, которая ходит, как утка, плавает, как утка, и крякает, как утка, я называю эту птицу уткой».
Компилятор TypeScript реализует систему утиной печати, которая позволяет создавать объекты на лету, сохраняя при этом безопасность типов. В следующем примере показано, как мы можем передавать в функцию объекты, которые явно не реализуют интерфейс, но содержат все необходимые члены.
пример
interface IPoint {
x:number
y:number
}
function addPoints(p1:IPoint,p2:IPoint):IPoint {
var x = p1.x + p2.x
var y = p1.y + p2.y
return {x:x,y:y}
}
//Valid
var newPoint = addPoints({x:3,y:4},{x:5,y:1})
//Error
var newPoint2 = addPoints({x:1},{x:4,y:3})