SlideShare une entreprise Scribd logo
1  sur  27
JavaScript - Date
Rodrigo Branas – @rodrigobranas - http://www.agilecode.com.br
Rodrigo Branas
rodrigo.branas@agilecode.com.br
http://www.agilecode.com.br
Formado em Ciências da Computação pela UFSC e
MBA em Gerenciamento de Projetos pela FGV, é
arquiteto de software há mais de 15 anos,
especialista nas linguagens Java e JavaScript. É
também autor do livro AngularJS Essentials e de
diversos artigos da revista Java Magazine. Além disso,
é professor e palestrante, tendo participado da formação de mais de
1.000 desenvolvedores de software e apresentado mais de 100
palestras em eventos no Brasil e no exterior. Fundador da Agile Code,
uma empresa de treinamento e consultoria, atualmente é
apresentador de um canal no YouTube sobre JavaScript, AngularJS e
muito mais!
Acompanhe a série Desvendando a linguagem
JavaScript pelo YouTube em:
http://www.youtube.com/rodrigobranas
Apesar de parecer mais simples, a data
não é representada dessa forma...
Como assim?
Ela é representada pela quantidade de
milissegundos desde o início da Era Unix
A Era Unix (Unix Epoch), ou Posix Time,
teve início no dia 1 de janeiro de 1970 às
00:00:00 do Tempo Universal Coordenado,
mais conhecido como UTC, referência a
partir de onde se calculam os fusos horários
do mundo inteiro.
Existem 4 maneiras diferentes de
criar uma data!
Criando uma data, a partir da função
construtora de Date, sem parâmetros
1. var hoje = new Date();
Invocando getTime para acessar sua
representação interna em milissegundo
1. var hoje = new Date();
2. hoje.getTime(); // 1429446304392
Criando uma data, passando como
parâmetro o tempo em milissegundos
1. var natal = new Date(1419465600000);
Espera, o Natal não é em 25/12?
O cálculo é feito a partir de UTC
±00:00, também conhecido como
Z, abreviação de Zulu Time
A hora no mundo em relação a UTC
Criando uma data, passando como
parâmetro uma String
1. new Date("2014/12/25");
2. // Thu Dec 25 2014 00:00:00 GMT-0200 (BRST)
3. new Date("12/25/2014");
4. // Thu Dec 25 2014 00:00:00 GMT-0200 (BRST)
5. new Date("25/12/2014");
6. // Invalid Date
Cuidado, os formatos oficialmente
aceitos são RFC 2822 ou ISO 8601
RFC 2822
Thu Dec 25 2014 10:30:00 GMT-0200 (BRST)
Criando uma data, passando como
parâmetro uma String RFC 2822
1. new Date("Thu Dec 25 2014");
2. // Thu Dec 25 2014 00:00:00 GMT-0200 (BRST)
Criando uma data, passando como
parâmetro uma String RFC 2822
1. new Date("Thu Dec 25 2014");
2. // Thu Dec 25 2014 00:00:00 GMT-0200 (BRST)
3. new Date("Thu Dec 25 2014 10:30:00");
4. // Thu Dec 25 2014 10:30:00 GMT-0200 (BRST)
ISO 8601
2014-12-25T10:30:00-02:00
Criando uma data, passando como
parâmetro uma String ISO 8601
1. new Date("2014-12-25");
2. // Wed Dec 24 2014 22:00:00 GMT-0200 (BRST)
Criando uma data, passando como
parâmetro uma String ISO 8601
1. new Date("2014-12-25");
2. // Wed Dec 24 2014 22:00:00 GMT-0200 (BRST)
3. new Date("2014-12-25T10:30:00");
4. // Thu Dec 25 2014 08:30:00 GMT-0200 (BRST)
Criando uma data, passando como
parâmetro uma String ISO 8601
1. new Date("2014-12-25");
2. // Wed Dec 24 2014 22:00:00 GMT-0200 (BRST)
3. new Date("2014-12-25T10:30:00");
4. // Thu Dec 25 2014 08:30:00 GMT-0200 (BRST)
5. new Date("2014-12-25T10:30:00Z");
6. // Thu Dec 25 2014 08:30:00 GMT-0200 (BRST)
Criando uma data, passando como
parâmetro uma String ISO 8601
1. new Date("2014-12-25");
2. // Wed Dec 24 2014 22:00:00 GMT-0200 (BRST)
3. new Date("2014-12-25T10:30:00");
4. // Thu Dec 25 2014 08:30:00 GMT-0200 (BRST)
5. new Date("2014-12-25T10:30:00Z");
6. // Thu Dec 25 2014 08:30:00 GMT-0200 (BRST)
7. new Date("2014-12-25T10:00:00-02:00");
8. // Thu Dec 25 2014 10:30:00 GMT-0200 (BRST)
Criando uma data, passando como
parâmetro a própria data
1. new Date(2014, 11, 25);
2. // Thu Dec 25 2014 00:00:00 GMT-0200 (BRST)
3. new Date(2014, 11, 25, 10, 30, 00);
4. // Thu Dec 25 2014 10:30:00 GMT-0200 (BRST)
Os meses são contados a partir de 0
Date API
• getDate – Retorna o dia
• getDay - Retorna o dia da semana
• getFullYear – Retorna o ano
• getHours – Retorna as horas
• getMilliseconds – Retorna os milisegundos
• getMinutes – Retorna os minutos
• getMonth – Retorna o mês
• getSeconds – Retorna os segundos
• getTime – Retorna o tempo em milisegundos
• toString - Retorna a data em String

