Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

266
Vistas
Why can we omit a return statement in this usage of the method map()

I am currently going over the WebRTC tutorial on their docs when I noticed that they use forEach after their usage of map(). In order to use forEach and expect a value instead of undefined array, map() would have needed to return an array, which I don't see how it can, because it doesn't return anything.

function updateCameraList(cameras) {
    const listElement = document.querySelector('select#availableCameras');
    listElement.innerHTML = '';
    cameras.map(camera => {
        const cameraOption = document.createElement('option');
        cameraOption.label = camera.label;
        cameraOption.value = camera.deviceId;
    }).forEach(cameraOption => listElement.add(cameraOption));
}
about 4 years ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

The code will not work since the map returns nothing.

Here is an alternative method

function updateCameraList(cameras) {
  document.getElementById('availableCameras').innerHTML = cameras
  .map(({label, deviceId}) => `<option value="${deviceId}">${label}</option>`)
  .join(""); 
}

I learned today that we now can use label instead of text

https://jsfiddle.net/mplungjan/osyLzqk2/

Here is a safer version since there is a tiny possibility for XSS

function updateCameraList(cameras) {
  const sel = document.getElementById('availableCameras')
  cameras.forEach(({label, deviceId}) => {
    const option = new Option(label,deviceId); 
    sel.add(option)
  })
}

And here is a non working attempt of XSS - at least it does nothing in Chrome

const cameras = [{ deviceId : `xss"></option></select><img src="x" onerror="alert(1)" />`  , label:"bla" }]

    function updateCameraList(cameras) { 
      const xssString = cameras
      .map(({label, deviceId}) => `<option value="${deviceId}">${label}</option>`)
      .join("")
      console.log(xssString)
      document.getElementById('availableCameras').innerHTML = xssString; 
    }


updateCameraList(cameras)
<select id="availableCameras"></select>

about 4 years ago · Juan Pablo Isaza Denunciar

0

The code is clearly missing a line. The code should be pushing undefined into an array and that would be appended to the select.

function updateCameraList(cameras) {
    const listElement = document.querySelector('select#availableCameras');
    listElement.innerHTML = '';
    cameras.map(camera => {
        const cameraOption = document.createElement('option');
        cameraOption.label = camera.label;
        cameraOption.value = camera.deviceId;
        return cameraOption;
    }).forEach(cameraOption => listElement.add(cameraOption));
}

Now why would we need to loop twice, it is a bit of a waste of time. So I would just loop once.

function updateCameraList(cameras) {
    const listElement = document.querySelector('select#availableCameras');
    listElement.innerHTML = '';
    cameras.forEach(camera => {
      const cameraOption = document.createElement('option');
      cameraOption.label = camera.label;
      cameraOption.value = camera.deviceId;
      listElement.add(cameraOption));
    });
}
about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda