javascript - 如何从 ImmutableJS Record 构造函数调用函数

标签 javascript typescript immutable.js

为了某种程度的安全/安保/温暖和模糊,我已经用不可变记录替换了许多/大部分我的 typescript 实体,但我只是注意到我的构造函数现在坏了。

最初,我在我的构造函数中自动创建新的 UUID 作为默认值,但是使用 ImmutableJS Records - 这种行为被打破了。

我明白为什么,但我不完全确定正确的解决方法是什么 - 但我觉得它要么非常复杂,要么非常简单。

import { Record } from "immutable";
import uuid from "uuid";

const tagDefaults: TagParams = {
    depth: 0,
    id: "tag::" + uuid.v4(),
    name,
    order: 0,
};

interface TagParams {
    name: string;
    order: number;
    depth: number;
    id: string;
}

export class Tag extends Record(tagDefaults) { }

创建初始 tagDefaults 是创建第一个 UUID 的原因 - 之后,所有后续新 Tag() 使用相同的 ID。

有没有一种简单的方法可以在每个构造函数上调用一个函数?我已经尝试在构造函数中重写 (this.id = uuid.v4()) 但这实际上导致 Webpack 对我产生影响。

更新:2018 年 6 月 8 日

使用@mpontus 提供的答案,这是一个更新的示例,显示任一选项都可以工作。

import { Record, Set } from "immutable";
import uuid from "uuid";

const tagDefaults: TagParams = {
    depth: 0,
    id: "",
    name,
    order: 0,
};

interface TagParams {
    name: string;
    order: number;
    depth: number;
    id: string;
}

export class Tag extends Record(tagDefaults) {
    constructor(props: Partial<TagParams> = {}) {
        // Option A - Works
        if (!props.id) {
            props.id = uuid.v4();
        }

        super(props);

        // Option B - Works
        // if (!this.id) {
        //     return this.set("id", uuid.v4());
        // }
        // return this;
    }
}

describe("Given a Tag", () => {
    describe("When constructed", () => {
        test("It should contain a unique id", () => {
            const tag1 = new Tag();
            const tag2 = new Tag({});
            const tag3 = new Tag({ depth: 1, name: "hello", order: 10 });
            const tag4 = new Tag({ id: "tag4Id" });
            const tags = Set([tag1, tag2, tag3, tag4].map((t) => t.id));
            expect(tags.size).toBe(4);
            console.log([tags]);
        });
    });
});

最佳答案

您无法使用默认值完成您想要的。

您尝试重写 Tag 构造函数是好的,但您必须重写进入构造函数的值:

const tagDefaults = {
    depth: 0,
    id: "",
    name: "",
    order: 0,
};

class Tag extends Record(tagDefaults) {
    constructor(values) {
        const finalValues = { ...values };

        if (finalValues.id === undefined) {
            finalValues.id = uuid.v4();
        }

        super(finalValues);
    }
}

或者,您可以从构造函数返回一个不同的记录实例,但我不确定 TypeScript 是否会接受。

const { Record } = require("immutable");
const uuid = require('uuid');

const tagDefaults = {
    depth: 0,
    id: undefined,
    name: "",
    order: 0,
};

class Tag extends Record(tagDefaults) {
    constructor(values) {
        super(values);

        if (this.id === undefined) {
            return this.set('id', uuid.v4());
        }

        return this;
    }
}

关于javascript - 如何从 ImmutableJS Record 构造函数调用函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50111414/

相关文章:

javascript - 为 IE 优化 jQuery

javascript - 将动态字段数据从一个组件发送到另一个组件

javascript - 如何在 JavaScript 中表示代数数据类型和模式匹配

immutable.js - Immutable.js-是否可以将元素插入列表中的任意位置?

javascript - 使用 Immutable.js 从 memoized 选择器返回纯 JS 对象

javascript - 使滚动条在移动浏览器中可见

javascript - 提交表单跨度消息更改位置为什么?

javascript - 将 db url 作为 ajax 参数传递

typescript - 类型映射时通用属性的问题

javascript - 如何使用 Immutable.js 从 javascript 原始对象创建记录映射?