TypeScript'teki özelliklere sahip bir işlev nesnesi oluşturun

Üzerinde tutulan bazı özelliklere sahip bir işlev nesnesi oluşturmak istiyorum. Örneğin JavaScript'te şunu yapardım:

var f = function() { }
f.someValue = 3;

Şimdi TypeScript'te bunun türünü şu şekilde tanımlayabilirim:

var f: { (): any; someValue: number; };

Ancak, bir kadroya ihtiyaç duymadan gerçekten inşa edemem. Gibi:

var f: { (): any; someValue: number; } =
    <{ (): any; someValue: number; }>(
        function() { }
    );
f.someValue = 3;

Bunu bir oyuncu kadrosu olmadan nasıl inşa edersiniz?

Öyleyse, gereksinim basitçe bu işlevi "f" işlevine dönüştürme olmadan oluşturmak ve atamaksa, burada olası bir çözüm vardır:

var f: { (): any; someValue: number; };

f = (() => {
    var _f : any = function () { };
    _f.someValue = 3;
    return _f;
})();

Esasen, atama yapılmadan önce bu imzayla eşleşecek bir nesneyi "oluşturmak" için kendi kendine çalışan bir işlev hazır bilgisi kullanır. Tek tuhaflık, işlevin iç bildiriminin 'herhangi' türünde olması gerektiğidir, aksi takdirde derleyici, nesnede henüz bulunmayan bir özelliğe atadığınızı ağlar.

DÜZENLEME: Kodu biraz basitleştirdi.

Güncelleme: Bu yanıt, TypeScript'in önceki sürümlerinde en iyi çözümdü, ancak daha yeni sürümlerde daha iyi seçenekler mevcuttur (diğer yanıtlara bakın).

Kabul edilen cevap işe yarar ve bazı durumlarda gerekli olabilir, ancak nesneyi oluşturmak için hiçbir tip güvenlik sağlamamanın dezavantajı vardır. Tanımlanmamış bir özellik eklemeye çalışırsanız, bu teknik en azından bir tür hatası verir.

interface F { (): any; someValue: number; }

var f = <F>function () { }
f.someValue = 3

// type error
f.notDeclard = 3

Bu, artık kolayca (typecript 2.x) Object.assign(target, source)

misal:

Buradaki sihir Object.assign<T, U>(t: T, u: U), kesişme noktasını döndürmek için yazılmış olmasıdır T & U.

Bunun bilinen bir arayüze çözülmesini sağlamak da basittir. Örneğin:

interface Foo {
  (a: number, b: string): string[];
  foo: string;
}

let method: Foo = Object.assign(
  (a: number, b: string) => { return a * a; },
  { foo: 10 }
); 

uyumsuz yazımdan kaynaklanan hatalar:

Hata: foo: foo: string'e atanamayan numara
Hata: [] dizesine atanamayan numara (dönüş türü)

uyarı: Eski tarayıcıları hedefliyorsanız , Object.assign'ı çoklu doldurmanız gerekebilir .

TypeScript, bu durumu bildirim birleştirme yoluyla ele almak için tasarlanmıştır :

ayrıca bir işlev oluşturma ve ardından işlevin üzerine özellikler ekleyerek işlevi daha da genişletme konusunda JavaScript uygulamasına aşina olabilirsiniz. TypeScript, bunun gibi tanımları güvenli bir şekilde oluşturmak için bildirim birleştirmeyi kullanır.

Bildirim birleştirme, bir şeyin hem işlev hem de ad alanı (dahili modül) olduğunu söylememizi sağlar:

function f() { }
namespace f {
    export var someValue = 3;
}

Bu, yazmayı korur ve hem f()ve hem de yazmamızı sağlar f.someValue. .d.tsMevcut JavaScript kodu için bir dosya yazarken , şunu kullanın declare:

declare function f(): void;
declare namespace f {
    export var someValue: number;
}

TypeScript'te işlevlere özellik eklemek genellikle kafa karıştırıcı veya beklenmedik bir kalıptır, bu nedenle bundan kaçınmaya çalışın, ancak eski JS kodunu kullanırken veya dönüştürürken gerekli olabilir. Bu, dahili modülleri (ad alanları) harici ile karıştırmanın uygun olacağı tek durumlardan biridir.

Çok basit olduğunu söyleyemem ama kesinlikle mümkün:

