Is TypeScript designed to accommodate duck typing?

Question

Is TypeScript designed to accommodate duck typing?

There seems to be conflicting information on this topic. https://basarat.gitbooks.io/typescript/content/docs/classes.html (go to the inheritance section) suggests that it's supported, but I'm encountering compilation issues with my TypeScript code on playGround

class Point{
    x:number; 
    y:number;
    constructor(x:number, y:number){
    this.x = x;
    this.y = y ;    
    }

    add(point:Point){
     return new Point(this.x + point.x , this.y + point.y);
    }
}

class Point3D extends Point{
    z:number;
    constructor(x:number, y:number, z:number){
        super(x,y);
        this.z = z;
    }

    add(point3d:Point3D){
        // Error does not support duct type.
        var point2D = super.add( {point3d.x, point3d.y}); 
        return new Point3D(point2D.x, point2D.y, this.z);
    }
}

typescript

Answer 1

Answer №1

It won't suffice in your scenario to simply pass the Point instance as is:

add(point3d:Point3D){
    // Error does not support duct type.
    //var point2D = super.add( {point3d.x, point3d.y}); 

    var point2D = super.add(point3d);

This is because super only accepts points

add(point:Point){...

And Point3d is a Point

class Point3D extends Point{

Take a look at the updated playground

If we want to fully utilize duck typing, we should introduce an interface

interface IPoint{
    x:number; 
    y:number;
}

and use that in the add method

add(point:IPoint){
 return new Point(this.x + point.x , this.y + point.y);
}

Then, we can implement duck typing like this:

var point2D = super.add({x: point3d.x, y: point3d.y});

Check out the example here

Answer 2

It won't suffice in your scenario to simply pass the Point instance as is:

add(point3d:Point3D){
    // Error does not support duct type.
    //var point2D = super.add( {point3d.x, point3d.y}); 

    var point2D = super.add(point3d);

This is because super only accepts points

add(point:Point){...

And Point3d is a Point

class Point3D extends Point{

Take a look at the updated playground

If we want to fully utilize duck typing, we should introduce an interface

interface IPoint{
    x:number; 
    y:number;
}

and use that in the add method

add(point:IPoint){
 return new Point(this.x + point.x , this.y + point.y);
}

Then, we can implement duck typing like this:

var point2D = super.add({x: point3d.x, y: point3d.y});

Check out the example here

Answer 3

Answer №2

Contrary to popular belief, TypeScript is not actually considered to be duck typed. Instead, it falls into the category of being structurally typed. The distinction lies in the fact that duck typing only focuses on the specific members accessed during runtime, while structural typing mandates adherence to the complete contract of an object in order to function as a specific interface or type.

For example, when passing an object like {x: point3d.x, y: point3d.y} in TypeScript, it must align structurally with the Point interface. In this case, it fails to meet the requirements as it lacks the necessary add-method.

Answer 4

Contrary to popular belief, TypeScript is not actually considered to be duck typed. Instead, it falls into the category of being structurally typed. The distinction lies in the fact that duck typing only focuses on the specific members accessed during runtime, while structural typing mandates adherence to the complete contract of an object in order to function as a specific interface or type.

For example, when passing an object like {x: point3d.x, y: point3d.y} in TypeScript, it must align structurally with the Point interface. In this case, it fails to meet the requirements as it lacks the necessary add-method.

Answer 5

Answer №3

When attempting to define an object as {x:number, y:number} and label it as a Point, it's important to note that a Point actually consists of

{x:number, y:number, add:(point:Point)=>Point}

. To make this work, make sure to include an 'add' property with a matching signature.

Answer 6

When attempting to define an object as {x:number, y:number} and label it as a Point, it's important to note that a Point actually consists of

{x:number, y:number, add:(point:Point)=>Point}

. To make this work, make sure to include an 'add' property with a matching signature.

Answer 7

Answer №4

Here is a breakdown of the situation:

The syntax is incorrect. Instead of {point3d.x, point3d.y}, it should be {x: point.x, y: point.y} to create an object.
Duck typing is not possible in this scenario due to the absence of an add method in your object. The compiler will throw an error. To address this, I introduced an interface named IPoint to meet the compiler's requirements.

Take a look at my proposed solution below:

interface IPoint {
    x: number;
    y: number;
}

class Point {
    x: number;
    y: number;
    
    constructor(x: number, y: number) {
        this.x = x;
        this.y = y;
    }

    add(point: IPoint) {
        return new Point(this.x + point.x, this.y + point.y);
    }
}

class Point3D extends Point {
    z: number;
    
    constructor(x: number, y: number, z: number) {
        super(x, y);
        this.z = z;
    }

    add(point: Point3D) {
        const point2D = super.add({ x: point.x, y: point.y });
        return new Point3D(point2D.x, point2D.y, this.z);
    }
}

Answer 8

Here is a breakdown of the situation:

The syntax is incorrect. Instead of {point3d.x, point3d.y}, it should be {x: point.x, y: point.y} to create an object.
Duck typing is not possible in this scenario due to the absence of an add method in your object. The compiler will throw an error. To address this, I introduced an interface named IPoint to meet the compiler's requirements.

Take a look at my proposed solution below:

interface IPoint {
    x: number;
    y: number;
}

class Point {
    x: number;
    y: number;
    
    constructor(x: number, y: number) {
        this.x = x;
        this.y = y;
    }

    add(point: IPoint) {
        return new Point(this.x + point.x, this.y + point.y);
    }
}

class Point3D extends Point {
    z: number;
    
    constructor(x: number, y: number, z: number) {
        super(x, y);
        this.z = z;
    }

    add(point: Point3D) {
        const point2D = super.add({ x: point.x, y: point.y });
        return new Point3D(point2D.x, point2D.y, this.z);
    }
}

Is TypeScript designed to accommodate duck typing?

Answer №1

Answer №2

Answer №3

Answer №4

Similar questions

The array is filled with values, however, there seems to be an issue preventing their access. What could possibly be causing this obstacle

What is the best way to populate an Angular variable in Ionic following a subscription?

I would appreciate it if someone could explain the significance of the image display area

Understanding how types intersect in TypeScript

Omit functions from category

Experiencing Compatibility Issues: Next.js 14.0.3 with next-auth and NestJS Backend Runs Smoothly in Development Environment, but Encounters

Displaying data-table with only the values that are considered true

When using Next.js, I have found that the global.css file only applies styles successfully when the code is pasted directly into the page.tsx file. However, when attempting to

Encountering issues with `Partial<this['someProperty']>` usage in TypeScript

Why does the pound symbol in z-index always show up in Angular?

What is the best way to specify the type of a property that has already been assigned

mat-table dataSource is not functioning properly with REST API integration

Combining two observables into one and returning it may cause Angular guards to malfunction

Struggling to successfully map angular model data to a Spring POJO class

Leveraging the Angular (2) routerLinkActive directive to handle dynamic routes

Trigger event when the useRef element's height surpasses zero

The Angular Animation constantly resets with each new action taken

I am facing an issue with the Angular2 Modal Form where it only displays the data but does

What is the method for importing the merge function from "lodash/merge" in TypeScript?

Tips for utilizing withNavigation from react-navigation in a TypeScript environment