Il team di YUI è alla ricerca di un mondo di classe Ingegnere a lavorare su Frontend CI, sistemi di compilazione e QA

28 Gennaio 2010 alle 8:30 am da Eric Miraglia | In Development e Ingegneria front-end a Yahoo | 13 commenti

Nota: Abbiamo assunto per questa posizione. Si prega di controllare la pagina YUI lavori per altri processi legati a Yahoo! YUI

Se si lavora fianco di gente come Douglas Crockford e sul team che ha creato YUI ( Matt Sweeney , Adam Moore , Dav Glass , Jenny Donnelly , Luke Smith , Tripp Bridges, Allen Rabinovich , Alaric Cole , Satyen Desai , e altri) sembra un buon modo per trascorrere il vostro tempo, a leggere: Cerchiamo personale.

Siamo alla ricerca di un grande ingegnere per aiutarci a migliorare ogni aspetto della nostra integrazione continua (CI) di processo, compreso il modo in cui costruiamo, documento, testare e distribuire il nostro codice. Per riuscire in questo ruolo, dovrete essere:

  • familiarità con le best practice in ingegneria frontend (ad esempio, il video dovrebbe fare buon senso di te);
  • informati circa gli obiettivi ei principi di integrazione continua;
  • interessati alla disciplina emergente di test automatici per il codice frontend (ad esempio il video e la prima metà di questo dovrebbero avere un senso per voi, e progetti come TestSwarm dovrebbe essere profondamente interessante);
  • in grado di risolvere diversi problemi con una serie eterogenea di tecnologie (per esempio, DHTML / Python / Java / Ant / linux / PHP / JavaScript);
  • entusiasti della creazione di uno stato-of-the art CI processo di YUI ed evangelizzatrice per tutta Yahoo! e oltre.

YUI è un progetto open source, e molti dei pezzi che lavorerete con fanno parte dell'ecosistema YUI. Che inizia con i nostri strumenti di YUI Builder e si estende ai componenti del nostro processo esistente CI - strumenti come YUI Compressor , YUI Doc e test YUI . Avrete l'opportunità di migliorare gli strumenti stessi e per migliorare il modo in cui sono documentati e utilizzati.

La parte migliore di qualsiasi lavoro in campo tecnologico è avere la possibilità di fare il lavoro influente in un ambiente che entrambe le sfide e supporta la tua crescita. Il team di YUI prevede proprio questo confluenza di caratteristiche: un enorme comunità impegnata di utenti e sviluppatori e un team di brillanti ingegneri che collaborano ogni giorno per migliorare il progetto.

Se questo suona come il vostro lavoro di sogno, e se le persone che ho citato sopra suona come le persone che ci si vuole lavorare ogni giorno, mi piacerebbe sentire da voi. Dimmi perchè sei la persona giusta per questo ruolo, anche un link al tuo curriculum e portfolio professionale, inviando una mail yui [trattino] lavori [at] yahoo-inc.com. (Principals solo;. Non reclutatori)

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

Crockford su JavaScript: Night One Recap, e più biglietti di rilascio

26 gennaio 2010 alle 14:25 da Eric Miraglia | In Eventi YUI | Commenti disabilitati

Circa 200 persone si sono radunate presso il Café URL di Yahoo! la scorsa notte ad accogliere la prima rata della serie di conferenze sul Crockford JavaScript . Douglas ha portato il pubblico attraverso una storia selettiva di informatica e linguaggi di programmazione, con particolare attenzione l'evoluzione di quelle caratteristiche e convenzioni che avrebbe poi danno forma a JavaScript.

Mentre stiamo lavorando sul video di ieri sera, abbiamo voluto condividere qualche foto e per farvi sapere che stiamo regolando i nostri limiti di ticketing - se si visita la pagina serie di conferenze e seguire i link RSVP, verrà ora vedere disponibilità di alcune delle sessioni che erano stati precedentemente elencati come esaurito.

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

In the Wild per il 19 Gennaio 2010

19 gennaio 2010 alle 07:32 am da Eric Miraglia | In In the Wild | Commenti disabilitati