Contenu connexe

En vedette

Utilizando diretivas com AngularJS
Utilizando diretivas com AngularJSUtilizando diretivas com AngularJS
Utilizando diretivas com AngularJSRodrigo Branas
 
A evolução do AngularJS
A evolução do AngularJSA evolução do AngularJS
A evolução do AngularJSRodrigo Branas
 
Introdução ao AngularJS
Introdução ao AngularJSIntrodução ao AngularJS
Introdução ao AngularJSRodrigo Branas
 
Desvendando a linguagem JavaScript
Desvendando a linguagem JavaScriptDesvendando a linguagem JavaScript
Desvendando a linguagem JavaScriptRodrigo Branas
 
Técnicas de Refactoring
Técnicas de RefactoringTécnicas de Refactoring
Técnicas de RefactoringRodrigo Branas
 
Node.js - #5 - Process - Rodrigo Branas
Node.js - #5 - Process - Rodrigo BranasNode.js - #5 - Process - Rodrigo Branas
Node.js - #5 - Process - Rodrigo BranasRodrigo Branas
 
Node.js - #6 - Core Modules - net - Rodrigo Branas
Node.js - #6 - Core Modules - net - Rodrigo BranasNode.js - #6 - Core Modules - net - Rodrigo Branas
Node.js - #6 - Core Modules - net - Rodrigo BranasRodrigo Branas
 
Node.js - #2 - Sistema de Módulos - Rodrigo Branas
Node.js - #2 - Sistema de Módulos - Rodrigo BranasNode.js - #2 - Sistema de Módulos - Rodrigo Branas
Node.js - #2 - Sistema de Módulos - Rodrigo BranasRodrigo Branas
 
Criando serviços com AngularJS
Criando serviços com AngularJSCriando serviços com AngularJS
Criando serviços com AngularJSRodrigo Branas
 
Curso AngularJS - 3. módulos y controladores
Curso AngularJS - 3. módulos y controladoresCurso AngularJS - 3. módulos y controladores
Curso AngularJS - 3. módulos y controladoresÁlvaro Alonso González
 
Iniciando com jQuery
Iniciando com jQueryIniciando com jQuery
Iniciando com jQueryTiago Butzke
 
Tutorial AngularJS - episódio 5 - diretivas
Tutorial AngularJS - episódio 5 -  diretivasTutorial AngularJS - episódio 5 -  diretivas
Tutorial AngularJS - episódio 5 - diretivasJose Naves Moura Neto
 
O Poderoso AngularJS
O Poderoso AngularJSO Poderoso AngularJS
O Poderoso AngularJSBeto Muniz
 
AngularJS - 10 passos para aprender a criar suas directivas
AngularJS - 10 passos para aprender a criar suas directivasAngularJS - 10 passos para aprender a criar suas directivas
AngularJS - 10 passos para aprender a criar suas directivasJanderson Fernandes Cardoso
 

En vedette (20)

Utilizando diretivas com AngularJS
Utilizando diretivas com AngularJSUtilizando diretivas com AngularJS
Utilizando diretivas com AngularJS
 
A evolução do AngularJS
A evolução do AngularJSA evolução do AngularJS
A evolução do AngularJS
 
Introdução ao AngularJS
Introdução ao AngularJSIntrodução ao AngularJS
Introdução ao AngularJS
 
