Code
Multicursor, refactoritzacions, navegació i Emmet — el que separa escriure codi d'escriure text.
Introducció
A Bàsic has fet servir VS Code com un bloc de notes amb colors.
Aquesta pàgina va del que el fa diferent d’un bloc de notes.
Un editor de codi entén el que escrius: sap que això d’aquí és una variable, que aquell nom és una funció, i que la clau que acabes d’obrir s’haurà de tancar.
Tot el que veuràs aquí surt d’aquest fet.
Fes-te una carpeta proves i obre-la amb code .: aniràs provant coses a mesura que llegeixis.
Multicursor
Un editor normal té un cursor.
VS Code en pot tenir vint, i tots escriuen alhora.
És la funció que més temps t’estalviarà, i la que menys gent coneix.
| Alt + clic | Posa un cursor extra on cliques |
| Ctrl + Alt + ↑ / ↓ | Posa un cursor a la línia de sobre o de sota |
| Ctrl + D | Selecciona la següent aparició del que has seleccionat |
| Ctrl + Shift + L | Selecciona-les totes de cop |
| Escape | Torna a un sol cursor |
Ctrl + D és la que faràs servir sempre.
Selecciona una paraula, prem-lo un cop per cada aparició que vulguis, i escriu: canvies totes les que has anat marcant i deixes en pau la resta.
Has copiat aquesta llista d’una web:
Trufa
Pujol
Ketzu
Nala
BoiraConverteix-la en aquesta, amb un sol gest de multicursor:
"Trufa",
"Pujol",
"Ketzu",
"Nala",
"Boira",Mostra la solució
Posa el cursor al principi de Trufa.
Prem Ctrl + Alt + ↓ quatre vegades: tens cinc cursors, un per línia.
Escriu ", prem End per anar al final de cada línia, i escriu ",.
Amb el multicursor, Home i End valen per a cada cursor per separat.
Per això funciona encara que els noms tinguin llargades diferents.
Mou i duplica línies
No cal seleccionar, tallar i enganxar per moure una línia de lloc.
| Alt + ↑ / ↓ | Mou la línia amunt o avall |
| Shift + Alt + ↑ / ↓ | Duplica la línia amunt o avall |
| Ctrl + Shift + K | Esborra la línia |
| Ctrl + / | Comenta o descomenta |
Ctrl + / sap el llenguatge del fitxer.
En un .py posa #, en un .js posa //, i en un .html t’embolcalla la línia amb <!-- i -->.
IntelliSense
Mentre escrius, VS Code et proposa com continuar.
Això és IntelliSense, i no és el mateix que endevinar: la llista surt del que realment existeix en aquell punt del programa.
Si escrius un nom d’objecte i un punt, el que et proposa són les coses que aquell objecte té de veritat.
| Ctrl + Space | Demana suggeriments ara mateix |
| Tab o Enter | Accepta el suggeriment |
| Ctrl + Space un altre cop | Mostra la documentació del suggeriment |
Refactoritzacions
Canviar el nom d’una variable amb «cerca i reemplaça» és una mala idea.
dog també és a dins de dogs, de dog_food i del comentari on parlaves de gossos.
VS Code sap quins d’aquests són la mateixa variable, i només toca aquells.
| F2 | Canvia el nom del símbol, a tot el projecte |
| Ctrl + . | Accions ràpides: el que es pot fer aquí |
| Shift + Alt + F | Formata el fitxer |
Ctrl + . és la bombeta que et surt al marge quan hi ha un error o un avís.
T’ofereix el que té sentit en aquell punt: importar el que falta, treure una variable que no fas servir, extreure una funció.
Escriu aquest fitxer gossos.py:
=
=
# el gos que més borda
Canvia la variable gos per mascota sense tocar res més.
Mostra la solució
Posa el cursor a sobre de gos i prem F2.
Escriu mascota i prem Enter.
Canvien les dues aparicions de la variable gos.
No canvia gossos, ni la paraula «gos» del comentari, que és el que volies.
Amb «cerca i reemplaça» hauries acabat amb mascotas i un comentari sense sentit.
Navega pel codi
En un projecte de veritat passaràs més temps llegint codi que escrivint-ne.
| Ctrl + clic, o F12 | Ves on està definit això |
| Alt + ← | Torna d’on venies |
| Shift + F12 | Ensenya’m tots els llocs on es fa servir |
| Ctrl + Shift + O | Ves a un símbol d’aquest fitxer |
| Ctrl + T | Ves a un símbol de tot el projecte |
Alt + ← és la parella imprescindible de F12.
Sense ella t’endinses en el codi i no saps tornar.
Cerca i reemplaça
Ctrl + F busca dins del fitxer, i Ctrl + Shift + F busca a tot el projecte.
Els tres botonets de la caixa de cerca són importants:
Aa | Distingeix majúscules de minúscules |
ab | Només paraules senceres |
.* | El que escrius és una expressió regular |
El tercer és el que fa que la cerca deixi de ser una lupa i passi a ser una eina.
Estàs llegint una vista prèvia.
Inicia sessió amb Google per llegir la pàgina completa.
Inicia sessió amb GoogleAmb qualsevol compte de Google. Només et demanarem que acceptis les condicions del servei.