# Javascript in one pic

[ Languages: [English](README.md), [中文](README-zh.md), [正體中文](README-zh_TW.md), [Português](README-pt_BR.md), [Español](README-es_MX.md) ]

<!-- BADGES/ -->

[![Gitter chat button](https://img.shields.io/badge/gitter-Join%20Chat-brightgreen.svg)](https://gitter.im/coodict/javascript-in-one-pic)
[![BitCoin donate button](https://img.shields.io/badge/bitcoin-donate-yellow.svg)](https://www.coinbase.com/rainyear)

<!-- /BADGES -->

## Online version

[Online Mindmap](http://coodict.github.io/javascript-in-one-pic/)

### TODO

- [ ] Syntax highlight

## Color notes

![not recommended](https://img.shields.io/badge/%237E1600-not%20recommended-7E1600.svg)
![important](https://img.shields.io/badge/%234E8D20-important-4E8D20.svg)
![warning](https://img.shields.io/badge/%23DE2B00-warning-DE2B00.svg)

## Preview

![js in one pic](js%20in%20one%20pic.png)

## About this project

The original intent of this project was to note down the syntax and basic concepts of Javascript for personal use, also used as a syllabus for teaching at the same time. The effectiveness of using a [Mind map](https://en.wikipedia.org/wiki/Mind_map) diagram to summarize a programming language is totally unexpected, it looks like a catalogue of handbook talking about Javascript and filled with syntax details. With a single picture/file, Javascript programmers can not only have a overview of the whole picture of this language, but also could locate to practical syntax examples ASAP.

The original mindmap diagram is drawn with [Mindnode](https://mindnode.com/) and exported to PDF/PNG/OPML files along with a `*.mm` file which can be edited with [FreeMind](http://freemind.sourceforge.net), another SVG file will be released after the whole project is finished([issues #9](https://github.com/coodict/javascript-in-one-pic/issues/9)).

In addition to Javascript, Python3 & Golang versions are on the way! If you find this project helpful, please consider making a donation with [bitcoin](https://www.coinbase.com/rainyear) or [other way](https://github.com/rainyear/lolita/wiki/Donation) :beers:

## Related projects

* [Python3 in one pic](https://github.com/coodict/python3-in-one-pic)
* Go in one pic (in preparation)

## TODO

- [X] Function(basic) - inside function: arguments, return;
- [X] Function - as value: callback;
- [X] Function - methods: apply/call/bind;
- [X] Array - methods: map/reduce;
- [X] Object(OOP) - constructor, properties;
- [X] Object(OOP) - inheritance;
- [X] Scope;
- [X] Function - closures;
- [ ] Operators - bitwise;
- [X] Flow control - try/catch;
- [ ] ES6;

## References

1. [Professional JavaScript for Web Developers](http://www.amazon.cn/gp/offer-listing/1118026691/ref=tmm_pap_new_olp_sr?ie=UTF8&condition=new&sr=&qid=)
2. [JavaScript Garden](http://bonsaiden.github.io/JavaScript-Garden/)
3. [JavaScript | MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript)
4. [图解Javascript上下文与作用域](http://blog.rainy.im/2015/07/04/scope-chain-and-prototype-chain-in-js/)

## License
See the [LICENSE](LICENSE) file for license rights and limitations (MIT).