Desvendando a linguagem JavaScript
Desvendando a linguagem JavaScriptDesvendando a linguagem JavaScript
Desvendando a linguagem JavaScript
 
Técnicas de Refactoring
Técnicas de RefactoringTécnicas de Refactoring
Técnicas de Refactoring
 
#2 - Git - DAG
#2 - Git - DAG#2 - Git - DAG
#2 - Git - DAG
 
Node.js - #5 - Process - Rodrigo Branas
Node.js - #5 - Process - Rodrigo BranasNode.js - #5 - Process - Rodrigo Branas
Node.js - #5 - Process - Rodrigo Branas
 
Selenium - WebDriver
Selenium - WebDriverSelenium - WebDriver
Selenium - WebDriver
 
Node.js - #6 - Core Modules - net - Rodrigo Branas
Node.js - #6 - Core Modules - net - Rodrigo BranasNode.js - #6 - Core Modules - net - Rodrigo Branas
Node.js - #6 - Core Modules - net - Rodrigo Branas
 
Node.js - #2 - Sistema de Módulos - Rodrigo Branas
Node.js - #2 - Sistema de Módulos - Rodrigo BranasNode.js - #2 - Sistema de Módulos - Rodrigo Branas
Node.js - #2 - Sistema de Módulos - Rodrigo Branas
 
Criando serviços com AngularJS
Criando serviços com AngularJSCriando serviços com AngularJS
Criando serviços com AngularJS
 
Curso AngularJS - 2. conceptos básicos
Curso AngularJS - 2. conceptos básicosCurso AngularJS - 2. conceptos básicos
Curso AngularJS - 2. conceptos básicos
 
Curso AngularJS - 3. módulos y controladores
Curso AngularJS - 3. módulos y controladoresCurso AngularJS - 3. módulos y controladores
Curso AngularJS - 3. módulos y controladores
 
Iniciando com jQuery
Iniciando com jQueryIniciando com jQuery
Iniciando com jQuery
 
Curso AngularJS - 1. introducción
Curso AngularJS - 1. introducciónCurso AngularJS - 1. introducción
Curso AngularJS - 1. introducción
 
Curso AngularJS - 7. temas avanzados
Curso AngularJS - 7. temas avanzadosCurso AngularJS - 7. temas avanzados
Curso AngularJS - 7. temas avanzados
 
Tutorial AngularJS - episódio 5 - diretivas
Tutorial AngularJS - episódio 5 -  diretivasTutorial AngularJS - episódio 5 -  diretivas
Tutorial AngularJS - episódio 5 - diretivas
 
Introdução ao AngularJS!
Introdução ao AngularJS!Introdução ao AngularJS!
Introdução ao AngularJS!
 
O Poderoso AngularJS
O Poderoso AngularJSO Poderoso AngularJS
O Poderoso AngularJS
 
AngularJS - 10 passos para aprender a criar suas directivas
AngularJS - 10 passos para aprender a criar suas directivasAngularJS - 10 passos para aprender a criar suas directivas
AngularJS - 10 passos para aprender a criar suas directivas
 

Plus de Rodrigo Branas

Node.js - #4 - Timers - Rodrigo Branas
Node.js - #4 - Timers - Rodrigo BranasNode.js - #4 - Timers - Rodrigo Branas
Node.js - #4 - Timers - Rodrigo BranasRodrigo Branas
 
Node.js - #3 - Global Objects - Rodrigo Branas
Node.js - #3 - Global Objects - Rodrigo BranasNode.js - #3 - Global Objects - Rodrigo Branas
Node.js - #3 - Global Objects - Rodrigo BranasRodrigo Branas
 
Node.js - #1 - Introdução - Rodrigo Branas
Node.js - #1 - Introdução - Rodrigo BranasNode.js - #1 - Introdução - Rodrigo Branas
Node.js - #1 - Introdução - Rodrigo BranasRodrigo Branas
 
#6 - Git - Desfazendo as coisas
#6 - Git - Desfazendo as coisas#6 - Git - Desfazendo as coisas
#6 - Git - Desfazendo as coisasRodrigo Branas
 
#1 - Git - Introdução
#1 - Git - Introdução#1 - Git - Introdução
#1 - Git - IntroduçãoRodrigo Branas
 
