1
00:00:00,780 --> 00:00:01,860
Bem vindo de volta.

2
00:00:01,860 --> 00:00:06,930
Então, nos últimos vídeos, falamos sobre matrizes de javascript que são a primeira estrutura de

3
00:00:06,960 --> 00:00:09,250
dados em que falamos nos próximos vídeos.

4
00:00:09,270 --> 00:00:12,660
Vamos apresentar uma nova estrutura de dados chamada objeto.

5
00:00:13,140 --> 00:00:16,070
Então, temos dois objetivos principais, como fizemos com os arrays.

6
00:00:16,080 --> 00:00:20,070
Primeiro queremos entender quais são os objetos pelos quais os usamos.

7
00:00:20,100 --> 00:00:21,900
Como eles se comparam a uma matriz.

8
00:00:21,900 --> 00:00:26,350
E então o segundo objetivo é como escrevemos algum código usando objetos javascript.

9
00:00:26,790 --> 00:00:29,370
Vamos continuar e começar.

10
00:00:29,400 --> 00:00:31,470
Então, aqui está uma situação hipotética.

11
00:00:31,470 --> 00:00:35,730
Suponha que eu queria modelar uma única pessoa em javascript.

12
00:00:35,760 --> 00:00:38,850
Cada pessoa tem um nome e idade e uma cidade.

13
00:00:38,850 --> 00:00:45,030
Então, há muitas maneiras pelas quais eu poderia fazer isso, eu poderia ter três variáveis ​​diferentes, idade e cidade, mas não estão

14
00:00:45,030 --> 00:00:46,580
relacionadas umas com as outras.

15
00:00:46,590 --> 00:00:47,780
Eles são totalmente separados.

16
00:00:47,970 --> 00:00:54,560
uma matriz como se eu estivesse aqui, a var pessoa é igual à matriz onde o primeiro item é o nome Cindy.

17
00:00:54,930 --> 00:00:57,510
Então, se eu quisesse conectá-los, eu poderia usar

18
00:00:57,600 --> 00:01:03,780
O segundo item tem 32 anos e o último item é Missoula ou a cidade.

19
00:01:03,780 --> 00:01:08,510
Este não é realmente um ótimo uso de uma matriz porque esses dados não são realmente uma lista.

20
00:01:08,760 --> 00:01:13,920
Sim, podemos forçá-lo a uma matriz, mas não se presta ao formato de uma matriz onde temos

21
00:01:13,920 --> 00:01:16,440
listas que muitas vezes têm uma ordem lógica.

22
00:01:16,530 --> 00:01:20,770
Realmente não há uma ordem lógica aqui para acessar a cidade desta matriz.

23
00:01:21,000 --> 00:01:23,970
Eu precisaria também escrever o suporte da pessoa.

24
00:01:24,270 --> 00:01:28,360
E isso exige que eu saiba que a cidade também está no índice.

25
00:01:28,500 --> 00:01:36,030
Então, se eu acidentalmente invertei a ordem e eu tive Traviss o nome do índice antecipado 0, mas então eu misture esses

26
00:01:36,030 --> 00:01:36,530
dois.

27
00:01:36,540 --> 00:01:41,300
Então eu tinha na cidade do índice 1 uma idade no índice 2.

28
00:01:41,520 --> 00:01:48,060
Então, se eu tentar acessar a pessoa no suporte 2, ficaria idade em vez de cidade.

29
00:01:48,060 --> 00:01:53,370
Então, isso é tudo apenas para mostrar que uma matriz não é a solução perfeita para cada situação.

30
00:01:53,370 --> 00:01:58,040
Existe uma estrutura de dados muito melhor para usar aqui qual é o objeto javascript.

31
00:01:58,110 --> 00:02:03,930
Você pode ver um exemplo aqui como nós levamos o array da pessoa com idade e cidade do nome

32
00:02:03,930 --> 00:02:05,630
e transformá-lo em um objeto javascript.

33
00:02:05,790 --> 00:02:10,140
A primeira coisa que você deve notar é que temos cintas curly em vez de colchetes para uma matriz.

34
00:02:10,890 --> 00:02:15,470
A próxima peça importante é que cada item neste objeto é um par de valores-chave.