Notizie e note seguono dalla scorsa settimana nella comunità YUI. Come sempre, fatecelo sapere attraverso i commenti o @ yuilibrary se ne abbiamo tralasciato qualcosa di buono.

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

In the Wild per il 10 Gennaio 2010

8 Gennaio 2010 alle 09:18 am da Eric Miraglia | In In the Wild | 2 commenti

Notizie e note dalla comunità YUI rispetto al mese passato ... fateci sapere nei commenti o @ yuilibrary se ne abbiamo tralasciato qualcosa di importante:

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

Altri modelli di riutilizzo di codice in YUI3

7 gennaio 2010 alle 06:41 am da Stoyan Stefanov | In Development | 2 commenti

Stoyan Stefanov. Chi l'Autore: Stoyan Stefanov ( @ stoyanstefanov ) è un front-end ingegnere di Yahoo! Search. Egli è anche l'architetto di YSlow 2.0, co-creatore della Image Optimizer smush.it, oratore e scrittore tecnico. Il suo ultimo libro si chiama Object-Oriented JavaScript .

Questo post è un follow-up per l'articolo "modelli di eredità in YUI3" e immersioni più in profondità le API YUI3 mostrante piu 'modelli per il riutilizzo del codice. La Gang of Four libro sostenitori che dovremmo "preferiscono composizione di oggetti di ereditarietà delle classi". E infatti, l'eredità è talvolta usato come una soluzione in più lingue fortemente tipizzati in cui la firma di un oggetto o una classe deve essere fissato al momento della compilazione. JavaScript è genericamente digitato e oggetti può essere composto, miscelati ed aumentata in qualsiasi momento.

Convertire gli oggetti

Nella vita reale JavaScript, è raro che si dovrebbe configurare catene eredità profonde. Spesso si può solo voler convertire un oggetto esistente (o un costruttore) con i membri di un altro, senza necessariamente formando un rapporto genitore-figlio. YUI offre il metodo Y.augment(...) di fare proprio questo.

L'esempio seguente mostra la differenza tra l'eredità corretto con Y.extend(...) e l'aumento semplice oggetto con Y.augment(...) .

 / / Genitore, aka fornitore di funzionalità
 funzione di programmatore () {}
 Programmer.prototype.writeCode = function () {};

 / / Un costruttore che viene aumentata con i membri del fornitore
 CodeMonkey funzione () {}
 Y.augment (CodeMonkey, Programmer);
 var = new monkey CodeMonkey ();

 / / Un costruttore che eredita dal genitore-fornitore
 funzione di Guru () {}
 Y.extend (Guru, Programmer);
 var = new Guru guru ();

Ora che abbiamo riutilizzato Programmer funzionalita 's in due modi, cerchiamo di verificare il risultato. Entrambi gli oggetti monkey e guru ora ottenere un writeCode() metodo, ma solo il guru fa parte della catena di ereditarietà.

 alert (typeof monkey.writeCode); / / "funzione"
 alert (typeof guru.writeCode); / / "funzione"

 / / Scimmia non è un programmatore, mentre il guru è
 alert (scimmia instanceof programmatore); / / false
 alert (guru instanceof programmatore); / / true

Y.augment(...) può anche prendere un oggetto (in contrapposizione ad un costruttore) per essere accresciuto.

 var n00b = {};
 Y.augment (n00b, Programmer);

 / / Ora n00b può writeCode
 alert (typeof n00b.writeCode); / / "funzione"

Y.augment(...) consente al destinatario di essere più esigente quando riutilizzo del codice da parte del fornitore. Un terzo parametro opzionale per Y.augment(...) definisce se le proprietà esistenti devono essere sovrascritti ( false per impostazione predefinita, il che significa preservare le proprietà originali del destinatario). Il quarto parametro può facoltativamente fornire una whitelist - un array contenente i nomi delle proprietà che devono essere riportati.

Clonazione

Clonazione di oggetti è ancora un altro motivo per il riutilizzo del codice, che consente di creare oggetti nuovi, che sono proprio come quelli già esistenti. In un certo senso, l'idea è simile a quella eredità prototipale (vedi Y.Object(...) nel precedente articolo), dove gli oggetti ereditano da oggetti. La differenza principale è che quando la clonazione, le proprietà del genitore vengono copiati direttamente il bambino, non attraverso la catena di prototipi.