#5 - Git - Contribuindo com um repositório remoto
#5 - Git - Contribuindo com um repositório remoto#5 - Git - Contribuindo com um repositório remoto
#5 - Git - Contribuindo com um repositório remotoRodrigo Branas
 
#3 - Git - Branching e Merging
#3 - Git - Branching e Merging#3 - Git - Branching e Merging
#3 - Git - Branching e MergingRodrigo Branas
 
Construindo Diretivas com AngularJS
Construindo Diretivas com AngularJSConstruindo Diretivas com AngularJS
Construindo Diretivas com AngularJSRodrigo Branas
 

Plus de Rodrigo Branas (12)

Clean Architecture
Clean ArchitectureClean Architecture
Clean Architecture
 
Node.js - #4 - Timers - Rodrigo Branas
Node.js - #4 - Timers - Rodrigo BranasNode.js - #4 - Timers - Rodrigo Branas
Node.js - #4 - Timers - Rodrigo Branas
 
Node.js - #3 - Global Objects - Rodrigo Branas
Node.js - #3 - Global Objects - Rodrigo BranasNode.js - #3 - Global Objects - Rodrigo Branas
Node.js - #3 - Global Objects - Rodrigo Branas
 
Node.js - #1 - Introdução - Rodrigo Branas
Node.js - #1 - Introdução - Rodrigo BranasNode.js - #1 - Introdução - Rodrigo Branas
Node.js - #1 - Introdução - Rodrigo Branas
 
#6 - Git - Desfazendo as coisas
#6 - Git - Desfazendo as coisas#6 - Git - Desfazendo as coisas
#6 - Git - Desfazendo as coisas
 
#1 - Git - Introdução
#1 - Git - Introdução#1 - Git - Introdução
#1 - Git - Introdução
 
#5 - Git - Contribuindo com um repositório remoto
#5 - Git - Contribuindo com um repositório remoto#5 - Git - Contribuindo com um repositório remoto
#5 - Git - Contribuindo com um repositório remoto
 
#4 - Git - Stash
#4 - Git - Stash#4 - Git - Stash
#4 - Git - Stash
 
#3 - Git - Branching e Merging
#3 - Git - Branching e Merging#3 - Git - Branching e Merging
#3 - Git - Branching e Merging
 
Construindo Diretivas com AngularJS
Construindo Diretivas com AngularJSConstruindo Diretivas com AngularJS
Construindo Diretivas com AngularJS
 
Grunt
GruntGrunt
Grunt
 
Bower
BowerBower
Bower
 

