Nombres de Variables y Funciones Correctos en JavaScript

Clase 7 de 24 • Curso de Clean Code y Buenas Prácticas con JavaScript

Contenido del curso

Introducción al Clean Code

Nombre y uso de las variables

Ámbito de las variables

Funciones

Clases

Optimizaciones

Cierre

24
Sigue aprendiendo JavaScript
00:55 min

Tomar examen

Ya aprendiste como nombrar correctamente tus variables según el tipo de dato que representen, así que ahora ponte a prueba. Te dejaré a continuación una lista de variables con nombres mal definidos y tú en los comentarios tendrás la misión de resolver de acuerdo a las reglas de nomenclatura cómo deberían de ser llamadas correctamente.

Arreglos

const x = [1, 2, 3, 4, 5]
const name = ['Cande', 'Alex', 'Mariana']
const colors = ['red', 'green', 'blue']

Booleanos

const active = true
const correct = false
const write = true
const user = false

Números

let result = 3543
const y = 20
const PI = 3.14159

Funciones

sendAlertIfIsEmpty()
ifNotExistCreateNewObject()
password()
results()

Clases

class School {}
class NewService {}
class ImplementNewAccount {}

Comentarios

Carina Payleman

student•

Tarjetita Antispoiler, dale ❤ para que vaya hasta arriba y no spoilemos futuros alumnos que quieran intentar el ejercicio por favor 😁 Mi solución más abajo 👇 . . . . . . . . . . . . . . . .

//Arrays:
const numberList = [1, 2, 3, 4, 5];
const nameList = ['Cande', 'Alex', 'Mariana'];
const colorList = ['red', 'green', 'blue'];

//Booleanos:
const isActive = true;
const isCorrect = false;
const canWrite = true;
const hasUser = false;

//Números:
let totalResult = 3543;
const minNumber = 20 //Me tomé la libertad de elegir el sufijo "min" al no tener más contexto. 
const PI = 3.14159 //Considero que es correcto así.

//Funciones:
sendAlert()
createObject()
setPassword()
getResults()

//Clases:
class School {} //Considero que es correcto así.
class Service {}
class Account {}

Daniel Pacheco

student•

Los arrays deberian ser en plural, namesList

Carina Payleman

student•

Sip! Pero si pasamos "list" al inglés, el sustantivo pasa a ser singular ("number list" a diferencia de "list of numbers") como en uno de los ejemplos de la prof:

const userList = ["PaylemanC", "danielpachecosts"];

Así lo entendí 😁

Jhon Eduard Bocanegra Ortiz

student•

Mis aportes:

Irving Juárez

student•

En la ultima de clases se pudieran mejorar los nombres. Ya que como tal School es muy generico. Pudiera ser SchoolDepartment. NewService es super genérico, pero Service sigue siendo genérico. Al mejor pudiera ser escribir un servicio en especifico como DatabaseConnection. Account me parece que no es tan genérico, puede estar bien

Miguel Prada

student•

Hay que tener presente que esto de muy generico/poco generico tambien depende mucho del dominio que se está modelando. School puede ser muy generico para algo como platzi, pero para otros negocios puede ser suficiente. Service también a simple vista suena muy genérico pero puede ajustarse bien en algunos escenarios

Ilana Natalia Monserrat Delgado Ozuna

student•

//Arrays:

const numbersList = [1, 2, 3, 4, 5]

const users= ['Cande', 'Alex', 'Mariana']

const colors = ['red', 'green', 'blue']

//Booleanos:

const isActive = true

const isCorrect = false

const canWrite = true

const hasUser = false

//Números

let totalResult = 3543

const minNumber = 20

const PI = 3.14159

//Funciones

sendAlert()

createObject()

setPassword()

getResults()

//Clases

class School {}

class Service {}

class Account {}

Maria Alejandra Luna Tito

student•

// Arrays
const numbers = [1, 2, 3, 4, 5];
const names = ["Cande", "Alex", "Mariana"];
const colors = ["red", "green", "blue"];

// Booleans
const isActive = true;
const isCorrect = false;
const canWrite = true;
const hasUser = false;

// Numbers
let totalResult = 3543;
const maxUsers = 20;
const PI = ["red", "green", "blue"];

// functions
sendAlert();
createUser();
getPassword();
getResults();

// class
class School {}
class UserService {} // considero que Service es un nombre muy generico
class Account {}

