IT rekvalifikace s garancí práce. Seniorní programátoři vydělávají až 160 000 Kč/měsíc a rekvalifikace je prvním krokem. Zjisti, jak na to!
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.

Diskuze: Vytvoreni objektu - javascript

Aktivity
Avatar
Kamil
Člen
Avatar
Kamil:23.2.2022 20:01

Ahoj,

nechápu tuto syntaxi:

function Fraud(){
           this.name='Rich Evans';
           this.disease='diabetes';
           this.health=23;

           }
       var rich = new Fraud();

Zkusil jsem: Myslel jsem si, že k vytvoření objektu je potřeba třída, konstruktor atpd. Tady vidím funkci... Moc to nechápu.

Chci docílit: Mohl by mi to někdo v Javascriptu vysvětlit? Díky.

 
Odpovědět
23.2.2022 20:01
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:24.2.2022 8:31

Toto je bezne vytvareni objektu v js. Ja si tam jeste davam slovo class.

function classFraud()
           {
           this.name = 'Rich Evans';
           this.disease = 'diabetes';
           this.health = 23;
           }

var rich = new classFraud();

Jinym zpusobem je mozne to delat pres asociativni pole.

       var rich = {name: 'Rich Evans', disease:'diabetes', health:23};
var rich2 = {}
rich2.name =  'Rich Evans';
rich2.disease=  'diabetes';

Ale, to je naprd, protoze to nemuzes zopakovat jako class. Nebo tam muzes pridat pomocnou funkci

function classFraud()
           {
           return {name: 'Rich Evans', disease:'diabetes', health:23};
           }
var rich = new classFraud();

Nebo muzes pouzit let-encrypt syntaxy https://developer.mozilla.org/…ence/Classes

class Animal {
  speak() {
    return this;
  }
  static eat() {
    return this;
  }
}

let obj = new Animal();

Nebo si muzes pridat framework, VUE (React, jiny) a psat pomoci VUE. https://blog.openreplay.com/…s-components

@Component
export default class Counter extends Vue {

  count = 0;

  public increment(): void {
    this.count++;
  }

  public decrement(): void {
    this.count--;
  }

}

A tohle treba pouzivam ja.

function classApp(props)
           {
           var selfApp = this;
           this.props = {};
           this.func = {};
           var fnApp = this.func;
           this.props.name = 'Rich Evans';
           this.props.disease = 'diabetes';
           this.props.health = 23;
           this.func.add = function() { selfApp.props.health = selfApp.props.health + 54; };
           this.func.init = function(props) {
                      selfApp.props.health = isExist(props.health) ? props.health : 0;
                       fnApp.add()
                      };
           this.func.init(props);
           }

var rich = new classApp( {name: 'Rich Evans', disease:'diabetes', health:23} );

Predam funkci asociativni pole, ze ktereho si vyzobe properties (options). A pak je predavam dalsim v class. Js tusim stale jeste nema klasicke class, tak se to musi resit takovymi divnymi berlickami. Doporucuje se prototype. A pokud pracujes s casovaci (setTimeout, setInterval), tak tam musis pouzivat prave to self, protoze s thisem si to moc nerozumi :) Cili ,this pouzivam jen na prvni urovni typu construct. Ale snazim se vse presunout spis do funkce init.

 
Nahoru Odpovědět
24.2.2022 8:31
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:24.2.2022 8:54

Vysvetlit, no, nevim...

function aaa () {...} // definice funkce/objektu jako window.aaa()
var bbb = window['aaa']; // presmerujes ukazatel funkce do promene, ta pak spousti aaa
var bbb = window.aaa;
bbb();
var bbb = 3;

var aaa = function () {...} // definice funkce jako window.aaa()
var bbb = aaa;
bbb();