35
00:02:15,750 --> 00:02:21,050
Então temos uma propriedade que o nome de valor de Colan é.

36
00:02:21,180 --> 00:02:25,500
A idade é de 32 cidades é Missoula.

37
00:02:25,500 --> 00:02:27,360
Este slide mostra exatamente o mesmo.

38
00:02:27,450 --> 00:02:34,860
Nós temos um objeto de pessoa diferente. A pessoa var é igual a aparelhos de proteção e dentro que estamos definindo o nome para ser Travis

39
00:02:34,860 --> 00:02:42,060
idade para ser 21 na cidade para ser L. UMA. Aqui, temos um diagrama simples do que é essa

40
00:02:42,060 --> 00:02:43,020
estrutura de dados.

41
00:02:43,020 --> 00:02:47,970
Nós temos três slots diferentes neste objeto e é realmente importante notar que os objetos não têm nenhum

42
00:02:48,000 --> 00:02:53,690
padrão criado ao contrário de uma matriz onde há um primeiro item e um segundo item e um terceiro item.

43
00:02:53,700 --> 00:02:58,380
Pense nos itens em vez de um determinado objeto como apenas flutuando por dentro se não houver

44
00:02:58,380 --> 00:02:59,040
um pedido.

45
00:02:59,040 --> 00:03:04,860
Nenhuma propriedade vem primeiro ou segundo, não importa como eu os declarou em que ordem eles são todos tratados da

46
00:03:04,860 --> 00:03:05,600
mesma forma.

47
00:03:05,610 --> 00:03:10,180
Então, este diagrama os mostra em ordem, mas é só porque eu tive que escolher um pedido.

48
00:03:10,680 --> 00:03:14,620
Então você pode ver Travis armazenado sob o nome da chave.

49
00:03:14,850 --> 00:03:17,220
21 está armazenado sob a idade da chave.

50
00:03:17,370 --> 00:03:23,190
E eu. UMA. é armazenado na cidade-chave para recuperar dados de um objeto.

51
00:03:23,190 --> 00:03:24,970
Temos duas escolhas.

52
00:03:25,200 --> 00:03:31,800
Podemos usar o nome dos colchetes da pessoa do objeto e depois o nome da chave.

53
00:03:32,130 --> 00:03:35,820
Então, neste caso, estou tirando o Travis do objeto da pessoa.

54
00:03:35,820 --> 00:03:39,610
Então, eu coloitas da pessoa certa nome entre citações.

55
00:03:39,630 --> 00:03:41,620
Então isso é muito parecido com os arrays.

56
00:03:41,670 --> 00:03:43,920
A única diferença é que este não é um número.

57
00:03:43,950 --> 00:03:45,890
Esta é uma string.

58
00:03:45,930 --> 00:03:51,140
A outra opção é usar a notação de ponto, a notação de pontos é um pouco mais curta e mais simples.

59
00:03:51,150 --> 00:03:58,500
O nome e o nome do nome da pessoa certa devem corresponder, obviamente, ao nome da chave e isso também

60
00:03:58,500 --> 00:03:59,610
nos dará Travis.

61
00:03:59,880 --> 00:04:02,320
Eu vou seguir em frente e demonstrar isso no con. Eu vou fazer um novo objeto chamado cão e meu cachorro vai ter um nome de propriedade como sempre.

62
00:04:02,340 --> 00:04:10,640
Rusty Ele é o melhor cão e meia raça.

63
00:04:10,740 --> 00:04:14,390
Ele é um mutt Lassally age e ele é três.

64
00:04:14,760 --> 00:04:22,140
Então isso me dá meu objeto cão.

65
00:04:22,590 --> 00:04:24,720
E se olharmos para o console, você pode ver que isso é um objeto.

66
00:04:24,840 --> 00:04:28,350
Seu nome é resti breed como lama envelhece 3.

67
00:04:28,350 --> 00:04:32,180
Então, se eu quiser acessar sua idade fora do objeto do cachorro,

68
00:04:32,190 --> 00:04:39,990
posso fazer o primeiro cão intacto e, em citações, idade, eles recebem três ou posso fazer a idade do cachorro e eu também recebo três.

69
00:04:40,350 --> 00:04:47,970
Depende de você usar qualquer um.

70
00:04:48,120 --> 00:04:50,190
Eu prefiro usar a idade do cachorrinho porque é mais curto.

