Skip to content

Commit c356cfb

Browse files
author
Luca Montaigut
committed
first commit
0 parents  commit c356cfb

6 files changed

+430
-0
lines changed

[email protected]

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
# Le javascript dans le browser
2+
3+
## neolectron — 29/05/2019 :
4+
5+
Il faut savoir que le "javascript browser" (le javascript dans le contexte d'un navigateur internet), nous est fourni avec une **api**.
6+
7+
(une api est un ensemble de fonction crée pour que tu puisse utiliser un systeme que tu connais pas [ici la page web])
8+
9+
(donc c'est **un ensemble de fonctions qui t'aident a faire des trucs sur ta page web** [pour plus d'explication regardez le topic en haut "javascript n'est pas un language"])
10+
11+
Cette api se trouve dans l'objet `window`, pour voir l'ensemble des variables et fonction que chrome nous file, il suffis de taper `window` dans la console chrome.
12+
13+
Dedans on y trouve des trucs sympa comme la fonction alert pour mettre une popup et la fonction prompt pour poser une question.
14+
15+
--
16+
17+
L'objet qui nous interesse aujourd'hui c'est `document`
18+
(ou `window.document`, mais il est inutile de préfixer tout ce qui se trouve dans window par `window.`).
19+
document c'est l'objet qui est censé représenter notre page web dans son ensemble
20+
(donc cette fois ci c'est pas juste des fonctions pour nous aider a faire des trucs, c'est juste la variable dont chrome se sert pour representer la page web).
21+
22+
--
23+
24+
Dans document cette fois ci, on peut trouver du coup toutes les balises html qui sont dans notre page, a commencer par la balise body.
25+
26+
On la trouve tout simplement dans document.body (ok là c'était facile, mais c'est pas le cas pour toutes les balises mdr)
27+
28+
pour essayer de chopper la variable qui represente une balise html afin de pouvoir la modifier.
29+
(par ce que c'est le but du js de modifier l'html en live)
30+
31+
--
32+
33+
Ces variables qui représente des balises html on les appelle Node (rien a voir avec node js si t'as bien lu le post en haut tu sais)
34+
35+
donc document.body est un Node.
36+
(donc node est la representation d'une balise html mais dans le js)
37+
38+
facile, tapez le dans la console chrome, et on verra meme qu'il nous l'affiche en balise pour que ça soit plus lisible.
39+
(mais en vrai c'est une variable js normale pas d'inquietude)
40+
41+
--
42+
43+
Maintenant on fait quoi avec des nodes ?
44+
j'ai acces a body ok mais quoi apres ?
45+
comment je modifie la page web en fait ?
46+
47+
--
48+
49+
Et bien sur tout les nodes on a un fonction super simple a utiliser :
50+
querySelector
51+
(donc ça marche sur document.body.querySelector si t'as bien suivi par ce que body c'est un node)
52+
53+
Et ce qui est encore plus stylé c'est que les paramètres c'est juste un selector css.
54+
(la syntaxe que t'utilise en css pour dire quelle div tu veux chopper).
55+
56+
--
57+
58+
par conséquent si je veux chopper la div qui a une class jambon, je devais faire :
59+
document.body.querySelector('.jambon')
60+
facile !
61+
62+
Et si t'as bien suivi, ça va nous renvoyer exactement la premiere div qui se trouve dans body et qui contient la class jambon.
63+
64+
Et le retour de cette fonction ben ça sera... ... ... ..un node !
65+
donc le node qui represente la div avec class jambon :)

[email protected]

Lines changed: 101 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,101 @@
1+
# Le javascript est une syntaxe
2+
3+
## neolectron — 29/05/2019 :
4+
5+
**le javascript est une syntaxe** (a prendre avec des pincettes - lisez bien)
6+
7+
Le js n'a **pas** de stdlib qui permet de lire des fichiers, ça ne peut pas non plus manipuler du html, ni envoyer des requêtes réseau.
8+
9+
**le js n'a pas d'io**
10+
11+
le js ça peut rien faire.. c'est **purement algorithmique**.
12+
13+
ça contient que des while, des if des for.
14+
ça contient quelques types a la con (primitifs ou non), genre Number Array Object Date etc...
15+
donc on peut RIEN faire en javascript. surtout que ... ça n'a pas interpréteur officiel.
16+
17+
donc le js c'est juste une norme, en gros c'est un bout de papier qui dit "quand on tape ça , ça doit faire ça"
18+
(papier rédigé par la société ECMA qui gère aussi la norme du C# btw)
19+
tu peux run du js nulle part par defaut. le programme qui run du js n'existe pas...
20+
21+
--
22+
23+
donc comment ça marche ?
24+
25+
--
26+
27+
les navigateurs ont du implémenter chacun pour leur gueule, un programme qui parse le js, et qui exécute les bonnes instructions en conséquence.
28+
29+
donc ils ont crée des interpréteurs js, qui parse du js et run des trucs en C ou ASM en backend finalement.
30+
31+
sachant que les navigateurs faisaient plus ou moins ce qu'ils voulaient a l'époque, personne vérifiait réellement si tout était normalisé.
32+
33+
donc certains implémentaient des trucs que d'autres n'avaient pas et vice versa.
34+
le seul truc qu'ils avaient en commun, c'est qu'ils devaient injecter dans le langage, des fonctions pour manipuler le HTML sinon ça servirait a rien.
35+
(encore une fois chacun a leur sauce)
36+
37+
--
38+
39+
suite ça on en arrive en 2000, quand les devs en ont eu marre que tout les navigateurs implémentaient leur merde a leur sauce,
40+
41+
donc ils ont fait une lib super-lourde qui fait des if, pour savoir quelle api appeler en fonction des navigateurs.
42+
43+
cette lib c'est jQuery. ça sert QUE a faire des if pour voir si le navigateur implémente ou non la feature que tu veux utiliser.
44+
45+
--
46+
47+
aujourd'hui la plupart des navigateurs suivent a la lettre les normes ECMA, et le support a bien progressé.
48+
(du coup si tu veux pas de support de vieux browser jQuery ne sert qu'a avoir des perfs pourries sur ton site.)
49+
50+
--
51+
52+
ducoup on en était là. on a une syntaxe un peu universelle qui run sur différents interpréteurs.
53+
54+
c'est la guerre des navigateurs , tout le monde s'y met, microsoft/mozilla/apple/google,
55+
56+
spoil: google a gagné.
57+
58+
pourquoi ? => leur navigateur est plus rapide.
59+
pourquoi ? => leur moteur js est plus rapide.
60+
61+
--
62+
63+
donc finallement la guerre des navigateurs c'était une guerre des engine JS.
64+
65+
--
66+
67+
là certains mecs qui aimaient bien la syntaxe du js se sont dit que ça serait chouette d'en faire un langage, et d'avoir une stdlib,
68+
69+
pour lire des fichiers ou même envoyer des requêtes réseau.. ce genre de trucs qui permettraient de faire du js un vrai langage.
70+
71+
Ces mecs, s'appelle la team node (meme si c'était ptet pas les premier a avoir eu l'idée).
72+
73+
Ils ont codé une api en C++ qui permet d'ouvrir/lire/écrire dans des fichiers, faire des requêtes etc etc.
74+
75+
Ils l'ont juste injecté dans le moteur javascript de google (celui qui est dans chrome [le v8 de son pti nom]) et voilà.
76+
On a un moteur js codé par google qui a une stdlib dedans qui peut faire autant de choses que d'autres langages :)
77+
et ça c'est node-js.
78+
79+
--
80+
81+
pour dive un peu plus dans node :
82+
la team node a décidé de faire un language avec des io non-bloquantes.
83+
ce que ça veut dire, c'est que chaque io (des operations sur fichier / network / autres) serait asynchrone.
84+
85+
en gros ça fonctionne avec une file d'attente, par ex :
86+
87+
1- tu fais ta demande de request réseau.
88+
89+
2- node enregistre une fonction nommée callback, qui sera déclenchée a la fin de ta request.
90+
91+
2- tout le reste de ton code continue de s'exécuter même si cette request est pas finie (oui c'est ça l'async)
92+
93+
3- quand la reponse a ta request réseau revient dans l'engine node, ils appellent ton callback en lui filant en paramètre la réponse.
94+
95+
4- le code dans ta fonction de callback s'exécute.
96+
97+
voilà ce que c'est node.
98+
99+
(le schéma de base qui aide pas mal a se représenter le runtime)
100+
101+
![event loop schema](./img/event_loop.png)

README.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
# epic-answers

img/event_loop.png

81.3 KB
Loading

les_pointeurs_en_C_@La_Banane.md

Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
# Les pointeurs en C
2+
3+
## La_Banane — 01/10/2017 :
4+
5+
En C ( et dans le concept de mémoire en général ), tu peux adresser/parcourir une zone mémoire par `bloc de N octets`, en C t'as plusieurs types: `char | short | int | long`, respectivement ( sur la plupart des architectures ) `N = 1 | 2 | 4 | 8`.
6+
7+
Quand tu définis un pointeur avec un type particulier, tu vas informer le compilateur de la manière dont tu veux accéder à la zone mémoire pointée par ce pointeur.
8+
9+
Exemple simple, quand tu définis un pointeur `char *` sur une zone mémoire, tu vas informer le compilateur que tu veux accéder à cette zone mémoire octet par octet, ainsi avec un pointeur définis comme tel: `short *`, tu vas informer le compilateur que tu veux accéder à la zone mémoire 2 octets par 2 octets, ainsi: `char* p = addr`, `*p` va pointer sur la zone mémoire sur un seul octet,
10+
par conséquent avec: `short* p = addr`, `*p` va pointer sur la zone mémoire sur deux octets.
11+
12+
Si tu incrémentes ton pointeur, le compilateur, ayant connaissance de ta volonté sur ton pointeur, va incrémenter l'adresse de manière relative au type défini.
13+
14+
Ainsi en considérant le code suivant:
15+
16+
```
17+
char* p_char = 0;
18+
short* p_short = 0;
19+
20+
printf("p_char next memory addr: %d\np_short next memory addr: %d\n", p_char + 1, p_short + 1);
21+
```
22+
23+
L'output donnera:
24+
25+
```
26+
p_char next memory addr: 1
27+
p_short next memory addr: 2
28+
```
29+
30+
C'est ce qu'on appelle l'arithmétique des pointeurs.
31+
Ainsi, en C il est défini un type `void`, qui informe le compilateur d'une ressource dont le type est "inconnu" ou "sans donnée" par exemple pour informer le compilateur qu'il ne doit pas attendre un retour de fonction sur une fonction donnée: `void func()` (a savoir qu'une variable classique ne peut pas être définie avec un type `void`), ainsi un pointeur défini comme tel: `void *`, défini une zone mémoire dont la manière d'adressage n'est pas définie.
32+
33+
Par défault le type `void` a la même taille que le type `char`, cependant il ne peut pas être utilisé explicitement pour avoir le même comportement, c'est simplement unstable.
34+
35+
On en arrive à une utilisation courante du type `void`, dont profite la fonction `malloc`, c'est à dire le fait de pouvoir caster implicitement un pointeur de type `void`.
36+
37+
Ceci évite d'avoir un warning compilo et de profiter d'une certaine souplesse pour manipuler la zone mémoire allouée.
38+
39+
En effet, si `malloc` retournait arbitrairement un pointeur de type char, alors le compilateur enverrait un warning si tu récupérait la valeur du pointeur dans un pointeur de type différent, par exemple de type short.
40+
41+
On peut simuler:
42+
43+
```
44+
#include <stdio.h>
45+
46+
char* malloc_which_return_char_pointer() {
47+
return NULL;
48+
}
49+
50+
void* malloc_which_return_void_pointer() {
51+
return NULL;
52+
}
53+
54+
int main()
55+
{
56+
char* good_char = malloc_which_return_char_pointer(); /* Le compilateur ne dit rien, le type du pointeur destinataire correspond au type du pointeur expéditeur */
57+
short* bad_short = malloc_which_return_char_pointer(); /* Le compilateur trigger un warning, le type du pointeur destinataire ne correspond pas au type du pointeur expéditeur */
58+
59+
char* _good_char = malloc_which_return_void_pointer(); /* Le compilateur ne dit rien, le type du pointeur destinataire n'a aucune importance, car le type du pointeur expéditeur est de type void */
60+
short* _good_short = malloc_which_return_void_pointer(); /* Le compilateur ne dit rien, le type du pointeur destinataire n'a aucune importance, car le type du pointeur expéditeur est de type void */
61+
62+
return 0;
63+
}
64+
```
65+
66+
En compilant le code ci-dessus, le compilateur te retournera alors:
67+
68+
```
69+
main.c: In function 'main':
70+
main.c:14:24: warning: initialization from incompatible pointer type [-Wincompatible-pointer-types]
71+
short* bad_short = malloc_which_return_char_pointer(); /* Le compilateur trigger un warning, le type du pointeur destinataire ne correspond pas au type du pointeur expéditeur */
72+
^~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
73+
```
74+
75+
Ce qui se passe ici est un `cast implicite` effectué par le compilateur. A noter que l'inverse est aussi possible, c'est à dire caster un type `char *` vers un type `void *` par exemple.
76+
77+
```
78+
int main()
79+
{
80+
char* p_char = 0;
81+
void* p_void = p_char;
82+
short* p_short = p_void; /* Le compilateur ne dit rien */
83+
p_short = p_char; /* Le compilateur trigger un warning */
84+
return 0;
85+
}
86+
```
87+
88+
Enfin, quand tu fais: `char* p = malloc(...)`, ça ne pose théoriquement pas de soucis au compilateur qui comprend nativement ce que tu veux faire, cependant il est bien vu d'effectuer un cast explicite sur la ressource ( ici l'adresse d'une zone mémoire ) retournée par malloc ( ça vaut pour toute fonction qui retourne un pointeur de type void théoriquement ), puisque ça permet d'éviter toute potentielle incompatibilité de compilateur ainsi qu'une meilleur compréhension générale de ta variable, et de son rôle dans la suite du code.

0 commit comments

Comments
 (0)