interface Optional {
  <T>(value?: T): OptionalMonad<T>;
  empty(): OptionalMonad<any>;
}

const Optional = (<T>(value?: T) => OptionalCreator(value)) as Optional;
Optional.empty = () => OptionalCreator();

merak ettiyseniz, bu benim ana fikrimden, TypeScript / JavaScript sürümünden:Optional

Kısayol olarak, ['özellik'] erişimcisini kullanarak nesne değerini dinamik olarak atayabilirsiniz:

var f = function() { }
f['someValue'] = 3;

Bu, tip kontrolünü atlar. Ancak, mülke kasıtlı olarak aynı şekilde erişmeniz gerektiğinden oldukça güvenlidir:

var val = f.someValue; // This won't work
var val = f['someValue']; // Yeah, I meant to do that

Ancak, gerçekten özellik değerini kontrol etmek istiyorsanız, bu işe yaramayacaktır.

Güncellenmiş bir cevap: Kesişim türlerinin eklenmesinden bu yana, &iki çıkarsanan türü anında "birleştirmek" mümkündür.

İşte bazı nesnelerin özelliklerini okuyan fromve bunları bir nesnenin üzerine kopyalayan genel bir yardımcı onto. Aynı nesneyi döndürür, ontoancak her iki özellik kümesini de içeren yeni bir türle döndürür , bu nedenle çalışma zamanı davranışını doğru bir şekilde açıklar:

function merge<T1, T2>(onto: T1, from: T2): T1 & T2 {
    Object.keys(from).forEach(key => onto[key] = from[key]);
    return onto as T1 & T2;
}

Bu düşük düzeyli yardımcı, hala bir tür iddiası gerçekleştirir, ancak tasarım gereği tür açısından güvenlidir. Bu yardımcı yerinde olduğunda, OP'nin problemini tam tip emniyetle çözmek için kullanabileceğimiz bir operatörümüz var:

interface Foo {
    (message: string): void;
    bar(count: number): void;
}

const foo: Foo = merge(
    (message: string) => console.log(`message is ${message}`), {
        bar(count: number) {
            console.log(`bar was passed ${count}`)
        }
    }
);

TypeScript Playground'da denemek için burayı tıklayın . Tipik olmak için kısıtladığımıza foodikkat edin Foo, bu nedenle sonucunun mergeeksiksiz olması gerekir Foo. Yani adlandırmak eğer barüzere bado zaman bir tür hatası alıyorum.

NB Bununla birlikte, burada hala bir tip delik var. TypeScript, bir tür parametresini "işlev değil" olarak sınırlandırmanın bir yolunu sağlamaz. Böylece kafanız karışabilir ve ikinci argüman olarak işlevinizi iletebilirsiniz mergeve bu işe yaramaz. Dolayısıyla, bu ilan edilebilene kadar, onu çalışma zamanında yakalamalıyız:

function merge<T1, T2>(onto: T1, from: T2): T1 & T2 {
    if (typeof from !== "object" || from instanceof Array) {
        throw new Error("merge: 'from' must be an ordinary object");
    }
    Object.keys(from).forEach(key => onto[key] = from[key]);
    return onto as T1 & T2;
}

Eski soru, ancak TypeScript'in 3.1 ile başlayan sürümleri constiçin, değişkeniniz için bir işlev bildirimi veya anahtar kelime kullandığınız sürece, özellik atamasını düz JS'de yaptığınız gibi yapabilirsiniz :

function f () {}
f.someValue = 3; // fine
const g = function () {};
g.someValue = 3; // also fine
var h = function () {};
h.someValue = 3; // Error: "Property 'someValue' does not exist on type '() => void'"

Referans ve çevrimiçi örnek .

Bu, güçlü yazımdan uzaktır, ancak yapabilirsiniz

var f: any = function() { }
f.someValue = 3;

Bu soruyu bulduğum zamanki gibi baskıcı güçlü yazımın üstesinden gelmeye çalışıyorsanız. Maalesef bu, TypeScript'in mükemmel şekilde geçerli JavaScript'te başarısız olduğu bir durumdur, bu nedenle TypeScript'e geri çekilmesini söylemeniz gerekir.

"JavaScript'iniz tamamen geçerli TypeScript" yanlış olarak değerlendirilir. (Not: 0.95 kullanarak)