Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Data Types: Arrays and Objects
Search
John Nunemaker
PRO
September 08, 2009
Programming
0
11
Data Types: Arrays and Objects
John Nunemaker
PRO
September 08, 2009
Tweet
Share
More Decks by John Nunemaker
See All by John Nunemaker
Atom
jnunemaker
PRO
10
4.3k
MongoDB for Analytics
jnunemaker
PRO
11
930
Addicted to Stable
jnunemaker
PRO
32
2.6k
MongoDB for Analytics
jnunemaker
PRO
21
2.3k
MongoDB for Analytics
jnunemaker
PRO
16
30k
Why You Should Never Use an ORM
jnunemaker
PRO
58
9.4k
Why NoSQL?
jnunemaker
PRO
10
940
Don't Repeat Yourself, Repeat Others
jnunemaker
PRO
7
3.5k
I Have No Talent
jnunemaker
PRO
14
970
Other Decks in Programming
See All in Programming
Startups on Rails in Past, Present and Future–Irina Nazarova, RailsConf 2025
irinanazarova
0
100
Railsアプリケーションと パフォーマンスチューニング ー 秒間5万リクエストの モバイルオーダーシステムを支える事例 ー Rubyセミナー 大阪
falcon8823
5
1.1k
すべてのコンテキストを、 ユーザー価値に変える
applism118
3
1.3k
Systèmes distribués, pour le meilleur et pour le pire - BreizhCamp 2025 - Conférence
slecache
0
120
MDN Web Docs に日本語翻訳でコントリビュートしたくなる
ohmori_yusuke
1
120
AIと”コードの評価関数”を共有する / Share the "code evaluation function" with AI
euglena1215
1
160
High-Level Programming Languages in AI Era -Human Thought and Mind-
hayat01sh1da
PRO
0
770
ニーリーにおけるプロダクトエンジニア
nealle
0
830
テストから始めるAgentic Coding 〜Claude Codeと共に行うTDD〜 / Agentic Coding starts with testing
rkaga
12
4.4k
LT 2025-06-30: プロダクトエンジニアの役割
yamamotok
0
760
第9回 情シス転職ミートアップ 株式会社IVRy(アイブリー)の紹介
ivry_presentationmaterials
1
320
Team operations that are not burdened by SRE
kazatohiei
1
310
Featured
See All Featured
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
5.9k
Code Review Best Practice
trishagee
69
18k
Gamification - CAS2011
davidbonilla
81
5.4k
Building Applications with DynamoDB
mza
95
6.5k
Visualization
eitanlees
146
16k
Site-Speed That Sticks
csswizardry
10
690
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
6
300
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.8k
Making the Leap to Tech Lead
cromwellryan
134
9.4k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
Transcript
Data Types Objects and Arrays Tuesday, September 8, 2009
objects collection of properties and methods Tuesday, September 8, 2009
creating a new object new Object() Tuesday, September 8, 2009
creating a new object (shortcut) {} Tuesday, September 8, 2009
different ways to do the same thing var student =
new Object(); student.name = 'John Doe'; student.age = 18; var student = {name:'John Doe', age:18}; Tuesday, September 8, 2009
keys can be strings var student = {name:'John Doe', age:18};
var student = {'name':'John Doe', 'age':18}; Tuesday, September 8, 2009
liberal formatting var student = {name:'John Doe', age:18}; var student
= { name:'John Doe', age:18 }; var student = { name : 'John Doe', age : 18 }; Tuesday, September 8, 2009
writing properties var student = {}; student.name = 'John Doe';
Tuesday, September 8, 2009
write as many as you want var student = {};
student.name = 'John Doe'; student.age = 18; student.gpa = 3.7; Tuesday, September 8, 2009
writing properties (shortcut) var student = {name:'John Doe'}; Tuesday, September
8, 2009
writing multiple properties var student = {name:'John Doe', age:18, gpa:3.7};
Tuesday, September 8, 2009
reading properties var student = {name:'John Doe', age:18}; student.name //
"John Doe" student.age // 18 Tuesday, September 8, 2009
reading properties (alternative syntax) var student = {name:'John Doe', age:18};
student['name'] // "John Doe" student['age'] // 18 Tuesday, September 8, 2009
reading properties that are not set var student = {name:'John
Doe', age:18}; student.foobar // undefined Tuesday, September 8, 2009
different ways to do the same thing var student =
{name:'John Doe', age:18}; student.name // "John Doe" student['name'] // "John Doe" student.age // 18 student['age'] // 18 Tuesday, September 8, 2009
methods we’ll cover them later Tuesday, September 8, 2009
arrays ordered collection of values Tuesday, September 8, 2009
creating an array new Array(); Tuesday, September 8, 2009
new Array with no arguments var things = new Array();
things.length; // 0 creates empty array Tuesday, September 8, 2009
new Array with one argument var things = new Array(5);
things.length; // 5 creates array with number of undefined elements shouldn’t ever need to do this, but be aware Tuesday, September 8, 2009
new Array with multiple arguments creates array with each argument
as element in array var things = new Array(1,2,3); things.length; // 3 Tuesday, September 8, 2009
summary Tuesday, September 8, 2009
creating an array (shortcut) [] Tuesday, September 8, 2009
much more predictable Tuesday, September 8, 2009
array methods Tuesday, September 8, 2009
remember how strings are zero indexed? var car = "car";
car[0] // c car[1] // a car[2] // r Tuesday, September 8, 2009
arrays are too var car = ['c', 'a', 'r']; car[0]
// c car[1] // a car[2] // r Tuesday, September 8, 2009
array of numbers var things = [1,2,3,4,5]; things[0] // 1
things[1] // 2 things[2] // 3 things[3] // 4 things[4] // 5 things[5] // undefined Tuesday, September 8, 2009
remember how strings know their length? var football = "football";
football.length // 8 Tuesday, September 8, 2009
arrays do too var things = [1,2,3,4,5]; things.length // 5
http://www.w3schools.com/jsref/jsref_length_array.asp Tuesday, September 8, 2009
remember how strings can get the indexOf stuff? var football
= "football"; football.indexOf('f') // 0 football.indexOf('o') // 1 football.indexOf('foot') // 0 football.indexOf('z') // -1 Tuesday, September 8, 2009
arrays can too var car = ['c','a','r']; car.indexOf('c'); // 0
car.indexOf('a'); // 1 car.indexOf('r'); // 2 car.indexOf('b'); // -1 Tuesday, September 8, 2009
more indexOf examples var strings = ['aa', 'b', 'ccD']; strings.indexOf('aa')
// 0 strings.indexOf('ccD') // 2 strings.indexOf('ccd') // -1 Tuesday, September 8, 2009
arrays can be multi-dimensional var multi = ['a', 'b', ['z',
'y']]; multi[0] // 'a' multi[1] // 'b' multi[2] // ['z', 'y'] multi[2][0] // 'z' multi[2][1] // 'y' multi[2].length // 2 Tuesday, September 8, 2009
concat returns joined arrays but does not alter them http://www.w3schools.com/jsref/jsref_concat_array.asp
Tuesday, September 8, 2009
concat of a and b var a = [1,2]; var
b = [3,4]; var c = a.concat(b); // a is still [1,2] // b is still [3,4] // c is now [1,2,3,4] Tuesday, September 8, 2009
concat of b and a var a = [1,2]; var
b = [3,4]; var c = b.concat(a); // a is still [1,2] // b is still [3,4] // c is now [3,4,1,2] Tuesday, September 8, 2009
concat with multi-dimensional var multi = ['a', 'b', ['z', 'y']];
multi.concat([1, 2]) // ['a', 'b', ['z','y'], '1', '2'] Tuesday, September 8, 2009
join joins the elements of an array into a string
separated by a delimiter http://www.w3schools.com/jsref/jsref_join.asp Tuesday, September 8, 2009
join var car_letters = ['c', 'a', 'r']; car_letters.join(''); // "car"
Tuesday, September 8, 2009
join with delimiter var car_letters = ['c', 'a', 'r']; car_letters.join(',');
// "c,a,r" Tuesday, September 8, 2009
delimiter can be any string var car_letters = ['c', 'a',
'r']; car_letters.join('WIN'); // "cWINaWINr" Tuesday, September 8, 2009
date example var date = [9, 8, 2009] date.join('/'); //
"9/8/2009" Tuesday, September 8, 2009
string has the opposite of join called split var date
= "9/8/2009" date.split('/') // [‘9’,‘8’,‘2009’] Tuesday, September 8, 2009
split/join allow for switching back and forth var date =
"9/8/2009"; var date_array = date.split('/') // [‘9’,‘8’,‘2009’] var date_string = date_array.join('/'); // “9/8/2009” Tuesday, September 8, 2009
reverse reverses the order of an array http://www.w3schools.com/jsref/jsref_reverse.asp Tuesday, September
8, 2009
reverse var car = ['r', 'a', 'c']; car.reverse(); // ['c',
'a', 'r'] Tuesday, September 8, 2009
sort sorts the elements of an array http://www.w3schools.com/jsref/jsref_sort.asp Tuesday, September
8, 2009
sorting numbers var numbers = [5,3,99,77,2]; numbers.sort(); // [2,3,5,77,99] Tuesday,
September 8, 2009
sorting strings var names = ['John', 'Steph', 'Steve', 'Carrie']; names.sort();
// ['Carrie','John','Steph','Steve'] Tuesday, September 8, 2009
upper case before lower case var letters = ['a', 'B',
'c', 'D']; letters.sort(); // ['B','D','a','c'] Tuesday, September 8, 2009
pop removes and returns the last element of an array
(opposite of shift) http://www.w3schools.com/jsref/jsref_pop.asp Tuesday, September 8, 2009
pop var car = ['c', 'a', 'r']; var last =
car.pop(); last // 'r' car // ['c','a'] Tuesday, September 8, 2009
pop var car = ['c', 'a', 'r']; car.pop(); // 'r'
car.pop(); // 'a' car.pop(); // 'c' car.pop(); // undefined car.length // 0 Tuesday, September 8, 2009
shift removes and returns the first element of an array
(opposite of pop) http://www.w3schools.com/jsref/jsref_shift.asp Tuesday, September 8, 2009
shift var car = ['c', 'a', 'r']; var first =
car.shift(); first // 'c' car // ['a','r'] Tuesday, September 8, 2009
shift var car = ['c', 'a', 'r']; car.shift(); // 'c'
car.shift(); // 'a' car.shift(); // 'r' car.shift(); // undefined car.length // 0 Tuesday, September 8, 2009
push adds one or more elements to the end of
an array and returns the new length (opposite of unshift) http://www.w3schools.com/jsref/jsref_push.asp Tuesday, September 8, 2009
push single element var car = ['c','a','r']; car.push('d'); // 4
car // ['c','a','r','d'] Tuesday, September 8, 2009
push multiple elements var car = ['c','a','r']; car.push('d', 'e', 'd');
// 6 car // ['c','a','r','d', 'e', 'd'] Tuesday, September 8, 2009
unshift adds one or more elements to the beginning of
the array and returns the new length (opposite of push) http://www.w3schools.com/jsref/jsref_unshift.asp Tuesday, September 8, 2009
unshift single element var car = ['c','a','r']; car.unshift('s'); // 4
car // ['s','c','a','r'] Tuesday, September 8, 2009
unshift multiple elements var car = ['c','a','r']; car.unshift('o', 's'); //
5 car // ['o','s','c','a','r'] Tuesday, September 8, 2009
shift/unshift pop/push end of array beginning of array Tuesday, September
8, 2009
slice slices elements out of an array without changing array
Tuesday, September 8, 2009
slice parameters array.slice(starting position, index after last position) Tuesday, September
8, 2009
slice with one argument var numbers = [1,2,3,4]; numbers.slice(2); //
[3, 4] numbers // [1,2,3,4] slices from index to end of array Tuesday, September 8, 2009
slice with two arguments slices from beginning index to index
before second argument var numbers = [1,2,3,4]; numbers.slice(0, 2); // [1, 2] numbers // [1,2,3,4] Tuesday, September 8, 2009
slice with negative second argument var numbers = [1,2,3,4]; numbers.slice(1,
-1); // [2, 3] numbers.slice(1, -2); // [2] numbers // [1,2,3,4] negative starts from end and goes backwards Tuesday, September 8, 2009
splice adds and removes elements from an array http://www.w3schools.com/jsref/jsref_splice.asp Tuesday,
September 8, 2009
splice parameters array.splice(index, how many to remove, elements to add)
index and how many to remove are required Tuesday, September 8, 2009
removing an element from an array var letters = ['a',
'c', 'd']; letters.splice(1, 1); // 'c' letters // ['a','d'] in english: at index 1, remove 1 element Tuesday, September 8, 2009
removing multiple elements from an array var letters = ['a',
'c', 'd']; letters.splice(1, 2); // ['c','d'] letters // ['a'] in english: at index 1, remove 2 elements Tuesday, September 8, 2009
adding an element to an array var letters = ['a',
'c', 'd']; letters.splice(1, 0, 'b'); // ['a', 'b', 'c', 'd'] in english: at index 1, remove 0 elements, add ‘b’ Tuesday, September 8, 2009
adding multiple elements to an array in english: at index
1, remove 0 elements, add ‘b’ and ‘c’ var letters = ['a', 'c', 'd']; letters.splice(1, 0, 'b', 'c'); letters // ['a','b','c','c','d'] Tuesday, September 8, 2009
replacing elements in an array var car = ['c', 'a',
'r']; car.splice(0, 1, 'b'); // 'c' car // ['b','a','r'] Tuesday, September 8, 2009
var person = {name:'John Doe'}; person.name Tuesday, September 8, 2009
var person = {name:'John Doe'}; person.name 'John Doe' Tuesday, September
8, 2009
var person = {name:'John Doe'}; person.name = 'Jane Doe'; person.name
Tuesday, September 8, 2009
var person = {name:'John Doe'}; person.name = 'Jane Doe'; person.name
'Jane Doe' Tuesday, September 8, 2009
var person = {name:'John Doe'}; person['name'] Tuesday, September 8, 2009
var person = {name:'John Doe'}; person['name'] 'John Doe' Tuesday, September
8, 2009
[12, 23, 36].length Tuesday, September 8, 2009
[12, 23, 36].length 3 Tuesday, September 8, 2009
[12, 23, 36].indexOf(12) Tuesday, September 8, 2009
[12, 23, 36].indexOf(12) 0 Tuesday, September 8, 2009
[12, 23, 36].indexOf(35) Tuesday, September 8, 2009
[12, 23, 36].indexOf(35) -1 Tuesday, September 8, 2009
['b','a','t'].join('') Tuesday, September 8, 2009
['b','a','t'].join('') 'bat' Tuesday, September 8, 2009
'9/8/2009'.split('/') Tuesday, September 8, 2009
'9/8/2009'.split('/') ['9', '8', '2009'] Tuesday, September 8, 2009
var numbers = [1,2,3]; numbers.push(4) numbers Tuesday, September 8, 2009
var numbers = [1,2,3]; numbers.push(4) numbers [1,2,3,4] Tuesday, September 8,
2009
var numbers = [1,2,3,4]; numbers.shift(); numbers Tuesday, September 8, 2009
var numbers = [1,2,3,4]; numbers.shift(); numbers [2,3,4] Tuesday, September 8,
2009
var numbers = [2,3,4]; numbers.unshift(1); numbers Tuesday, September 8, 2009
var numbers = [2,3,4]; numbers.unshift(1); numbers [1,2,3,4] Tuesday, September 8,
2009
var numbers = [2,3,4]; numbers.pop(); numbers Tuesday, September 8, 2009
var numbers = [2,3,4]; numbers.pop(); numbers [2,3] Tuesday, September 8,
2009
var numbers = [2,3,4]; numbers.splice(1, 0, 1); numbers Tuesday, September
8, 2009
var numbers = [2,3,4]; numbers.splice(1, 0, 1); numbers [2,1,3,4] Tuesday,
September 8, 2009
var numbers = [2,3,4]; numbers.splice(0, 1, 1); numbers Tuesday, September
8, 2009
var numbers = [2,3,4]; numbers.splice(0, 1, 1); numbers [1,3,4] Tuesday,
September 8, 2009