joel jose

student•

Booleanos // const active = true const isActive = true // const correct = false const isCorrect = false // const write = true const canWrite = true // const user = false const hasUser = false

Números // let result = 3543 let positionZ = 3543 // const y = 20 const positionY = 20 const PI = 3.14159

Funciones // sendAlertIfIsEmpty() sendAlert() // ifNotExistCreateNewObject() createObject() // password() setPassword() // results() getResults()

Clases // class School {} class School {} // class NewService {} class Service {} // class ImplementNewAccount {} class Account {}

karen Meyhuay Zarzosa

student•

const numbersList = [1,2,3,4,5]

const namesList = ['Cande', 'Alex', 'Mariana']

const colorsList = ['red', 'green', 'blue']

const isActive = true const isCorrect = false const canWrite = true const isUser = false

let allResult = 3543 const minValue = 20 const pi = 3.14159

sendAlert() createObject() setPassword() getResults()

class school {} class newService {} class newAccount {}

Samuel Chávez

student•

Arreglos:

const numberList = [1, 2, 3, 4, 5]

const userNames = ['Cande', 'Alex', 'Mariana']

const colorNames = ['red', 'green', 'blue']

Booleanos:

const isActive = true const isCorrect = false const canWrite = true const hasUser = false

Números:

let totalResult = 3543 const maxValue = 20 const totalPI = 3.14159

Funciones:

sendAlert() isCreateObject() setPassword() getResults()

Clases:

class Classroom {} class RegisterService {} class UserAccount {}

Williams Garduño

student•

Arreglos:

const numberList = [1, 2, 3, 4, 5]

const nameList = ['Cande', 'Alex', 'Mariana']

const colorsList = ['red', 'green', 'blue']

Booleanos

const isActive = true; const isCorrect = false; const canWrite = true; const hasUser = false;

Números

let totalResult = 3543; const letterY = 20 const PI = 3.14159

Funciones

sendAlert() newObject() setPassword() getResults()

Clases

class School {} class Service {} class Account {}

Stiven Trujillo

student••

const userAges = [1, 2, 3, 4, 5] // dandole un contexto por que sin uno pailas

const userFirstNames = ['Cande', 'Alex', 'Mariana']

const primaryColors = ['red', 'green', 'blue']

---

const isActive= true

const isCorrect = false

const canWrite= true

const hasUser = false

---

let totalResult = 3543

const maxSize = 20 // dandole un contexto

const PI = 3.14159 // ni idea, para mi esta bien

---

sendAlert()

createObject()

setPassword()

getResults()

---

class HarrySchool {} // evitar generico, creo

class SchoolService {} // evitar generico

class Account {}

Johan Montoya

student•

Arreglos

numberList userNames colorAvailables

Booleanos isActive isCorrect canWrite existUser

Números totalResults shiftY PI

Funciones sendAlert createObject

modifyPassword getResults

Clases School Service Account

David Huanca Ledezma

student•

const numberList = [1, 2, 3, 4, 5] const names = ['Cande', 'Alex', 'Mariana'] const colors = ['red', 'green', 'blue']

Johan Sebastian

student•

// Arreglos
const numbersList = [1, 2, 3, 4, 5];
const userNames = ['Cande', 'Alex', 'Mariana'];
const colorNames = ['red', 'green', 'blue'];

// Booleanos
const isActive = true
const isCorrect = false
const canWrite = true
const hasUser = false

// Números
let maxNumber = 3543
const minNumber = 20
const PI = 3.14159 

// Funciones
sendAlert()
createObjetc()
getPassword()
getResults()

// Clases
class School {}
class UserService {}
class Account {}

Maria Alejandra Luna Tito

student•

´´´js

const age = 28;console.log("valor: ", age); { const age = 30; console.log("valor: ", age);} console.log("valor: ", age);age = age * 2; console.log("valor: ", age); /// const currentDate = new Date(); // lenguaje ubicuo function getUser(id) { return { id };} getUser(10); // boolean // isValid = trueconst canRead = false;const isOk = true;const isAdmin = false; // number// used max, min, total // functions// inician verbo - sustantivo - y ser concisas // funciones de predicado // inician con// getUser()// setUser()// isValidUser() (las de predicado) // Arreglosconst numbers = [1, 2, 3, 4, 5];const names = ["Cande", "Alex", "Mariana"];const colors = ["red", "green", "blue"]; // Booleanosconst isActive = true;const isCorrect = false;const canWrite = true;const hasUser = false; // Números let totalResult = 3543;const maxUsers = 20;const PI = ["red", "green", "blue"]; // functions sendAlert();createUser();getPassword();getResults(); // class class School {} class UserService {} // considero que service es un nombre muy comun podria ser UserService class Account {}