Y.clone(...) crea una copia profonda, il che significa che ricorsiva all'interno di un array e le proprietà degli oggetti. Inoltre, crea copie di valore, in modo che l'oggetto clonato non modifica il genitore per errore (in array JavaScript, gli oggetti e le funzioni vengono copiati per riferimento).

Per illustrare la differenza, si consideri un oggetto pro che viene clonato in un nuovo oggetto clone e anche ereditata come wiz utilizzando Y.Object(...) .

 / / Oggetto originale
 var pro = {groks: ['html']};

 / / Eredita
 var = Wiz Y.Object (pro);

 / / Clone
 var clone = Y.clone (pro);

Ora aggiungiamo un nuovo elemento di matrice all'oggetto originale

 pro.groks.push ('css');

L'oggetto bambino vede il valore aggiornato, mentre il clone non lo fa, perché il clone è un'istantanea di ciò che l'oggetto era al momento della clonazione.

 wiz.groks.join (); / / "html, css"
 clone.groks.join () / / "html"

Questo funziona al contrario, come pure - quando il bambino modifica l'array.

 wiz.groks.push ('js');
 pro.groks.join (); / / "html, css, js"
 clone.groks.join () / / "html"

Clone di discussione

Come si può vedere Y.clone(...) crea nuovi oggetti deep-copiando tutte le loro proprietà e metodi. Anche se questo non è probabilmente quello che normalmente si chiama eredità, è ancora uno schema piuttosto semplice e diretto per il riutilizzo del codice. Dopo tutto il riutilizzo del codice è di evitare la necessità di duplicare il codice e riutilizzo delle funzionalità esistenti.

Qualcosa si potrebbe chiedere - per quanto riguarda le prestazioni? Non è inefficiente per copiare i valori del genere. La risposta è - sì, potrebbe essere inefficiente. Ma per la maggior parte delle applicazioni questo sarebbe raramente il collo di bottiglia. Infatti Firebug (estensioni di Firefox sono scritti in JavaScript), che è un pezzo piuttosto complesso software possiede uno extend() metodo che funziona semplicemente copiando le proprietà dall'oggetto padre all'oggetto figlio, utilizzando una copia (non recursing in oggetti e gli array).

Quindi, dal momento che la clonazione è solo profondamente la copia delle proprietà da un oggetto all'altro, non sarebbe bello se è possibile ereditare funzionalità da più oggetti, non solo da uno? Questo è dove Y.merge(...) viene in aiuto con questa sorta di mix-in oggetti.

Mixin oggetti con Y.merge(...)

Il modello mixin permette di catturare le proprietà e metodi più oggetti e riporto in un nuovo oggetto. YUI3 fornisce il metodo Y.merge(...) che può assumere qualsiasi numero di oggetti e restituire uno solo che è un mix di tutti gli oggetti di origine.

Ecco un esempio:

 var = {mad_skillz cottura: function () {}, mix: function () {}, mangiare: function () {}};
 ingredienti var = {zucchero: "lotti", la farina: 1, uova: 2};
 var latteria = {latte: 1};

 / / Mixin
 var = torta Y.merge (mad_skillz, ingredienti, prodotti lattiero-caseari);

Ora è possibile verificare quali proprietà ha riportato al cake oggetto utilizzando i metodi convenienti Y.Object.keys(...) che vi dà una matrice di tutti i nomi delle proprietà.

 . Y.Object.keys (torta) join () / / "bake, mix, mangiare, zucchero, farina, uova, latte"

Y.merge(...) ricorda la clonazione, ma invece di deep-copia di un oggetto, crea una copia e può richiedere più oggetti da mescolare con la chiamata al metodo stesso. La logica di sovrascrivere Y.merge(...) in caso di collisioni di proprietà di denominazione è diverso da molti altri metodi - se si dispone di due membri con lo stesso nome, l'ultimo vince e sovrascrive il precedente.

Proprio come con Y.clone(...) , Y.merge(...) non è necessariamente limitato ai fini del riutilizzo del codice. È possibile utilizzarli anche per la manipolazione di array o qualsiasi tipo di hash oggetti simili, come ad esempio gli oggetti di configurazione.

