YouTip LogoYouTip

Ts Object

# TypeScript Objects An object is an instance that contains a set of key-value pairs. The values can be scalars, functions, arrays, other objects, etc., as shown in the following example: var object_name = {key1: "value1", // scalar key2: "value", key3: function(){// function}, key4:["content1", "content2"]// collection} The above object contains scalars, functions, and collections (arrays or tuples). ### Object Instance ## TypeScript var sites = {site1:"Tutorial", site2:"Google"}; // Access object values console.log(sites.site1)console.log(sites.site2) Compiling the above code yields the following JavaScript code: ## JavaScript var sites = {site1:"Tutorial", site2:"Google"}; // Access object values console.log(sites.site1)console.log(sites.site2) The output is: TutorialGoogle * * * ## TypeScript Type Template Suppose we define an object in JavaScript: var sites = {site1:"Tutorial", site2:"Google"}; If we want to add a method to the object, we can make the following modification: sites.sayHello = function(){ return "hello";} If we use the above approach in TypeScript, a compilation error will occur because objects in TypeScript must be instances of a specific type. ## TypeScript var sites = {site1: "Tutorial", site2: "Google", sayHello: function(){}// type template}; sites.sayHello = function(){console.log("hello " + sites.site1); }; sites.sayHello(); Compiling the above code yields the following JavaScript code: ## JavaScript var sites = {site1: "Tutorial", site2: "Google", sayHello: function(){}// type template}; sites.sayHello = function(){console.log("hello " + sites.site1); }; sites.sayHello(); The output is: hello Tutorial Additionally, an object can be passed as an argument to a function, as shown in the following example: ## TypeScript var sites = {site1:"Tutorial", site2:"Google", }; var invokesites = function(obj: {site1:string, site2 :string}){console.log("site1 :"+obj.site1)console.log("site2 :"+obj.site2)}invokesites(sites) Compiling the above code yields the following JavaScript code: ## JavaScript var sites = {site1: "Tutorial", site2: "Google"}; var invokesites = function(obj){console.log("site1 :" + obj.site1); console.log("site2 :" + obj.site2); }; invokesites(sites); The output is: site1 :Tutorial site2 :Google * * * ## Duck Typing Duck typing is a style of dynamic typing and is a form of polymorphism. In this style, the effective semantics of an object are not determined by inheriting from a specific class or implementing a specific interface, but by the "current set of methods and properties." > It can be expressed as: > > > "If it walks like a duck and it quacks like a duck, then it must be a duck." In duck typing, the focus is on what an object can do, not on what type the object is. For example, in a language without duck typing, we might write a function that accepts an object of type "duck" and calls its "walk" and "quack" methods. In a language with duck typing, such a function can accept an object of any type and call its "walk" and "quack" methods. If these methods do not exist, a runtime error will be raised. Any object that has the correct "walk" and "quack" methods can be accepted by the function, which leads to the above expression and gives this way of determining types its name. 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}}// Correct var newPoint = addPoints({x:3,y:4},{x:5,y:1})// Incorrect var newPoint2 = addPoints({x:1},{x:4,y:3})
← Ts ModuleTs Interface β†’