// no, ale, kdyz potrebujes aby se nepriradil cely ukazatel, ale uplne novy objekt,
// tak se pouziva NEW, ktery vytvori stejny objekt
var aaa = function () {this.src=''} // definice funkce jako window.aaa()
var bbb = new aaa() // viz treba img = new Image()
bbb.src = "123";
var ccc = new aaa()
ccc.src = "456";
alert(bbb.src)  // 123
alert(ccc.src)          // 456 - bez new by to vypsalo stejna cisla

Cili, js umoznuje vyuzit jakoukoliv funkci jako objekt pro klonovani pomoci new. A vlastne to slouzi jako class, slovo, ktere nekdo vymyslel az po napsani javascriptove syntaxe. Ale zatim jeste nikdo js neupravil o class, protoze by asi museli pridavat furu dalsich pravidel, prepisovat knohovny, ktere js kontroluji... Nevim, kde to vazne :)

A s tim window. Je to tak, ze zakladni objekt je window. Vse, co vytvoris se da adresovat pres window. Ale, slouzi to take pro prepisovani obsahu v jinych oknech, ktere si vytvoris jako window.open(), zadavas tam name pres ktere se do okna dostanes. Totez delat s tagem FRAME. Totez delas u tagu A href="" target="jmeno_ok­na". A je mozne takto spoustet funkce z jineho okna tobe patriciho (neporusijiciho cross-origin). Predavat data (nebo ziskat) treba z hlavniho okna. (ale je vyhodnejsi mit js v jedinem souboru, kvuli kesovani). Muze se ti to nekdy hodit, proto jsem to tam zminil.

window.aaa(data);
window.top.aaa(data)
window.honza.aaa(data) // window['honza'].aaa()

function isFunction (ref)    {return typeof ref=='function' && ref!=null;}
if ( !isFunction(window['honza']) ) {alert('funkce honza neexistuje')}

Ono se totiz muze stat, ve starych prohlizecich, ze nejaka funkce nefunguje. Nebo zapomenes pridat nejaky js soubor. Nebo smazes. Nebo si prepises promenou na uplne jinou, omylem a zkousis z ni volat funkci. Tak je dobre si obcas zkontrolovat existenci nejake nestandartni funkce nez by se ti program zastavil s errorem v konzoli.

Editováno 24.2.2022 8:55
 
Nahoru Odpovědět
24.2.2022 8:54
Avatar
Jiří S.
Tvůrce
Avatar
Odpovídá na Kamil
Jiří S.:24.2.2022 9:08

Tady bys to možná mohl pochopit: https://jirkasa.github.io/funkce-v-js/#…

Akceptované řešení
+20 Zkušeností
+2,50 Kč
Řešení problému
 
Nahoru Odpovědět
24.2.2022 9:08
Avatar
Kamil
Člen
Avatar
Kamil:24.2.2022 19:14

Děkuji oběma, prostuduji si to. :)

 
Nahoru Odpovědět
24.2.2022 19:14
Avatar
Jurajs
Člen
Avatar
Odpovídá na Peter Mlich
Jurajs:26.2.2022 14:46

Sorry...ale JS má class a prototype se nepoužívá.

class Car {
  constructor(brand) {
    this.carname = brand;
  }
  present() {
    return 'I have a ' + this.carname;
  }
}

class Model extends Car {
  constructor(brand, mod) {
    super(brand);
    this.model = mod;
  }
  show() {
    return this.present() + ', it is a ' + this.model;
  }
}

let myCar = new Model("Ford", "Mustang");
document.getElementById("demo").innerHTML = myCar.show();
 
Nahoru Odpovědět
26.2.2022 14:46
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:28.2.2022 7:53

To je mozne. Znam jen stary js. Vim, ze tam problehly nedavno (5 let zpet) nejake zmeny, ale nesleduji to. A take se na ne divam s neduverou. Nove a kdo vi jak spolehlive. Mnou leta neprozkousene :)
Ok, dalsi zpusob, jak to delat.

 
Nahoru Odpovědět
28.2.2022 7:53
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 7 zpráv z 7.