Y.mix(...)

Y.mix(...) è il più basso livello di metodo dietro la maggior parte delle funzionalità di cui sopra. Vi offre un controllo accurato su cui proprietà vengono copiati e dove esattamente. Inoltre permette di combinare due proprietà con gli stessi nomi, ignorare alcune proprietà e così via.

Ecco un esempio un po 'complessa di utilizzare il Y.mix(...) API:

 / / Un oggetto
 = {var pro
   groks: ['html', 'css', 'js'],
   parla: ['Latino'],
   tweets: true
 };

 / / Un costruttore
 WebGuru funzione () {}

 / / Aumentare il prototipo del costruttore
 / / Con alcune delle proprietà del pro
 Y.mix (WebGuru, pro, vero, ['groks', 'tweets'], 4);

 / / Test
 var = new guru WebGuru ();
 guru.groks.join (); / / "html, css, js"
 guru.tweets; / / true
 guru.speeks; / / undefined

Se guardate la chiamata a Y.mix(...) , abbiamo 5 argomenti, significato:

  1. WebGuru un maggior numero di membri ...
  2. dal pro ...
  3. sovrascrivendo quelle esistenti ...
  4. solo se sono in questo array whitelist ['groks', 'tweets'] . Ciò significa che la speaks proprietà non verrà miscelato
  5. 4 è la modalità. Ci sono cinque modalità di miscelazione - da 0 a 4, dove 4 significa che il prototipo di WebGuru riceveranno membri da pro .

È possibile controllare la documentazione per ulteriori informazioni sui parametri accettati da Y.mix(...) .

Questo è tutto gente!

Grazie per aver letto! Per ulteriori informazioni ed esempi sulla funzionalità OOP in YUI3, potete consultare questi link:

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

Modelli di eredità a YUI 3

6 Gennaio 2010 alle 6:30 pm Stoyan Stefanov | In Development | 2 commenti

Stoyan Stefanov. Chi l'Autore: Stoyan Stefanov ( @ stoyanstefanov ) è un front-end ingegnere di Yahoo! Search. Egli è anche l'architetto di YSlow 2.0, co-creatore della Image Optimizer smush.it, oratore e scrittore tecnico. Il suo ultimo libro si chiama Object-Oriented JavaScript .

Questo articolo discute due riutilizzare il codice JavaScript schemi attuati in YUI 3 - Il modello di eredità classica e il modello di ereditarietà prototipale.

Soddisfare le dipendenze

Il modello prototipale è disponibile presso il YUI nocciolo 3 API nel yui-min.js file seme. Il modello classico richiede il oop modulo, ma dato che la oop modulo è un requisito per la maggior parte degli altri moduli, di solito non dovrete fare nulla di speciale per ottenere l'accesso a questa funzionalità. Ma se si desidera creare una semplice pagina di prova per giocare con i modelli di voi stessi, in grado di soddisfare le dipendenze includendo YUI in questo modo:

  <script type="text/javascript" src="http://yui.yahooapis.com/3.0.0/build/yui/yui-min.js"> </ script>
 <script>
 YUI (). Uso ('oop', function (Y) {
   / / Il codice va qui
   / / Y è l'istanza di YUI
 });
 </ Script>

(Pseudo) eredità classica

È possibile chiamare questo modello "classico", non perché viene da Platone nell'antica Grecia, ma perché ti aiuta a pensare in termini di classi. JavaScript non ha classi (da qui la parte "pseudo"), ma ha invece funzioni di costruzione.

In linguaggi Java o altro si può avere un Programmer ereditare da una classe Person classe. In JavaScript, ci troveremo a un Programmer funzione di costruzione e di una Person funzione di costruzione. L'obiettivo è quello di avere gli oggetti creati con il Programmer costruttore di ereditare le proprietà ei metodi come se fossero stati creati con la Person costruttore.

Considerare questi due costruttori:

 / / Genitore
 funzione di Person () {
   / / "Propri" membri
   this.name = "Adamo";
 }

 / / Proprietà del prototipo del genitore
 Person.prototype.getName = function () {
   ritorno this.name;
 };

 / / Bambino costruttore
 funzione di programmatore () {}

