The function is not looping because you are not resetting n - after the first up down movement, n goes out of bounds, grid.style.bottom = pixels[n] + 'px'; tries to set the stile to undefined +'px' and fails, and the bar stays where it is.

I added n = n % pixels.length; to reset n once it goes out of bounds.

var n = 0;
var grid = document.querySelector('.grid');

function move() {
  const pixels = [200, 196, 192, 188, 184, 180, 176, 172, 168, 164, 160, 164, 168, 172, 176, 180];
  const style = grid.style.bottom
  const computedStyle = window.getComputedStyle(grid)
  console.log('bottom from computed style', computedStyle.bottom)
  n = n % pixels.length;
  grid.style.bottom = pixels[n] + 'px';
  n++;
}

move();
setInterval(move, 90);

.grid {
  background-color: blue;
  height: 20px;
  width: 100px;
  left: 100px;
  bottom: 200px;
  position: absolute;
}

<div class="grid"></div>

You can have a Boolean checking once you get at the end of your array and once you do you start to decrement your n variable. This way it will go from 200px -> 180px -> 200px

let grid = document.querySelector(".grid");
let n = 0;
let bool = true

function move() {
  const pixels = [200, 196, 192, 188, 184, 180, 176, 172, 168, 164, 160, 164, 168, 172, 176, 180]
  const style = grid.style.bottom;
  const computedStyle = window.getComputedStyle(grid);
  console.log("bottom from computed style", computedStyle.bottom);
  grid.style.bottom = pixels[n] + "px";
  
  if(n === pixels.length - 1 ){
    bool = false
  } else if(n === 0){
    bool = true
  }
  bool ? n++ : n-- 
}

move();
setInterval(move, 90);

.grid {
  background-color: blue;
  height: 20px;
  width: 100px;
  left: 100px;
  bottom: 200px;
  position: absolute;
}

<div class="grid"></div>

Instead of incrementing in an interval, better compute the position based on the time passed since start.

According to your pixels array and your interval, you move 40px up/down every 900ms. (10 steps of 4px / 90ms)

const start = Date.now()

function move(){
  const time = Date.now() - start;

  let t = time / 900; // the time passed in terms of up/down strokes

  // t = t % 1;   // turns this into a sawtooth pattern, just up-strokes
  // not what we want, we want every other stroke to be a down-stroke.

  t = t&1 ? // every other stroke
    (1 - t%1) : // move down
    (t%1); // otherwise mode up

  // now we have out position as a percentage value 0..1;
  // let's compute the pixels.

  const pos = 200 - 40*t; // start at 200px and travel a fraction of 40px down.

  grid.style.bottom = pos + "px";

  // rAF is way smoother than your 90ms interval.
  requestAnimationFrame(move);
}

move();

const DURATION = 900;
const grid = document.querySelector('.grid');
const start = 0;

function move() {
  let t = (Date.now() - start) / 900;
  t = t&1 ? 1-t%1 : t%1;  // zig-zag
  //t = t%1;  // sawtooth; try this instead of the zig-zag and see/understand the difference.

  //add some easing; try it.
  //t = t*t*(3-2*t);
  
  grid.style.bottom = 200 - 40*t + "px";

  requestAnimationFrame(move);
}

move();

.grid {
  background-color: blue;
  height: 20px;
  width: 100px;
  left: 100px;
  bottom: 200px;
  position: absolute;
}

<div class="grid"></div>