인터페이스 관련 질문 드립니다 .

interface Shape {
  getArea(): number; 
}
class Circle implements Shape {
  constructor(public radius: number) {
    this.radius = radius;
  }
  getArea() {
    return this.radius * this.radius * Math.PI;
  }
}

class Rectangle implements Shape {
  constructor(public width: number, public height: number) {
    this.width = width;
    this.height = height;
  }
  getArea() {
    return this.width * this.height;
  }
}

const shapes: Shape[] = [new Circle(5), new Rectangle(10, 5)];

shapes.forEach(shape => {
  console.log(shape.getArea());
});

공부하다가 가져온 예제 코드입니다. 
위 코드에서 const shapes: Shape[] = [new Circle(5), new Rectangle(10, 5)];  부분 질문 드립니다. 
Circle과 Rectangle로 생성한 객체의 타입이 왜 Shape이 되는건지 궁금합니다. 
 
추가적으로

interface Person {
  name: string;
  age?: number; 
}
interface Developer extends Person {
  skills: string[];
}

const person: Person = {
  name: '김사람',
  age: 20
};

const expert: Developer = {
  name: '김개발',
  skills: ['javascript', 'react']
};

const people: Person[] = [person, expert];

이 코드에서도 person,expert가 왜 Person타입이 되는건지도 궁금합니다. 
expert는 Developer 타입이고 , Developer 타입은 Person타입을 확장해서 skill 이라는 속성을 추가적으로 가지고 있는데 
왜 Person 타입이 되는건지 모르겠습니다 ㅠㅠ