YUI 3 di oop modulo offre la Y.extend(...) metodo per aiutarvi con la parte di eredità. E 'semplice come:

  Y.extend (Programmer, Persona); 

Poi si può verificare che il getName() metodo è stato correttamente ereditato:

 guru var = new Programmer ();
 alert (typeof guru.getName); / / "funzione"

Si noti che il Y.extend(...) metodo solo erediterà i membri del prototipo, non "proprio" membri. E 'considerato una buona pratica per aggiungere tutte le funzionalità riutilizzabile al prototipo e lasciare tutte le istanze specifiche proprietà come beni di proprietà (aggiunto a this ). Nell'esempio qui sopra, solo getName() viene ereditato, mentre name non lo fa. (Nel modello di ereditarietà prototipale - discusso ulteriormente in questo articolo - si eredita sia prototipo e propri membri.)

Estendere e aumentare

Y.extend(...) vi permette di ereditare da un costruttore genitore e allo stesso tempo aumentare il bambino con i nuovi membri. Questo è in realtà il modello de facto utilizzato da YUI per costruire "classe" estensioni.

È possibile aggiungere proprietà al prototipo del costruttore figlio utilizzando il terzo parametro di Y.extend(...) ed è possibile aggiungere proprietà al costruttore stesso (classe proprietà statiche) con il quarto parametro.

Ecco un esempio di estendere e aumentare al tempo stesso:

 Y.extend (Programmer, Persona, {groksHTML: true}, {LIMIT: "cielo"});

 / / GroksHTML ora è una proprietà del prototipo del figlio
 alert (typeof Programmer.prototype.groksHTML); / / "boolean"

 / / La proprietà funziona per tutti i nuovi oggetti
 bob var = new Programmer ();
 alert (bob.groksHTML); / / true

 / / Aggiungendo al costruttore è di più per 
 / / "Statiche" proprietà destinata a fungere da costanti
 alert (Programmer.LIMIT); / / "cielo"
 Limite var = bob.LIMIT; / / undefined

Superclasse

Il modello pseudoclassical sopra descritto consente di accedere al prototipo del costruttore del genitore tramite la proprietà statica chiamata superclass .

superclass indica il prototipo del genitore e così superclass.constructor punti alla funzione di costruzione genitore. Consideriamo un esempio:

 / / Eredita
 Y.extend (Programmer, Persona);

 / / Bambino l'accesso al costruttore genitore
 var = genitore Programmer.superclass.constructor; 
 / / Test
 alert (genitore Person ===); / / true

 / / Accesso al genitore da un'istanza del bambino
 guru var = new Programmer ();
 guru.constructor.superclass.constructor === Persona; / / true

Come osservato in precedenza, con il modello classico solo erediterà i membri prototipo. Ma usando la superclass è anche possibile inizializzare il costruttore genitore dal bambino e ottenere le proprietà proprie della controllante come proprietà del bambino stesso.

È possibile modificare il Programmer costruttore per chiamare il costruttore genitore, passando l'oggetto figlio ( this ) e gli eventuali argomenti di inizializzazione

 / / ...  genitore stessa definizione, come mostrato prima ...

 / / Bambino
 funzione di programmatore () {
   / / Inizializza il genitore con il bambino come "questo"
   Programmer.superclass.constructor.apply (this, arguments);
 }

 / / Eredità
 Y.extend (Programmer, Persona);

 / / Test
 var = new pro Programmer ();
 alert (pro.name); / / "Adam"

Come potete vedere, le istanze programmatore ora hanno un name proprietà e si tratta di una proprietà.

   alert (pro.hasOwnProperty ('name')); / / true
   alert (pro.hasOwnProperty ('getName')); / / false  

L'accesso ai metodi sottoposti a override

Il fatto che la superclass punta al prototipo del genitore permette al bambino di ottenere l'accesso ai metodi sottoposti a override. Si consideri l'esempio classico del Triangle che eredita Shape :

 / / Genitore
 funzione Shape () {}
 Shape.prototype.toString = function () {
   return "forma";
 };

 / / Bambino
 funzione di Triangle () {}

 / / Eredità
 Y.extend (Triangle, Shape);

 / / Bambino sostituisce il metodo toString () del genitore
 / / Ma grazie alla proprietà superclasse
 / / Ha ancora accesso al metodo originale
 Triangle.prototype.toString = function () {
   Triangle.superclass.toString return () + ", triangolo";
 };

 / / Test
 acuta var = new Triangolo ();
 acute.toString (); "forma triangolare"

