TypeScript Type Alias

Giriş

Type Alias kullanımı type anahtar kelimesi ile başlar. | karakteri (or karakter) seçenekler birleştirilir

Örnek - Java ile Farkı

Java'da MyBase ve bundan kalıtan MyFoo ve MyBar sınıfları olsun. Ben her yere MyBase sınıfını geçerim. Typescript ile çalışırken 

interface MyBase {...}
interface MyFoo {...}
interface MyBar  {...}

tanımlanıyor. Daha sonra bu MyFoo ve MyBar nesnelerini birleştiren bir type tanımlanıyor. Yani şöyle yapılıyor.

export type MyBaseType = MyFoo | MyBar

ve her yere MyBaseType geçiliyor.

Örnek

Şöyle yaparız

type FruitName = "apple"|"banana"|"peach"|"lime" //todo add more fruit names
const fruits: FruitName[] = ['apple', 'banana'] //valid
const fruits: FruitName[] = ['apple', 'dog'] //not valid

Örnek
Şöyle yaparız

interface Valid {
  isValid: true;
}

interface Invalid {
    isValid: false;
    errorText: string;
}

type ValidationResult = Valid | Invalid

const validate = (n: number): ValidationResult => {
    return n === 4 ? { isValid: true } : { isValid: false, errorText: "num is not 4" }
}

HTML Video Tag

Giriş

source Tag

video tag içinde <source...> tag bulunur. Açıklaması şöyle

Inside <video> tag you place <source> tag with two important attributes. The first one is src attribute used to point out video which we want to display. The second important field is type, responsible for keeping our video format 

You can also write some text inside <video> </video> tags and it will be used as fallback in browsers that do not support the element. As for now, even Internet Explorer supports it so this scenario is almost impossible.

Örnek

Şöyle yaparız. Burada source içinde video dosyası ve type içinde de mp4 olduğu belirtiliyor.

<video id="player"
       controls
       crossorigin
       playsinline
       data-poster="https://.../View_From_A_Blue_Moon_Trailer-HD.jpg>">
  <source src="https://.../View_From_A_Blue_Moon_Trailer-720p.mp4"
          type="video/mp4"/>
</video>

autoplay ve muted Alanı

Açıklaması şöyle

I have added autoplay and muted attributes for video to start playing automatically

I have added controls attribute to show embedded player controls

Örnek

Şöyle yaparız

<video width="1280" height="960" muted autoplay controls>
  <source src="http://localhost:8090/api/files/default" type="video/mp4">

  Update your browser to one from XXI century
</video>

Örnek

Şöyle yaparız. autoplay = "autoplay" yazmak ile sadece autoplay yazmak arasında fark var mı bilmiyorum

<video muted="muted" autoplay="autoplay" loop="loop" 
       src="/static/img/factory.mp4">
</video>

loop Alanı

Örnek
Şöyle yaparız

<video id="myVideo" width="100%" controls autoplay loop muted="muted">
  <source src="test.mp4" type="video/mp4">
  Your browser does not support HTML5 video.
</video>

Video bitince bir şey çalıştırmak için şöyle yaparız

document.getElementById('myVideo').addEventListener('ended',function() {
  ...
},false);

Closure

Örnek
Bir düğmeye tıklanınca setInterval() çalıştırılsın, tekrar tıklanınca iptal edilsin isteyelim.Bu durumda setInterval() çağrısının sonucunu saklamamız gerekir. Ancak sonucu global bir değişkende değil click() içine verilen function'da tanımlamak isteyelim. Bu durumda Closure kullanmak gerekir.
Şöyle yaparız.

$("#run").click((function(){
    var run; //Closure tanımlanıyor
    return function() {
      var $this = $(this);
      if($this.text() === "run"){
        run = setInterval(()=>{
          model.run();
        },50);
        $this.text("stop");
      }
      else{
        clearInterval(run);
        $this.text("run");
      }
    } //End of return function
  }() //Return edilen function çalıştırılır
));//click içine verilen function