71
00:04:50,190 --> 00:04:53,100
Você não precisa usar as cotações.

72
00:04:53,100 --> 00:04:54,380
Você não precisa de colchetes duplos em ambos os lados.

73
00:04:54,390 --> 00:04:56,570
Você só precisa disso.

74
00:04:56,700 --> 00:04:57,880
Mas há algumas diferenças neste slide.

75
00:04:58,350 --> 00:05:01,100
Eu demonstra três das principais diferenças.

76
00:05:01,110 --> 00:05:03,750
Portanto, você não pode usar notação de pontos se a propriedade começar com um número.

77
00:05:04,140 --> 00:05:08,850
Então você pode ver que aqui algum objeto no DOT one blah não é válido.

78
00:05:08,850 --> 00:05:14,580
Mas se eu tivesse uma propriedade chamada One blah eu teria que usar colchetes

79
00:05:15,090 --> 00:05:20,660
e colocá-lo em citações e isso é exatamente como ele está configurado no javascript.

80
00:05:20,660 --> 00:05:23,040
nome da propriedade tiver um espaço nele como cor favorita.

81
00:05:23,040 --> 00:05:28,290
Eu vou pular para o terceiro exemplo aqui, que é que você não pode usar a notação de pontos se o

82
00:05:28,290 --> 00:05:31,450
Obviamente, isso não funciona.

83
00:05:31,500 --> 00:05:33,240
Javascript pensa que estamos acessando dot fav Então,

84
00:05:33,240 --> 00:05:38,820
se queremos uma propriedade com o espaço que na verdade não seja uma boa prática de qualquer maneira, mas se fôssemos precisamos usar aspas.

85
00:05:38,820 --> 00:05:42,600
Fav.

86
00:05:42,620 --> 00:05:43,130
Cor do espaço usando notação de suporte quadrado.

87
00:05:43,170 --> 00:05:46,150
E então o exemplo do meio mostra que você pode procurar coisas usando uma variável.

88
00:05:46,890 --> 00:05:51,370
Se você usar notação de suporte.

89
00:05:51,420 --> 00:05:53,160
Então, se eu tiver uma variável

90
00:05:53,370 --> 00:06:00,900
aqui chamada string ou como TR E é igual ao nome entre aspas se eu tentar e fazer algum objeto como TR. Ele apenas procurará

91
00:06:00,900 --> 00:06:09,300
a propriedade como TR Mas se eu fizer algum suporte quadrado de objeto como TR, ele vai avalie como TR que nos dá o nome entre aspas.

92
00:06:09,300 --> 00:06:14,970
Então, isso buscará o nome da propriedade em algum objeto.

93
00:06:14,970 --> 00:06:19,560
Então, isso é algo que realmente veremos ocasionalmente.

94
00:06:19,560 --> 00:06:22,290
Portanto, vale a pena conhecer a diferença aqui.

95
00:06:22,320 --> 00:06:24,040
Você pode usar a notação de suporte quadrado usando um nome de variável para procurar uma propriedade.

96
00:06:24,060 --> 00:06:29,700
A próxima coisa que queremos fazer é poder atualizar dados dentro de um objeto.

97
00:06:29,820 --> 00:06:34,140
Portanto, é muito semelhante aos arrays em que acessamos os dados e depois reatribuí-lo com um sinal de igual.

98
00:06:34,410 --> 00:06:40,190
Então, aqui, você pode ver que temos o mesmo nome de objeto da pessoa que Travis age é 21 cidade é L. UMA. Se eu quiser adicionar um para a idade de Traviss

99
00:06:40,470 --> 00:06:47,970
é o aniversário dele.

100
00:06:47,970 --> 00:06:51,230
Tudo o que preciso fazer é acessar a idade da pessoa.

101
00:06:51,450 --> 00:06:54,160
Eu posso usar colchetes ou a notação de pontos e depois reatribuir.

102
00:06:54,570 --> 00:06:58,430
Portanto, a idade da pessoa é igual a 1.

103
00:06:58,560 --> 00:07:01,170
Então, isso irá adicionar uma pessoa que

104
00:07:01,710 --> 00:07:08,940
idade é agora de 22 ou eu posso usar a cidade ponto cidade e reatribuir isso para ser Londres.