Ereditarietà prototipale

Douglas Crockford suggerisce che questa modalità di trasmissione, in cui si dimentica tutto sulle classi e avere i vostri oggetti ereditano da altri oggetti. Ad esempio:

 / / Parent oggetto, creato con un semplice oggetto letterale
 var = {genitore
   name: "John",
   famiglia: "Wayne",
   dire: function () {
     return "Io sono" this.name + + "" + this.family;
   }
 };

 / / L'eredità magica
 / / Un nuovo oggetto nasce da uno esistente
 var = batman Y.Object (genitore);

 / / Personalizzare o aumentare il nuovo oggetto
 batman.name = "Bruce";

 / / Usa
 batman.say (); / / Io sono Bruce Wayne

Utilizzando questo modello ci sono due fasi nella creazione di vostri oggetti:

  1. Si crea un nuovo oggetto che eredita tutte le proprietà ei metodi di un oggetto esistente.
  2. Per personalizzare il nuovo oggetto - è possibile sovrascrivere alcuni dei membri o di aggiungerne di nuovi.

Si noti che Y.Object(...) è disponibile nel nucleo YUI. Non è necessario includere il oop modulo.

Eredità discussione prototipale

Se siete curiosi di sapere la motivazione dietro l'eredità prototipale e come funziona sotto il cofano, si può studiare il modello descritto in parole di Douglas Crockford .

Utilizzando questo modello, i membri del genitore vengono ereditate attraverso la catena di prototipi. Questo significa che se si aggiunge una proprietà con lo stesso nome per il bambino, la nuova proprietà non sovrascrive quello ereditato dal padre, ma avrà la precedenza. In altre parole, è possibile ridefinire la say metodo in questo modo:

 batman.say = function () {
   return "Non posso dirvi il mio vero nome";
 };

 / / Test
 batman.say (); / / "Non posso dirvi il mio vero nome"

A differenza del modello di ereditarietà classica offerta dalla Y.extend , non c'è modo per fare riferimento al genitore say metodo dall'oggetto figlio say (vis. superclass ). Tuttavia, se si elimina la say metodo dell'oggetto figlio, i genitori say che "brillare".

 eliminare batman.say;
 batman.say (); / / "Io sono Bruce Wayne"

In ECMAScript 5

La nuova edizione dello standard ECMAScript include il modello di ereditarietà prototipale attraverso un metodo nativo chiamato Object.create(...) .

 / / YUI3
 var = batman Y.Object (genitore);

 / / ECMAScript 5 (futuro)
 var = batman Object.create (genitore);

Altro?

Grazie molto per la lettura! Per ulteriori informazioni ed esempi dei due modelli discussi in questo articolo, potete consultare questi link:

Restate sintonizzati per un follow-up articolo che discute ancora di più modelli di riutilizzare il codice in YUI3.

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

Crockford fornire discorso "Stato e futuro di JavaScript" in ACCU in Mountain View il 13 gennaio

5 gennaio 2010 alle 10:46 am da Eric Miraglia | In Sviluppo e YUI Eventi | Commenti disabilitati

Crockford al ACCU il 13 gennaio.

Douglas Crockford sarà riprenderà la sua lezione sul tema " Lo Stato e futuro di JavaScript "al prossimo raduno ACCU a Mountain View il 13 gennaio . L'evento è gratuito e aperto al pubblico, Symantec sta ospitando l'evento nel proprio campus di Mountain View .

Yahoo ospita anche una serie di conferenze pubbliche, Crockford su JavaScript , all'inizio di questo mese - anche gratuitamente al pubblico (RSVP richiesto).

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

Pagina successiva »
Ospitato da Yahoo!

Copyright © 2006-2012 Yahoo! Inc. Tutti i diritti riservati. Privacy Policy - Termini di servizio

Powered by WordPress su Yahoo! Web Hosting .