DoneJS StealJS jQuery++ FuncUnit DocumentJS
4.3.0
5.0.0 3.13.1 2.3.35
  • About
  • Guides
  • API Docs
  • Community
  • Contributing
  • Bitovi
    • Bitovi.com
    • Blog
    • Design
    • Development
    • Training
    • Open Source
    • About
    • Contact Us
  • About
  • Guides
  • API Docs
    • Observables
      • can-bind
      • can-compute
      • can-debug
      • can-define
      • can-define/list/list
      • can-define/map/map
        • events
          • can.keys
          • propertyName
        • static
          • extend
          • seal
        • prototype
          • assign
          • assignDeep
          • forEach
          • get
          • serialize
          • set
          • update
          • updateDeep
          • *
      • can-define-backup
      • can-define-stream
      • can-define-stream-kefir
      • can-event-queue
      • can-kefir
      • can-list
      • can-map
      • can-map-define
      • can-observation
      • can-observation-recorder
      • can-observe
      • can-simple-map
      • can-simple-observable
      • can-stream
      • can-stream-kefir
      • can-value
    • Data Modeling
      • can-connect
      • can-connect-feathers
      • can-fixture
      • can-fixture-socket
      • can-ndjson-stream
      • can-set
    • Views
      • can-component
      • can-stache
      • can-stache-bindings
      • can-stache-converters
      • can-stache-route-helpers
      • can-view-autorender
      • can-view-callbacks
      • can-view-import
      • can-view-live
      • can-view-model
      • can-view-nodelist
      • can-view-parser
      • can-view-scope
      • can-view-target
      • react-view-model
      • react-view-model/component
      • steal-stache
    • Routing
      • can-deparam
      • can-param
      • can-route
      • can-route-hash
      • can-route-mock
      • can-route-pushstate
    • JS Utilities
      • can-assign
      • can-define-lazy-value
      • can-diff
      • can-globals
      • can-join-uris
      • can-key
      • can-key-tree
      • can-make-map
      • can-parse-uri
      • can-queues
      • can-string
      • can-string-to-any
      • can-util
      • can-zone
      • can-zone-storage
    • DOM Utilities
      • can-ajax
      • can-attribute-encoder
      • can-child-nodes
      • can-control
      • can-dom-data
      • can-dom-events
      • can-dom-mutate
      • can-event-dom-enter
      • can-event-dom-radiochange
      • can-fragment
    • Data Validation
      • can-define-validate-validatejs
      • can-validate
      • can-validate-interface
      • can-validate-legacy
      • can-validate-validatejs
    • Typed Data
      • can-cid
      • can-construct
      • can-construct-super
      • can-data-types
      • can-namespace
      • can-reflect
      • can-reflect-dependencies
      • can-reflect-promise
      • can-types
    • Polyfills
      • can-symbol
      • can-vdom
    • Core
    • Infrastructure
      • can-global
      • can-test-helpers
    • Ecosystem
    • Legacy
  • Community
  • Contributing
  • GitHub
  • Twitter
  • Chat
  • Forum
  • News
Bitovi

extend

  • Edit on GitHub

Define a custom map type.

DefineMap.extend([name,] [static,] prototype)

Extends DefineMap, or constructor functions derived from DefineMap, to create a new constructor function.

import DefineMap from "can-define/map/map";

const Person = DefineMap.extend(
    "Person",
    { seal: true },
    {
        first: "string",
        last: { type: "string" },
        fullName: {
            get: function() {
                return this.first + " " + this.last;
            }
        },
        age: { default: 0 }
    } );

const me = new Person( { first: "Justin", last: "Meyer" } );
me.fullName; //-> "Justin Meyer"
me.age;      //-> 0

Parameters

  1. name {String}:

    Provides an optional name for this type that will show up nicely in debuggers.

  2. static {Object}:

    Static properties that are set directly on the constructor function.

  3. prototype {Object<String,function|PropDefinition>}:

    A definition of the properties or methods on this type.

    If the property definition is a plain function, it's considered a method.

    const Person = DefineMap.extend( {
        sayHi: function() {
            console.log( "hi" );
        }
    } );
    
    const me = new Person();
    me.sayHi();
    

    If the property definition is a string, it's considered a type setting to be looked up in can-define.types.

    const Person = DefineMap.extend( {
        age: "number",
        isCool: "boolean",
        hobbies: "observable"
    } );
    
    const me = new Person( { age: "33", isCool: "false", hobbies: [ "js", "bball" ] } );
    me.age;  //-> 33
    me.isCool; //-> false
    me.hobbies instanceof DefineList; //-> true
    

    If the property definition is a Constructor function, it's considered a Type setting.

    const Address = DefineMap.extend( {
        zip: "number"
    } );
    const Person = DefineMap.extend( {
        address: Address
    } );
    
    const me = new Person( { address: { zip: "60048" } } );
    me.address.zip; //-> 60048
    

    If the property is an object, it's considered to be a PropDefinition.

    const Person = DefineMap.extend( {
        fullName: {
            get: function() {
                return this.first + " " + this.last;
            },
            set: function( newVal ) {
                const parts = newVal.split( " " );
                this.first = parts[ 0 ];
                this.last = parts[ 1 ];
            }
        },
    
        // slick way of creating an 'inline' type.
        address: {
            Type: {
                zip: "number"
            }
        }
    } );
    
    const me = new Person( { fullName: "Rami Myer", address: { zip: "60048" } } );
    me.first;     //-> "Rami"
    me.address.zip; //-> 60048
    

Returns

{can-define/map/map}:

A DefineMap constructor function.

CanJS is part of DoneJS. Created and maintained by the core DoneJS team and Bitovi. Currently 4.3.0.

On this page

Get help

  • Chat with us
  • File an issue
  • Ask questions
  • Read latest news