object literals

http://exploringjs.com/es6/index.html object literal 로 검색하면 3개 나옴.

4.12 From function expressions in object literals to method definitions syntax 가 좀 바뀐거고.

14.2 New features of object literals 3가지 정도로 구분해서 보면 되고.

14.9 FAQ: object literals super 쓸수 있다니 무시하고.

function expression / method definition

In ES5 object literals, methods are created like other properties. The property values are provided via function expressions.

var obj = {
    foo: function () {
        ···
    },
    bar: function () {
        this.foo();
    }, // trailing comma is legal in ES5
}

ES6 has method definitions, special syntax for creating methods:

const obj = {
    foo() {
        ···
    },
    bar() {
        this.foo();
    },
}

New features

[1] Method Definition

[1] Property value shorthands

[1] computed property keys

class Person {
  constructor(name = 'Anonymouse', age = 0){
    this.name = name;
    this.age = age;
  }
  getGretting(){
    return `Hi. I am ${this.name}`;
  }
  getDescription(){
    return `${this.name} is ${this.age} year(s) old.`;
  }
}
class Student extends Person {
  constructor(name, age, major){
    super(name, age);
    this.major = major;
  }
  hasMajor(){
    return !!this.major;
  }
  getDescription(){
    let description = super.getDescription();
    if (this.hasMajor()){
      description += ` Their major is ${this.major}.`;
    }
    return description
  }
  // getter/setter
  get name(){
      return this.name;
  }
  set name(name){
      this.name = name;
  }
  // generator
  * myGrades(){
      yield 'B';
      yield 'A';
  }
}
const me = new Student('jinia', 21, 'Computer Science');
console.log(me);                     // Student {name: "jinia", age: 21, major: "Computer Science"}
const other = new Student();
console.log(other);                  // Student {name: "Anonymouse", age: 0, major: undefined }
console.log(me.hasMajor());          // true
console.log(other.hasMajor());       // false
console.log(me.getDescription());    // jinia is 21 year(s) old. Their major is Computer Science.
console.log(other.getDescription()); // Anonymouse is 0 year(s) old.

console.log(me, me.name);   // Student {name: "jinia", age: 21, major: "Computer Science"} jinia
me.name = 'jin';
console.log(me, me.name);  // Student {name: "jin", age: 21, major: "Computer Science"} jin
const iter = me.myGrades();
console.log(iter.next());   // {value:"B", done:false}
console.log(iter.next());   // {value:"A", done:false}
console.log(iter.next());   // {value:undefined, done:true}

var name = 'jinia';
var age = 21;
var me = {
    name: 'jinia',
    age: 21
};
console.log(me); // {name: "jinia", age: 21}
var me2 = {
    name,
    age
};
console.log(me2); // {name: "jinia", age: 21}

var key = 'major';
function getKey(){
    return 'hello';
}
var me = {
    name: 'jinia',
    [key]: 'Computer Science',
    ['age']: 21,
    [getKey()]: 'Hi'
}
console.log(me); // {name: "jinia", major: 'Computer Science', age: 21, hello: 'Hi'}

Promise

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise

if( navigator.mediaDevices != undefined ) {
    navigator.mediaDevices.enumerateDevices().then( deviceInfos => { 
        deviceInfos.forEach( deviceInfo => { 
            if(deviceInfo.kind=='videoinput'){cameraCnt++}
            else if(deviceInfo.kind=='audioinput'){micCnt++} 
        } ); 
        console.log(deviceInfos);
    } ).catch( error => console.log(error) );
} else {
    console.log('지원하지 않는 기기 입니다.');
}

if( navigator.mediaDevices != undefined ) {
    navigator.mediaDevices.getUserMedia({audio:true, video:true}) // MediaStream 객체를 return함. 
    .then( stream => {
        console.log(stream); // MediaStream
        document.getElementById('localVideo').srcObject = stream;
    }).catch( error => {
        console.log(error);
    });
}

function button_onclick_signup(){
    email = document.getElementById('signup_email').value;
    password = document.getElementById('singup_password').value;
    firebase.auth().createUserWithEmailAndPassword(email, password).then( () => {
        document.getElementById('signup_page').style.display = "none";
    }).catch(error => {
        console.log(error);alert(error.message)
    });
}
function button_onclick_signin(){
    email = document.getElementById('email').value;
    password = document.getElementById('password').value;
    firebase.auth().signInWithEmailAndPassword(email, password).catch( error => {
        console.log(error);alert(error.message);
        if(error.code=='auth/user-not-found'){
            document.getElementById('signup_page').style.display = "block";
            document.getElementById('login_page').style.display = "none";
            document.getElementById('signup_email').value = document.getElementById('email').value;
        }
    });
}
function button_onclick_signout(){
    document.getElementById('room_page').style.display = "none";
    firebase.auth().signOut().then( () => console.log("sign out") ).catch( error=> console.log(error) );
}