> [Wiki](Home) ▸ [[API Reference|API-Reference]] ▸ **List**
# List
> data-binding on arrays
Access it with:
```javascript
const { List } = Neft;
```
> [`Source`](/Neft-io/neft/blob/e79ebc2b61607e795a53c22d1577605addf00689/src/list/index.litcoffee)
## Table of contents
* [List](#list)
* [**Class** List](#class-list)
* [constructor](#constructor)
* [onChange](#onchange)
* [onInsert](#oninsert)
* [onPop](#onpop)
* [length](#length)
* [set](#set)
* [append](#append)
* [insert](#insert)
* [extend](#extend)
* [remove](#remove)
* [pop](#pop)
* [clear](#clear)
* [index](#index)
* [has](#has)
* [toArray](#toarray)
* [Glossary](#glossary)
# **Class** List
> [`Source`](/Neft-io/neft/blob/e79ebc2b61607e795a53c22d1577605addf00689/src/list/index.litcoffee)
##constructor
- Syntax
List::constructor([*Array* data])- Prototype method of
- List
- Parameters
Creates a new list instance.
```javascript
var list = new List([1, 2]);
list instanceof List; // true
```
> [`Source`](/Neft-io/neft/blob/e79ebc2b61607e795a53c22d1577605addf00689/src/list/index.litcoffee#listconstructorarray-data)
##onChange
- Syntax
*Signal* List::onChange(*Any* oldValue, *Integer* index)- Prototype method of
- List
- Parameters
- Type
- Signal
Signal called on each value change.
> [`Source`](/Neft-io/neft/blob/e79ebc2b61607e795a53c22d1577605addf00689/src/list/index.litcoffee#signal-listonchangeany-oldvalue-integer-index)
##onInsert
- Syntax
*Signal* List::onInsert(*Any* value, *Integer* index)- Prototype method of
- List
- Parameters
- Type
- Signal
Signal called when a value was added.
> [`Source`](/Neft-io/neft/blob/e79ebc2b61607e795a53c22d1577605addf00689/src/list/index.litcoffee#signal-listoninsertany-value-integer-index)
##onPop
- Syntax
*Signal* List::onPop(*Any* oldValue, *Integer* index)- Prototype method of
- List
- Parameters
- Type
- Signal
Signal called when a value was removed.
> [`Source`](/Neft-io/neft/blob/e79ebc2b61607e795a53c22d1577605addf00689/src/list/index.litcoffee#signal-listonpopany-oldvalue-integer-index)
##length
- Syntax
ReadOnly *Integer* List::length- Prototype property of
- List
- Type
- Integer
- Read Only
Amount of values stored in the list.
```javascript
var list = new List(['a', 'b']);
list.length; // 2
```
##set
- Syntax
*Any* List::set(*Integer* index, *Any* value)- Prototype method of
- List
- Parameters
- Returns
- Any
Sets the given value under the given index.
The index must exists in the list.
The value can't be an `undefined`. Use `pop()` instead.
Calls `onChange()` signal.
```javascript
var types = new List(['fantasy', 'Thriller']);
types.onChange.connect(function(oldVal, i){
console.log("element "+oldVal+" changed to "+this[i]);
});
types.set(0, 'Fantasy');
// element fantasy changed to Fantasy
types.set(0, 'Fantasy');
// nothing changed ...
```
> [`Source`](/Neft-io/neft/blob/e79ebc2b61607e795a53c22d1577605addf00689/src/list/index.litcoffee#any-listsetinteger-index-any-value)
##append
- Syntax
*Any* List::append(*Any* value)- Prototype method of
- List
- Parameters
- Returns
- Any
Adds the given value on the end on the list.
The value can't be an `undefined`.
Calls `onInsert()` signal.
```javascript
var fridge = new List(['apple', 'milk']);
fridge.onInsert.connect(function(val, i){
console.log(val+" appended!");
});
fridge.append('cheese');
// cheese appended!
console.log(fridge.items());
// apple, milk, cheese
```
> [`Source`](/Neft-io/neft/blob/e79ebc2b61607e795a53c22d1577605addf00689/src/list/index.litcoffee#any-listappendany-value)
##insert
- Syntax
*Any* List::insert(*Integer* index, *Any* value)- Prototype method of
- List
- Parameters
- Returns
- Any
Add the given value under the given index.
The index can't be greater than the list length.
The value can't be an `undefined`.
Calls `onInsert()` signal.
```javascript
var list = new List(['a', 'b']);
list.onInsert.connect(function(val, i){
console.log("new element "+val+" inserted at index "+i);
});
list.insert(1, 'c');
// new element c inserted at index 1
console.log(list.items());
// ['a', 'c', 'b']
```
> [`Source`](/Neft-io/neft/blob/e79ebc2b61607e795a53c22d1577605addf00689/src/list/index.litcoffee#any-listinsertinteger-index-any-value)
##extend
- Syntax
*List* List::extend(*Object* items)- Prototype method of
- List
- Parameters
- Returns
- List
Appends all values stored in the given items into the list.
Calls `onInsert()` signal for each value.
> [`Source`](/Neft-io/neft/blob/e79ebc2b61607e795a53c22d1577605addf00689/src/list/index.litcoffee#list-listextendobject-items)
##remove
- Syntax
*Any* List::remove(*Any* value)- Prototype method of
- List
- Parameters
- Returns
- Any
Removes the given value from the list.
Calls `onPop()` signal.
```javascript
var list = new List(['a', 'b']);
list[1]; // b
list.remove('b');
list[1]; // undefined
list; // ['a']
```
> [`Source`](/Neft-io/neft/blob/e79ebc2b61607e795a53c22d1577605addf00689/src/list/index.litcoffee#any-listremoveany-value)
##pop
- Syntax
*Any* List::pop([*Integer* index])- Prototype method of
- List
- Parameters
- Returns
- Any
Removes the value stored in the list under the given index.
The index must exists in the list.
Calls `onPop()` signal.
```javascript
var list = new List(['a', 'b']);
list[1]; // b
list.pop(1);
list[1]; // undefined
list; // ['a']
```
> [`Source`](/Neft-io/neft/blob/e79ebc2b61607e795a53c22d1577605addf00689/src/list/index.litcoffee#any-listpopinteger-index)
##clear
- Syntax
List::clear()- Prototype method of
- List
Removes all values stored in the list.
Calls `onPop()` signal for each value.
```javascript
var list = new List(['a', 'b']);
list.onPop.connect(function(oldVal, i){
console.log("Element "+oldVal+" popped!");
});
console.log(list.items());
// ['a', 'b']
list.clear()
// Element b popped!
// Element a popped!
console.log(list);
// []
```
> [`Source`](/Neft-io/neft/blob/e79ebc2b61607e795a53c22d1577605addf00689/src/list/index.litcoffee#listclear)
##index
- Syntax
*Integer* List::index(*Any* value)- Prototype method of
- List
- Parameters
- Returns
- Integer
Returns the given value index in the list.
Returns `-1` if the value doesn't exist in the list.
```javascript
var list = new List(['a', 'b']);
list.index('b'); // 1
list.index('c'); // -1
```
> [`Source`](/Neft-io/neft/blob/e79ebc2b61607e795a53c22d1577605addf00689/src/list/index.litcoffee#integer-listindexany-value)
##has
- Syntax
*Boolean* List::has(*Any* value)- Prototype method of
- List
- Parameters
- Returns
- Boolean
Returns `true` if the given value exists in the list.
```javascript
var list = new List(['a', 'b']);
list.has('a'); // true
list.has('ab123'); // false
```
> [`Source`](/Neft-io/neft/blob/e79ebc2b61607e795a53c22d1577605addf00689/src/list/index.litcoffee#boolean-listhasany-value)
##toArray
- Syntax
*Array* List::toArray()- Prototype method of
- List
- Returns
- Array
> [`Source`](/Neft-io/neft/blob/e79ebc2b61607e795a53c22d1577605addf00689/src/list/index.litcoffee#array-listtoarray)
# Glossary
- [List](#class-list)