rafagarcia

While attempting to explain JavaScript's reduce method on arrays, conceptually, I came up with the following - hopefully it's helpful; happy to tweak it if anyone has suggestions.

Intro

JavaScript Arrays have lots of built in methods on their prototype. Some of them mutate - ie, they change the underlying array in-place. Luckily, most of them do not - they instead return an entirely distinct array. Since arrays are conceptually a contiguous list of items, it helps code clarity and maintainability a lot to be able to operate on them in a "functional" way. (I'll also insist on referring to an array as a "list" - although in some languages, List is a native data type, in JS and this post, I'm referring to the concept. Everywhere I use the word "list" you can assume I'm talking about a JS Array) This means, to perform a single operation on the list as a whole ("atomically"), and to return a new list - thus making it much simpler to think about both the old list and the new one, what they contain, and

Enlaces de Flexbox que molan

	<!doctype html>
	<html>
	<head>
	<title>polymaiap-loader demo</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
	<script src="../../webcomponentsjs/webcomponents-lite.js"></script>

	<link rel="import" href="../../iron-demo-helpers/demo-pages-shared-styles.html">
	<link rel="import" href="../../iron-demo-helpers/demo-snippet.html">

	{
	"name": "Polymaiap",
	"authors": [
	"Rafael García"
	],
	"version": "1.0.0",
	"private": true,
	"dependencies": {
	"polymaiap-loader": "https://github.com/rafagarcia/polymaiap-loader.git#develop",
	"app-layout": "PolymerElements/app-layout#^0.10.0",

	<script>
	Polymer({
	is: 'polymaiap-list',

	properties: {
	data: {
	type: Object,
	observer: '_handleResponse'
	},

	<iron-list items="[[data]]" selected-item="{{selectedItem}}" as="item" selection-enabled>
	<template>
	<!-- Good candidate to be converted into a component -->
	<div class="item" tabindex$="[[index]]">
	<img src$="[[item.image]]" alt$="[[item.firstName]] [[item.lastName]]" />
	<span class="item__name">[[item.firstName]] [[item.lastName]]</span>
	<span class="item__link">View employee ></span>
	</div>
	</template>
	</iron-list>

	<!--
	@license
	Copyright (c) 2016 The Polymer Project Authors. All rights reserved.
	This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
	The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
	The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
	Code distributed by Google as part of the polymer project is also
	subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
	-->


	{
	"index": 0,
	"firstName": "Ignacio",
	"lastName": "Cimadevilla",
	"image": "https://s3.amazonaws.com/uifaces/faces/twitter/enda/73.jpg",
	"position": "Animation architect"
	},
	{
	"index": 1,