Updated examples to can-define/list/list. (#377)

Fixes a majority of #370.

* get documentation moved and updated to ES6 and are now codepenable. It was moved to prototype.get.md.

* set documentation moved and updated to ES6 and are now codepenable. It was moved to prototype.set.md.

* Assign documentation moved and updated to ES6 and are now codepenable. It was moved to prototype.assign.md.

* Moved update documentation to prototype.update.md updated examples to es6 and added codepen link.

* assignDeep documentation moved to prototype.assignDeep.md, syntax has also been updated for examples.

* updateDeep docs moved to prototype,updateDeep.md, ES6 syntax and links to codepen.

* Splice documentation moved to docs/prototype.splice.md. Highlighted and ES6'd syntax.

* Removed unnecessary spaing in docs/prototype.splice.md.

* serialize documentation moved to docs/prototype.serialize.md. Added syntax highlighting and updated to ES6 syntax. Example now links to codepen.

* push documentation moved to docs/prototype.push.md. Added syntax highlighting. Updated to ES6.

* Unshift documentation moved to docs/prototype.unshift.md. Examples link to codepen. Syntax highlighting. Updated to ES6.

* removed empty comment block.

* pop documentation moved to docs/prototype.pop.md. Examples have syntax highlighting, are Codepenable and in ES6 syntax.

* shift documentation was moved to docs/prototype.shift.md. Example links to codepen, has syntax highlighting and uses ES6 syntax.

* map documentation moved to docs/prototype.map.md. Example is using es6 syntax and linking to codepen.

* removed empty codeblock

* filter documentation moved to docs/prototype.filter.md. ES6 syntax highlighting, they're codepen-able.

* removed empty codeblock

* reduce documentation moved to docs/prototype.reduce.md. ES6 syntax and codepen-able.

* reduceRight documentation moved to docs/prototype.reduceRight.md. Updated syntax to ES6, provided example for reduceRight.

*  documentation moved to docs/prototype.every.md. Updated syntax to ES6 added syntax highlighting. Links to codepen.

* added imports to prototype.every.md examples

*  documentation moved to docs/prototype.some.md. ES6 syntax, highlighting and corrected the comments.

* indexOf documentation moved to docs/prototype.indexOf.md. Synxax highlighting, ES6 syntax.

* lastIndexOf documentation moved to docs/prototype.lastIndexOf. Added syntax highlighting and updated to ES6. changed IndexOf and lastIndexOf to double quotes to match the rest of the examples.

* join documentation moved to docs/prototype.join.md added syntax highlighting and es6. It's codepenable.

* reverse documentaiton moved to docs/prototype.reverse.md added syntax highlighting and es6. It's codepenable.

* removed semicolon from comments

* slice documentation has been moved to docs/prototype.slice.md. ES6 syntax and highlighting added. Examples are linked to codepen.

* concat documentation moved to docs/prototype.concat.md. Added syntax highlighting and ES6. Removed extra parenthesis from example.

* removed empty block comment

* forEach documentation moved to docs/prototype.forEach.md. Fixed example where it functions properly. ES6 and highlighted syntax. Links to codepen.

* replace documentation moved to docs/prototype.replace.md. examples are highlighted and using ES6 syntax. It's codepenable.

* sort documentation moved to docs/prototype.sort.md. Examples are highlighted and ES6. It's codepenable. Updated example to better relate to similarities across the documentation.

* Codepenable docs in define-list.md, updated to es6 syntax.

* fixes to assign

* up to concat tweeks

* removed unneeded @Body tag

* linting

* Fixed spacing across all prototype files

* Updated to ES6 syntax, Added semi-colons.

* fixed spelling error.

* Updated spacing for most examples to match some sort of cohesive style.

* changed quote to apostrophe

* removed redundant example.

* Added another example showing that justin object is mutated.

* updated events.propertyName.md example.

* example's style is now closer to the rest.

* Added syntax highlighting.

* Updated indexOf docs to note that it returns the index position of the item given

* Added an example if forEach returns false.

* changed reduce to reduce right.

* fixed spacing issues in prototype.concat.md

list/docs/define-list.md

@@ -60,7 +60,7 @@ Example:
 ```js
 const MyList = DefineList.extend( { "#": "string" } );
 
-canReflect.onInstancePatches( MyList, function( instance, patches ) {
+canReflect.onInstancePatches( MyList, ( instance, patches ) => {
 
 } );
 ```
@@ -71,33 +71,43 @@ The `can-define/list/list` module exports a `DefineList` constructor function.
 with `new` to create observable lists that behave very similar to `Array`s.  For example:
 
 ```js
+import { DefineList } from "can";
 const list = new DefineList( [ "a", "b", "c" ] );
-list[ 0 ]; //-> "a";
+console.log(list[ 0 ]); //-> "a";
 
 list.push( "x" );
-list.pop(); //-> "x"
+console.log(list.pop()); //-> "x"
 ```
+@codepen
 
 It can also be extended to define custom observable list types with
 [can-define/list/list.extend].  For example, the following defines a `StringList` type
 where every item is converted to a string by specifying the [can-define/list/list.prototype.wildcardItems items definition] `(#)`:
 
 ```js
+import { DefineList } from "can";
 const StringList = DefineList.extend( {
 	"#": "string"
 } );
 
 const strings = new StringList( [ 1, new Date( 1475370478173 ), false ] );
 
-strings[ 0 ]; //-> "1"
-strings[ 1 ]; //-> "Sat Oct 01 2016 20:07:58 GMT-0500 (CDT)"
-strings[ 2 ]; //-> "false"
+console.log(strings[ 0 ]); //-> "1"
+console.log(strings[ 1 ]); //-> "Sat Oct 01 2016 20:07:58 GMT-0500 (CDT)"
+console.log(strings[ 2 ]); //-> "false"
 ```
+@codepen
 
 Non-numeric properties can also be defined on custom DefineList type.  The following
 defines a `completed` property that returns the completed todos:
 
 ```js
+import { DefineList, DefineMap } from "can";
+
+const Todo = DefineMap.extend("Todo", {
+    complete: { type: "boolean", default: false },
+});
+
 const TodoList = DefineList.extend( {
 	"#": Todo,
 	get completed() {
@@ -106,22 +116,24 @@ const TodoList = DefineList.extend( {
 } );
 
 const todos = new TodoList( [ { complete: true }, { complete: false } ] );
-todos.completed.length; //-> 1
+console.log(todos.completed.length); //-> 1
 ```
+@codepen
 
 Finally, DefineList instances are observable, so you can use the [can-event-queue/map/map]
 methods to listen to its [can-define/list/list/AddEvent],
 [can-define/list/list/LengthEvent], [can-define/list/list/RemoveEvent],
 and [can-define/list/list/PropertyNameEvent] events:
 
 ```js
+import { DefineList } from "can";
 const people = new DefineList( [ "alice", "bob", "eve" ] );
 
-people.on( "add", function( ev, items, index ) {
+people.on( "add", ( ev, items, index ) => {
 	console.log( "add", items, index );
-} ).on( "remove", function( ev, items, index ) {
+} ).on( "remove", ( ev, items, index ) => {
 	console.log( "remove", items, index );
-} ).on( "length", function( ev, newVal, oldVal ) {
+} ).on( "length", ( ev, newVal, oldVal ) => {
 	console.log( "length", newVal, oldVal );
 } );
 
@@ -131,6 +143,7 @@ people.pop(); // remove ["eve"] 2
 people.unshift( "Xerxes" ); // add ["Xerxes"] 1
 // length 3 2
 ```
+@codepen
 
 __NOTE:__ Only changes made to indexed values using the list's `set` method will dispatch change events.
 👍  `defineList.set(0, 'newValue'); // will dispatch event`

list/docs/events.add.md

@@ -5,12 +5,12 @@ Event fired when items are added to the list.
 
 @signature `handler(event, added, index)`
 
-Handlers registered with [can-event-queue/map/map] methods on `list` will be called back when
-items are added to a list.
+  Handlers registered with [can-event-queue/map/map] methods on `list` will be called back when
+  items are added to a list.
 
-```
-list.on("add", function(event, added, index){ ... });
-```
+  ```js
+  list.on("add", function(event, added, index){ ... });
+  ```
 
   @param {Event} event An event object.
   @param {Array} added An array of the items added to the list.

list/docs/events.length.md

@@ -5,15 +5,15 @@ Event fired when items are added or removed from the list.
 
 @signature `handler(event, length)`
 
-Handlers registered on "length" events will be called
-back as follows.
+  Handlers registered on "length" events will be called
+  back as follows.
 
-```
-list.on("length", function(event, length){ ... });
-```
+  ```js
+  list.on("length", function(event, length){ ... });
+  ```
 
-It's possible that the length was not changed, but an item was [can-define/list/list::set] on the list.
-In this case, a `length` event will still be fired.
+  It's possible that the length was not changed, but an item was [can-define/list/list::set] on the list.
+  In this case, a `length` event will still be fired.
 
   @param {Event} event An event object.
   @param {Number} length The new length of the list.

list/docs/events.propertyName.md

@@ -5,18 +5,22 @@ Event fired when a property on the list changes values.
 
 @signature `handler(event, newValue, oldValue)`
 
-Handlers registered on `propertyName` events will be called
-back as follows.
+  Handlers registered on `propertyName` events will be called
+  back as follows.
 
-```
-list.set("totalCount", 500);
-list.on("totalCount", function(event, newVal, oldVal){
-  newVal //-> 5
-  oldVal //-> 500
-});
-list.set("totalCount", 5);
-```
+  ```js
+  import {DefineList} from "can";
 
+  const list = new DefineList();
+  list.set("totalCount", 500);
+
+  list.on("totalCount", (event, newVal, oldVal) => {
+    console.log(newVal); //-> 5
+    console.log(oldVal); //-> 500
+  });
+  list.set("totalCount", 5);
+  ```
+  @codepen
 
   @param {Event} event An event object.
   @param {*} newVal The new value of the `propertyName` property.

list/docs/prototype.assign.md

@@ -0,0 +1,37 @@
+@function can-define/list/list.prototype.assign assign
+@parent can-define/list/list.prototype
+
+Sets values within a list or properties on a list.
+
+@signature `list.assign(newItems)`
+
+  If `newItems` [can-reflect.isListLike is list like] the values in `newItems` will replace the indexed value in the `list`.  For example:
+
+  ```js
+  import { DefineList } from "can";
+
+  const list = new DefineList(["A","B"]);
+
+  list.assign( ["a"] );
+  console.log( list.serialize() ); //-> ["a","B"]
+  ```
+  @codepen
+
+  > NOTICE: `.assign()` will not remove properties in the list that have indexes
+  greater than or equal to the `newItem`'s length.  Use [can-define/list/list.prototype.update .update()] to replace all of a list's values.
+
+  If `newItems` is an object, the object's properties will be added as properties to
+  the `list`.  For example:
+
+  ```js
+  import { DefineList } from "can";
+
+  const list = new DefineList(["A","B"]);
+
+  list.assign( {count: 1000, skip: 2} );
+  console.log( list.count ); //-> 1000
+  ```
+  @codepen
+
+  @param {Array|Object} newItems A list or array of values, or an object of properties.
+  @return {can-define/list/list} The list instance.

list/docs/prototype.assignDeep.md

@@ -0,0 +1,38 @@
+@function can-define/list/list.prototype.assignDeep assignDeep
+@parent can-define/list/list.prototype
+
+Recursively sets values within a list or properties on a list.
+
+@signature `list.assignDeep(newItems)`
+
+  Similar to [can-define/list/list.prototype.assign .assign()], `.assignDeep()` will
+  overwrite values within `list` with values from `newItems`.  Where `assign()` will replace
+  values or properties one level deep, `.assignDeep()` will overwrite values or
+  properties on objects and lists recursively.
+
+  For example, the following only assigns `justin`'s `age` to 36:
+
+  ```js
+  import { DefineMap, DefineList } from "can";
+
+  const justin = new DefineMap({name: "Justin", age: 35}),
+        payal = new DefineMap({name: "Payal", age: 35});
+
+  const people = new DefineList([justin, payal]);
+
+  people.assignDeep([
+  	{age: 36}
+  ]);
+
+  console.log(people.serialize()) //-> [
+  //   {name: "Justin", age: 36},
+  //   {name: "Payal", age: 35}
+  // ]
+  ```
+  @codepen
+
+
+  @param {Array|Object} newItems A list or array of values, or an object of property values.
+  If an object is passed, the properties of the list will be assigned with the values
+  in  `newItems`.
+  @return {can-define/list/list} The list instance.

list/docs/prototype.concat.md

@@ -0,0 +1,31 @@
+@function can-define/list/list.prototype.concat concat
+@parent can-define/list/list.prototype
+
+@description Merge many collections together into a DefineList.
+@signature `list.concat(...listN)`
+
+  Returns a `DefineList` with the `list`'s items merged with the Arrays and lists
+  passed as arguments.
+
+  ```js
+  import {DefineList} from "can";
+
+  const list = new DefineList(["a","b"]);
+
+  const result = list.concat(
+  	[1,2],
+  	new DefineList(["X","Y"]),
+	{value: "Z"}
+  );
+
+  console.log( result.serialize() );
+  //-> ["a", "b", 1, 2, "X", "Y", {value: "Z"}]
+  ```
+  @codepen
+
+  @param {Array|can-define/list/list|} listN Any number of arrays, Lists, or values to add in
+  For each parameter given, if it is an Array or a DefineList, each of its elements will be   added to
+  the end of the concatenated DefineList. Otherwise, the parameter itself will be added.
+
+  @return {can-define/list/list} A DefineList of the same type.
+

list/docs/prototype.every.md

@@ -0,0 +1,57 @@
+@function can-define/list/list.prototype.every every
+@parent can-define/list/list.prototype
+
+Return true if every item in a list matches a predicate.
+
+@signature `list.every( callback [,thisArg] )`
+
+  Tests each item in `list` by calling `callback` on it.  If `callback` returns truthy for every 
+  element in `list`, `every` returns `true`.
+
+  ```js
+  import { DefineList } from "can";
+
+  const names = new DefineList(["alice","adam","zack","zeffer"]);
+
+  const aNames = names.every((name) => {
+    return name[0] === "a";
+  });
+
+  console.log(aNames); //-> false
+  ```
+  @codepen
+
+  @param  {function(*, Number, can-define/list/list)} callback(item, index, list) A
+  function to call with each element of the DefineList. The three parameters that callback gets passed are:
+   - item (*) - the element at index.
+   - index (Integer) - the index of the current element of the list.
+   - list (DefineList) - the `DefineList` the elements are coming from.
+
+  If `callback` returns a truthy result, `every` will evaluate the callback on the next element.  Otherwise, `every`
+  will return `false`.
+
+  @param  {Object}  thisArg  What `this` should be in the `callback`.
+  @return {Boolean} `true` if calling the callback on every element in `list` returns a truthy value, `false` otherwise.
+
+@signature `list.every( props )`
+
+  Tests each item in `list` by comparing its properties to `props`.  If `props` match for every element in
+  `list`, `every` returns `true`.
+
+  ```js
+  import {DefineList} from "can";
+
+  const todos = new DefineList([
+      {name: "dishes", complete: false},
+      {name: "lawn", complete: true}
+  ]);
+
+  const complete = todos.every({complete: true});
+
+  console.log(complete); //-> false
+  ```
+  @codepen
+
+  @param  {Object}  props An object of key-value properties.  Each key and value in
+  `props` must be present on an `item` for the `item` to match.
+  @return {Boolean} `true` if every element in `list` matches `props`, `false` otherwise.

list/docs/prototype.filter.md

@@ -0,0 +1,52 @@
+@function can-define/list/list.prototype.filter filter
+@parent can-define/list/list.prototype
+
+Filter a list to a new list of the matched items.
+
+@signature `list.filter( callback [,thisArg] )`
+
+  Filters `list` based on the return value of `callback`.
+
+  ```js
+  import{DefineList} from "can";
+
+  const names = new DefineList(["alice","adam","zack","zeffer"]);
+
+  const aNames = names.filter((name) => {
+      return name[0] === "a";
+  });
+
+  console.log(aNames.get()); //-> ["alice","adam"]
+  ```
+  @codepen
+
+  @param  {function(*, Number, can-define/list/list)} callback(item, index, list) A
+  function to call with each element of the DefineList. The three parameters that callback gets passed are:
+   - item (*) - the element at index.
+   - index (Integer) - the index of the current element of the list.
+   - list (DefineList) - the `DefineList` the elements are coming from.
+
+  If `callback` returns a truthy result, `item` will be added to the result.  Otherwise, the `item` will be
+  excluded.
+
+  @param  {Object}  thisArg  What `this` should be in the `callback`.
+  @return {can-define/list/list} A new instance of this `DefineList` (may be a subclass), containing the items that passed the filter.
+
+@signature `list.filter( props )`
+
+  Filters items in `list` based on the property values in `props`.
+
+  ```js
+  import { DefineList } from "can";
+  const todos = new DefineList([
+      {name: "dishes", complete: false},
+      {name: "lawn", complete: true}
+  ]);
+  const complete = todos.filter({complete: true});
+  console.log(complete.get()); //-> [{name: "lawn", complete: true}]
+  ```
+  @codepen
+
+  @param  {Object}  props An object of key-value properties.  Each key and value in
+  `props` must be present on an `item` for the `item` to be in the returned list.
+  @return {can-define/list/list} A new `DefineList` of the same type.