´´´

Hector Rodriguez

student•

Solución al ejercicio:

Arreglos

const firstNumbers = [1,2,3,4,5];

const studentNames = ["Cande","Alex","Mariana"];

const primaryColors = ["red","green","blue"];

Booleanos

const isActive = true;

const hasCorrect = false;

const canWrite = true;

const isUser = false;

Números

let totalSale = 3543;

const minNumber = 20;

const totalPI = 3.14159;

Funciones

sendAlert();

createObject();

setPassword();

getResults();

Clases:

class College{}

class newLogin {}

class newAccount {}

Luis Felipe Medina Álvarez

student•

Esta es mi aportación:

const numberList = [1, 2, 3, 4, 5]
const nameList = ['Cande', 'Alex', 'Mariana']
const colorList = ['red', 'green', 'blue']

const isActive = true
const isCorrect = false
const canWrite = true
const hasUser = false

let totalResult = 3543
const minExpense = 20
const totalPI = 3.14159 

sendAlert()
CreateNewObject()
setPassword()
getResults()


class School {}
class Service {}
class Account {}
```const numberList = \[1, 2, 3, 4, 5]const nameList = \['Cande', 'Alex', 'Mariana']const colorList = \['red', 'green', 'blue']
const isActive = trueconst isCorrect = falseconst canWrite = trueconst hasUser = false
let totalResult = 3543const minExpense = 20const totalPI = 3.14159&#x20;
sendAlert()CreateNewObject()setPassword()getResults()

class School {}class Service {}class Account {}

Guillermo Antonio Sanchez Escobar

student•

// Arreglos
const numberList = [1, 2, 3, 4, 5]
const userNames = ['Cande', 'Alex', 'Mariana']
const colorList = ['red', 'green', 'blue']

// Booleanos
const isActive = true
const isCorrect = false
const canWrite = true
const hasUser = false

// Números
let finalResult = 3543
const positionY = 20
const PI = 3.14159 

// Funciones
sendAlert()
createObject()
setPassword()
getResults()

// Clases
class School {}
class Service {}
class Account {}

MAAT INTELIGENCIA AVANZADA S.A.P.I. de C.V

student•

//Arreglos
const numberList = [1, 2, 3, 4, 5]
const nameList = ['Cande', 'Alex', 'Mariana']
const colorList = ['red', 'green', 'blue']

//Booleanos
const isActive = true
const isCorrect = false
const canWrite = true
const isValidUser = false

//Números
let totalColors = 3543
const minColors = 20
const PI = 3.14159

//Funciones
sendAlert()
createObject()
addPassword()
getResults()


//Clases
class School {}
class Service {}
  class Account {}

Cesar Haziel Pineda Pacheco

student•

const numsList = [1, 2, 3, 4, 5]

const namesList = ['Cande', 'Alex', 'Mariana']

const colorsList = ['red', 'green', 'blue']

const isActive = true

const isCorrect = false

const canWrite = true

const hasUser = false

let totalResult = 3543

const coordY = 20

const PI = 3.14159

sendAlert()

createNewObject()

setPassword()

getResults()

class School {}

class Service {}

class Account {}

Bryam Mauricio Rios Cordoba

student•

Mi aporte. Saludos.

JUAN SEBASTIAN SERRANO ARENAS

student•

Mi aporte 🐻

// Arreglos

const numbers = [1, 2, 3, 4, 5]
const names = ['Cande', 'Alex', 'Mariana']
const colorItems = ['red', 'green', 'blue']

// Booleanos

const isActive = true
const isCorrect = false
const needWrite = true
const hasUser = false

// Números

let area = 3543
const HEIGHT = 20
const PI = 3.14159 

// Funciones

handleSendAlert()
handleNewObject()
getPassword()
calculateResult()

// Clases

class SchoolManager {}
class UserService {}
class AccountCreator {}

//Arrays:
const numberList = [1, 2, 3, 4, 5];
const nameList = ['Cande', 'Alex', 'Mariana'];
const colorList = ['red', 'green', 'blue'];

//Booleanos:
const isActive = true;
const isCorrect = false;
const canWrite = true;
const hasUser = false;

//Números:
let totalResult = 3543;
const minNumber = 20 //Me tomé la libertad de elegir el sufijo "min" al no tener más contexto. 
const PI = 3.14159 //Considero que es correcto así.

//Funciones:
sendAlert()
createObject()
setPassword()
getResults()

//Clases:
class School {} //Considero que es correcto así.
class Service {}
class Account {}

// Arrays
const numbers = [1, 2, 3, 4, 5];
const names = ["Cande", "Alex", "Mariana"];
const colors = ["red", "green", "blue"];

// Booleans
const isActive = true;
const isCorrect = false;
const canWrite = true;
const hasUser = false;

// Numbers
let totalResult = 3543;
const maxUsers = 20;
const PI = ["red", "green", "blue"];

// functions
sendAlert();
createUser();
getPassword();
getResults();

// class
class School {}
class UserService {} // considero que Service es un nombre muy generico
class Account {}

// Arreglos
const numbersList = [1, 2, 3, 4, 5];
const userNames = ['Cande', 'Alex', 'Mariana'];
const colorNames = ['red', 'green', 'blue'];

// Booleanos
const isActive = true
const isCorrect = false
const canWrite = true
const hasUser = false

// Números
let maxNumber = 3543
const minNumber = 20
const PI = 3.14159 

// Funciones
sendAlert()
createObjetc()
getPassword()
getResults()

// Clases
class School {}
class UserService {}
class Account {}

const numberList = [1, 2, 3, 4, 5]
const nameList = ['Cande', 'Alex', 'Mariana']
const colorList = ['red', 'green', 'blue']

const isActive = true
const isCorrect = false
const canWrite = true
const hasUser = false

let totalResult = 3543
const minExpense = 20
const totalPI = 3.14159 

sendAlert()
CreateNewObject()
setPassword()
getResults()


class School {}
class Service {}
class Account {}
```const numberList = \[1, 2, 3, 4, 5]const nameList = \['Cande', 'Alex', 'Mariana']const colorList = \['red', 'green', 'blue']
const isActive = trueconst isCorrect = falseconst canWrite = trueconst hasUser = false
let totalResult = 3543const minExpense = 20const totalPI = 3.14159&#x20;
sendAlert()CreateNewObject()setPassword()getResults()

