GitHub
Twittertype
Specify a type for the property.
PrimitiveFunction
Sets the type to a primitive constructor function. Valid primitive constructors includes String, Number, and Boolean.
If the value provided for this property is of another type, or is null or undefined, it will throw.
import { ObservableObject } from "can/everything";
class Person extends ObservableObject {
static props = {
age: {
type: Number
}
};
}
const p = new Person({ age: 5 });
console.log( p.age ) //-> 5
const p2 = new Person({ age: "5" }); //throws
Parameters
- PrimitiveFunction
{function}:A primitive constructor function.
ConstructorFunction
Sets the type to a constructor function.
If the value provided for this property is of another type, or is null or undefined, it will throw.
import { ObservableObject } from "can/everything";
class Person extends ObservableObject {
static props = {
birthday: {
type: Date
}
};
}
const p = new Person({ birthday: new Date(1970, 2, 3) });
console.log( p.age ) //-> 5
const p2 = new Person({ birthday: "2/3/1970" }); //throws
Parameters
- ConstructorFunction
{function}:Any constructor function.
TypeObject
Defines a type that conforms to the TypeObject API: an object with a can.new and can.isMember symbol.
For example here is an inline TypeObject that behaves like type.convert(Date):
import { ObservableObject } from "can/everything";
class Person extends ObservableObject {
static props = {
birthday: {
type: {
[Symbol.for("can.new")](value) {
return new Date(value);
},
[Symbol.for("can.isMember")](value) {
return (value instanceof Date);
}
}
}
};
}
Use
The type property specifies the type of the attribute. The type can be specified
as either:
- A primitive constructor function.
- A built-in constructor function like
Date. - A constructor function such as another ObservableObject.
- A TypeObject.
Basic Example
The following example converts the count property to a number and the items property to an array.
import { ObservableObject, type } from "can";
const ArrayType = {
[Symbol.for("can.new")]( newValue ) {
if ( typeof newValue === "string" ) {
return newValue.split( "," );
} else if ( Array.isArray( newValue ) ) {
return newValue;
}
},
[Symbol.for("can.isMember")]( value ) {
return Array.isArray(value);
}
};
class Map extends ObservableObject {
static props = {
count: {
type: Number
},
items: {
type: ArrayType
}
};
}
const map = new Map({ count: "4", items: "1,2,3" });
console.log(map.count, map.items); //-> 4 ["1", "2", "3"]
Shorthand
The Property docs specify shorthands for setting the type. The shorthand allows you to define the type without using a DefinitionObject like so:
import { ObservableObject } from "can/everything";
class Person extends ObservableObject {
age: Number
}
Use with can-type
can-type provides convenient ways to use types with a variety of behaviors like type checking and converting. You can use these with the Property shorthand like so:
import { ObservableObject, type } from "can/everything";
class Person extends ObservableObject {
age: type.convert(Number)
}