What is the @ used for in JavaScript?

Question

I'm reading through the MobX docs and I'm confused by the following code:

class Todo {
    id = Math.random();
    @observable title = "";
    @observable finished = false;
}

@observer
class TodoListView extends Component {
    render() {
        return <div>
            <ul>
                {this.props.todoList.todos.map(todo =>
                    <TodoView todo={todo} key={todo.id} />
                )}
            </ul>
            Tasks left: {this.props.todoList.unfinishedTodoCount}
        </div>
    }
}

What is the significance of the @ symbol?

Answer 1

It's called a decorator, you can read all about it here:

https://github.com/wycats/javascript-decorators

A decorator is:

• an expression that evaluates to a function that takes the target, name, and decorator descriptor as arguments and optionally returns a decorator descriptor to install on the target object