105
00:07:08,940 --> 00:07:09,500
Então, a cidade da pessoa, igual a Londres, agora definirá a pessoa para ter a cidade de Londres.

106
00:07:09,660 --> 00:07:15,490
Então, apenas para demonstrar isso.

107
00:07:15,510 --> 00:07:16,990
Vamos voltar para o nosso objeto de cachorro, que tem o nome como criador de criadores enferrujados.

108
00:07:17,280 --> 00:07:22,200
A idade é três.

109
00:07:22,230 --> 00:07:23,850
Rusty só teve um aniversário, então eu vou mudar o cão da sua idade.

110
00:07:23,880 --> 00:07:28,050
A idade é igual e eu poderia fazer isso igual a

111
00:07:28,080 --> 00:07:34,080
quatro, que só vai fazer quatro, não importa o que e eu possa olhar para o cachorro.

112
00:07:34,730 --> 00:07:36,260
Ou eu poderia fazer um cachorro.

113
00:07:36,930 --> 00:07:39,070
A idade mais é igual a uma que apenas adicionará uma à idade existente e isso nos dá cinco.

114
00:07:39,150 --> 00:07:45,940
Também demonstraria fazer isso com a notação do suporte quadrado.

115
00:07:45,990 --> 00:07:49,180
Digamos que eu quero mudar o nome de Rusty para ser seu apelido, Tater.

116
00:07:49,230 --> 00:07:53,110
Gostaria de escrever o nome do suporte do quadril do cão e isso só me dá resti e então eu vou reatribuí-lo para ser o Tator.

117
00:07:53,450 --> 00:08:01,710
E se você olha para o cão, agora chamamos o Tator liberado aos 5 anos.

118
00:08:03,120 --> 00:08:10,200
Existem algumas maneiras diferentes de inicializar objetos, como vimos com uma raça, para

119
00:08:10,320 --> 00:08:16,050
que possamos fazer um objeto vazio primeiro como nós temos aqui.

120
00:08:16,050 --> 00:08:19,540
A pessoa Var é igual às chaves curvas vazias e então podemos adicionar os dados após o fato.

121
00:08:19,740 --> 00:08:24,560
Uma peça de cada vez.

122
00:08:24,600 --> 00:08:26,240
O nome da pessoa é Travis pessoa com 21 anos de idade, essa cidade é L. UMA. podemos fazer tudo de uma só vez, o

123
00:08:26,360 --> 00:08:33,330
que vimos até agora, é chamado de notação literal do objeto.

124
00:08:33,330 --> 00:08:37,040
Até agora, a pessoa é igual e depois dentro das

125
00:08:37,140 --> 00:08:43,860
armadinhas curly eu apenas escrevo o nome da minha propriedade Travis idade chamada e 21 cidade Colan L. UMA. e a última maneira que você não verá muitas vezes até muito mais tarde no javascript.

126
00:08:43,860 --> 00:08:50,910
Ele disse que eu posso usar o novo objeto

127
00:08:51,330 --> 00:08:57,450
que é uma função, assim como uma nova matriz que nos tornará um novo objeto e nos devolverá como um objeto vazio.

128
00:08:57,510 --> 00:08:59,740
E então eu posso adicionar a pessoa do nome da pessoa não idade na cidade pessoa.

129
00:08:59,880 --> 00:09:03,570
Então você definitivamente verá esta sintaxe e essa sintaxe muito mais frequentemente por enquanto.

130
00:09:03,810 --> 00:09:08,940
Outro ponto que eu gostaria de fazer sobre os objetos é que, como arrays eles podem conter qualquer tipo de dados.

131
00:09:08,940 --> 00:09:14,160
Portanto, nossos dados podem ser números ou strings ou booleanos, uma matriz, até mesmo outro objeto, como você pode ver aqui.

132
00:09:14,610 --> 00:09:21,410
Assim como os arrays, podemos misturar e combinar o máximo que gostaríamos.

133
00:09:21,630 --> 00:09:24,460
Então, vamos parar aqui por enquanto no próximo

134
00:09:24,480 --> 00:09:28,770
vídeo, vamos fazer uma comparação entre objetos e apagar a sintaxe

135
00:09:28,800 --> 00:09:29,850