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
      • 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
        • types
          • makeStream
          • StreamImplementation
          • streamInterface
            • toCompute
            • toStream
            • toStreamFromEvent
            • toStreamFromProperty
      • 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

toStream

  • Edit on GitHub

Provides a shorthand for creating a stream from observable objects, properties and events.

canStream.toStream( observable, propAndOrEvent )

Creates a stream from a can-compute compute or an observable. This stream gets updated whenever the observable value changes.

import compute from "can-compute";
import canStreamKefir from "can-stream-kefir";
import canStream from "can-stream";
const canStreaming = canStream( canStreamKefir );

const c1 = compute( 0 );

const resultCompute = canStreaming.toStream( c1 );

resultCompute.onValue( function( val ) {
  console.log( val );
} );

c1( 1 );

Parameters

  1. compute {can-compute}:

    A compute whose value will be the stream values.

Returns

{Stream}:

A stream object.

canStream.toStream( observable, "eventName" )

Creates an event stream with the event objects dispatched on obs for eventName. This is a shorthand for [can-stream.toStreamFromEvent].

import DefineList from "can-define/list/list";
import canStreamKefir from "can-stream-kefir";
import canStream from "can-stream";
const canStreaming = canStream( canStreamKefir );

const hobbies = new DefineList( [ "js", "kayaking" ] );

const changeCount = canStreaming.toStream( hobbies, "length" ).scan( function( prev ) {
  return prev + 1;
}, 0 );
changeCount.onValue( function( event ) {
  console.log( event );
} );

hobbies.push( "bball" );

//-> console.logs {type: "add", args: [2,["bball"]]}
hobbies.shift();

//-> console.logs {type: "remove", args: [0,["js"]]}

Parameters

  1. observable {Observable}:

    An observable object like a can-define/map/map. Promises can work too.

  2. eventName {String}:

    An observable event name.

Returns

{String}:

A stream make up of the event objects dispatched on obs.

canStream.toStream( observable, ".propName" )

Creates a stream from an observable property value. This is a shorthand for [can-stream.toStreamFromProperty].

import canStreamKefir from "can-stream-kefir";
import canStream from "can-stream";
const canStreaming = canStream( canStreamKefir );

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

const person = new DefineMap( {
  first: "Justin",
  last: "Meyer"
} );

const first = canStreaming.toStream( person, ".first" );
const last = canStreaming.toStream( person, ".last" );

const fullName = Kefir.combine( first, last, function( first, last ) {
  return first + last;
} );

fullName.onValue( function( newVal ) {
  console.log( newVal );
} );

map.first = "Payal";

//-> console.logs "Payal Meyer"

Create a stream based on a event on an observable property.

Parameters

  1. obs {Observable}:

    An observable object like a can-define/map/map. Promises can work too.

  2. propName {String}:

    A property name. Multiple property names can be provided like ".foo.bar.car"

Returns

{String}:

A stream of values at the specified propName.

canStream.toStream( obs, ".propName eventName" )

Creates a stream from an observable property value. This is a shorthand for the second signature of [can-stream.toStreamFromEvent].

import canStreamKefir from "can-stream-kefir";
import canStream from "can-stream";
const canStreaming = canStream( canStreamKefir );

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

const me = new DefineMap( {
  todos: [ "mow lawn" ]
} );

const addStream = canStreaming.toStream( me, ".todos add" );

addStream.onValue( function( event ) {
  console.log( event );
} );

map.todos.push( "do dishes" );

//-> console.logs {type: "add", args: [1,["do dishes"]]}

Create a stream based on a event on an observable property.

Parameters

  1. obs {Observable}:

    An observable object like a can-define/map/map. Promises can work too.

  2. propName {String}:

    A property name. Multiple property names can be provided like ".foo.bar.car"

  3. eventName {String}:

    An observable event name.

Returns

{String}:

A stream of the eventName event objects dispatched on the objects specified by propName.

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