JavaScript - Date

  • 1. JavaScript - Date Rodrigo Branas – @rodrigobranas - http://www.agilecode.com.br
  • 2. Rodrigo Branas rodrigo.branas@agilecode.com.br http://www.agilecode.com.br Formado em Ciências da Computação pela UFSC e MBA em Gerenciamento de Projetos pela FGV, é arquiteto de software há mais de 15 anos, especialista nas linguagens Java e JavaScript. É também autor do livro AngularJS Essentials e de diversos artigos da revista Java Magazine. Além disso, é professor e palestrante, tendo participado da formação de mais de 1.000 desenvolvedores de software e apresentado mais de 100 palestras em eventos no Brasil e no exterior. Fundador da Agile Code, uma empresa de treinamento e consultoria, atualmente é apresentador de um canal no YouTube sobre JavaScript, AngularJS e muito mais!
  • 3. Acompanhe a série Desvendando a linguagem JavaScript pelo YouTube em: http://www.youtube.com/rodrigobranas
  • 4. Apesar de parecer mais simples, a data não é representada dessa forma...
  • 6. Ela é representada pela quantidade de milissegundos desde o início da Era Unix
  • 7. A Era Unix (Unix Epoch), ou Posix Time, teve início no dia 1 de janeiro de 1970 às 00:00:00 do Tempo Universal Coordenado, mais conhecido como UTC, referência a partir de onde se calculam os fusos horários do mundo inteiro.
  • 8. Existem 4 maneiras diferentes de criar uma data!
  • 9. Criando uma data, a partir da função construtora de Date, sem parâmetros 1. var hoje = new Date();
  • 10. Invocando getTime para acessar sua representação interna em milissegundo 1. var hoje = new Date(); 2. hoje.getTime(); // 1429446304392
  • 11. Criando uma data, passando como parâmetro o tempo em milissegundos 1. var natal = new Date(1419465600000);
  • 12. Espera, o Natal não é em 25/12?
  • 13. O cálculo é feito a partir de UTC ±00:00, também conhecido como Z, abreviação de Zulu Time
  • 14. A hora no mundo em relação a UTC
  • 15. Criando uma data, passando como parâmetro uma String 1. new Date("2014/12/25"); 2. // Thu Dec 25 2014 00:00:00 GMT-0200 (BRST) 3. new Date("12/25/2014"); 4. // Thu Dec 25 2014 00:00:00 GMT-0200 (BRST) 5. new Date("25/12/2014"); 6. // Invalid Date
  • 16. Cuidado, os formatos oficialmente aceitos são RFC 2822 ou ISO 8601
  • 17. RFC 2822 Thu Dec 25 2014 10:30:00 GMT-0200 (BRST)
  • 18. Criando uma data, passando como parâmetro uma String RFC 2822 1. new Date("Thu Dec 25 2014"); 2. // Thu Dec 25 2014 00:00:00 GMT-0200 (BRST)
  • 19. Criando uma data, passando como parâmetro uma String RFC 2822 1. new Date("Thu Dec 25 2014"); 2. // Thu Dec 25 2014 00:00:00 GMT-0200 (BRST) 3. new Date("Thu Dec 25 2014 10:30:00"); 4. // Thu Dec 25 2014 10:30:00 GMT-0200 (BRST)
  • 21. Criando uma data, passando como parâmetro uma String ISO 8601 1. new Date("2014-12-25"); 2. // Wed Dec 24 2014 22:00:00 GMT-0200 (BRST)
  • 22. Criando uma data, passando como parâmetro uma String ISO 8601 1. new Date("2014-12-25"); 2. // Wed Dec 24 2014 22:00:00 GMT-0200 (BRST) 3. new Date("2014-12-25T10:30:00"); 4. // Thu Dec 25 2014 08:30:00 GMT-0200 (BRST)
  • 23. Criando uma data, passando como parâmetro uma String ISO 8601 1. new Date("2014-12-25"); 2. // Wed Dec 24 2014 22:00:00 GMT-0200 (BRST) 3. new Date("2014-12-25T10:30:00"); 4. // Thu Dec 25 2014 08:30:00 GMT-0200 (BRST) 5. new Date("2014-12-25T10:30:00Z"); 6. // Thu Dec 25 2014 08:30:00 GMT-0200 (BRST)
  • 24. Criando uma data, passando como parâmetro uma String ISO 8601 1. new Date("2014-12-25"); 2. // Wed Dec 24 2014 22:00:00 GMT-0200 (BRST) 3. new Date("2014-12-25T10:30:00"); 4. // Thu Dec 25 2014 08:30:00 GMT-0200 (BRST) 5. new Date("2014-12-25T10:30:00Z"); 6. // Thu Dec 25 2014 08:30:00 GMT-0200 (BRST) 7. new Date("2014-12-25T10:00:00-02:00"); 8. // Thu Dec 25 2014 10:30:00 GMT-0200 (BRST)
  • 25. Criando uma data, passando como parâmetro a própria data 1. new Date(2014, 11, 25); 2. // Thu Dec 25 2014 00:00:00 GMT-0200 (BRST) 3. new Date(2014, 11, 25, 10, 30, 00); 4. // Thu Dec 25 2014 10:30:00 GMT-0200 (BRST)
  • 26. Os meses são contados a partir de 0
  • 27. Date API • getDate – Retorna o dia • getDay - Retorna o dia da semana • getFullYear – Retorna o ano • getHours – Retorna as horas • getMilliseconds – Retorna os milisegundos • getMinutes – Retorna os minutos • getMonth – Retorna o mês • getSeconds – Retorna os segundos • getTime – Retorna o tempo em milisegundos • toString - Retorna a data em String

Notes de l'éditeur

  1. Desmotivação
  2. Desmotivado
  3. Desmotivado
  4. Desmotivação
  5. Desmotivação
  6. Desmotivação
  7. Desmotivação
  8. Desmotivação
  9. Desmotivação
  10. Desmotivação
  11. Desmotivação
  12. Desmotivação
  13. Desmotivação
  14. Desmotivação
  15. Desmotivação
  16. Desmotivação
  17. Desmotivação
  18. Desmotivação
  19. Desmotivação
  20. Desmotivação
  21. Desmotivação
  22. Desmotivação
  23. Desmotivação
  24. Desmotivação
  25. Desmotivação
  26. Desmotivação
  27. Desmotivação