Thursday, June 30, 2016

JavaScript Array - 2+ hour study

June 30, 2016

Work on JavaScript Array - Design a drill to understand JavaScript Array, and learn some API design.

Target:
Memorize all 29 API, be able to write down API function syntax, understand why, how for each API.


Each practice takes 20 minutes:
10 minutes to remember Array properties.
10 minutes to remember Array 29 APIs.

Prepare the study content first and document the experience:

1. PROPERTY:
3 properties:
constructor,
length
prototype

constructor property:
https://msdn.microsoft.com/en-us/library/jj155291(v=vs.94).aspx

length:
array is sparse, so the array is not contiguous. The length is not necessarily the number of elements in the array.
https://msdn.microsoft.com/en-us/library/d8ez24f2(v=vs.94).aspx

Prototype:
https://msdn.microsoft.com/en-us/library/jj155285(v=vs.94).aspx

2. JavaScript array 29 methods:

Spend 10 minutes a time to remember all the function names,
Spend 10 minutes to guess each API's functionality, and details about arguments, how it is designed. 
Spend 10 minutes reading/ practice/ ask questions. 
Repeat the process. 

https://msdn.microsoft.com/en-us/library/k4h76zbx(v=vs.94).aspx

write down my guess:  (June 30, 2016 - too honest here! Will improve JavaScript knowledge, learn design!)
Array.from   - copy array from, input argument is array.
isArray      - Array.isArray(arr)  input argument arr is array
of           - ? wild guess -
concat       - arr1.concat(arr2), concatenate the string
entries      - entries  - arguments: startIndex, endIndex, return subarray?

Discussion:
Array.from study
two concepts: 
1. array-like object, an iterable object. 

Array.from 
syntax: Array.from(arrayLike[,mapfn [,thisArg]]); 

Array-like object:
http://stackoverflow.com/questions/11886578/creating-array-like-objects-in-javascript

Iterable object:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Iterators_and_Generators

JavaScript String, Array, TypedArray, Map and Set are all built-in iterables.

Read JavaScript Map
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map

Detail see the blog: 
http://juliachencoding.blogspot.ca/2016/06/javascript-arrayof-function-study.html

every        - iterator - go through each node in the array to check some logic?
fill         - fill - arr.fill(1), all the elements in the array are assigned to the same value
filter   
findIndex
foreach

indexof
join
keys
lastIndexOf
map

pop
push
reduce
reduceRight
reverse

shift
slice
some
sort
splice

toString
unshift
valueOf
values

challenges:
  Arguments:
  callback function -  
  callback function syntax

  3 things Julia likes the JavaScript Array.fill function design:
   - start, end arguments are options
   - negative start, end arguments handling

Questions:
1. Why JavaScript Array API is designed so differently? need to learn more about functional programming? 


Reference: 
Previous blog: 
Array 
http://juliachencoding.blogspot.ca/2016/06/array-class-c-c-javascript-java.html

Array-like object:
http://stackoverflow.com/questions/11886578/creating-array-like-objects-in-javascript

Iterable object:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Iterators_and_Generators

No comments:

Post a Comment