class School {}class Service {}class Account {}

// Arreglos
const numberList = [1, 2, 3, 4, 5]
const userNames = ['Cande', 'Alex', 'Mariana']
const colorList = ['red', 'green', 'blue']

// Booleanos
const isActive = true
const isCorrect = false
const canWrite = true
const hasUser = false

// Números
let finalResult = 3543
const positionY = 20
const PI = 3.14159 

// Funciones
sendAlert()
createObject()
setPassword()
getResults()

// Clases
class School {}
class Service {}
class Account {}

//Arreglos
const numberList = [1, 2, 3, 4, 5]
const nameList = ['Cande', 'Alex', 'Mariana']
const colorList = ['red', 'green', 'blue']

//Booleanos
const isActive = true
const isCorrect = false
const canWrite = true
const isValidUser = false

//Números
let totalColors = 3543
const minColors = 20
const PI = 3.14159

//Funciones
sendAlert()
createObject()
addPassword()
getResults()


//Clases
class School {}
class Service {}
  class Account {}

// Arreglos

const numbers = [1, 2, 3, 4, 5]
const names = ['Cande', 'Alex', 'Mariana']
const colorItems = ['red', 'green', 'blue']

// Booleanos

const isActive = true
const isCorrect = false
const needWrite = true
const hasUser = false

// Números

let area = 3543
const HEIGHT = 20
const PI = 3.14159 

// Funciones

handleSendAlert()
handleNewObject()
getPassword()
calculateResult()

// Clases

class SchoolManager {}
class UserService {}
class AccountCreator {}

Nombres de Variables y Funciones Correctos en JavaScript

Introducción al Clean Code

Deuda técnica y refactorización de código

Reglas del diseño simple

Qué es Clean Code

Nombre y uso de las variables

Uso correcto de var, let y const

Reglas para la nomenclatura

Cómo nombrar según el tipo de dato