Toate elementele dintr-o pagina sunt vazute de JavaScript ca fiind obiecte.
Obiectele sunt structuri compacte de date care pot sa contina mai multe proprietati si functii (denumite Metode).
Apelarea proprietatilor si metodelor unui obiect se face cu operatorul punct (.)

- Sintaxa:
obiect.prorietate

obiect.metoda()

Obiectul string

String (sau sir) e obiectul care contine text adaugat intre ghilimele simple sau duble.
Un obiect de tip String se poate crea folosind ghilimele sau cu instructiunea new String().

- Sintaxa:
//definire String cu new
var str = new String('text..');

//definire String direct cu ghilimele
var str ='Text..';

//sau
var str ="Text..";
• In general se folosesc direct ghilimele, iar toate valorile incadrate intre ghilimele sunt vazute in JavaScript ca 'String' si pot folosi proprietatile si metodele obiectului String.

Utilizare Proprietate si Metode ale obiectului String

Obiectul String are o singura proprietate: length, aceasta contine numarul de caractere din sir.

let str ='Tutorial JS';
let nr_chr = str.length; // 11
Se poate citi orice caracter din sir folosind numarul de ordine (indexul) care incepe de la 0. Primul caracter are index 0 (str[0]), al doilea are index 1 (str[1]), etc.

- Exemplu, se afiseaza intr-un element HTML numarul de caractere dintr-un sir, si al treilea caracter.
<div id='dv1'>HTML coontent.</div>

<script>
let str ='some_str';

//afiseaza in #dv1 numarul de caractere din 'str' si al treilea caracter
document.getElementById('dv1').innerHTML ='Sirul "some_str" are '+ str.length +' caractere; al treilea e: '+ str[2];
</script>

Utilizare Metode

Obiectul String contine numeroase metode care pot fi utile in lucru cu siruri. O lista cu metode pentru siruri gasiti la pagina: Metode ale obiectului String in JS.
- Iata exemple cu unele din cele mai folosite metode pentru siruri.

Exemplu cu indexOf()

Metoda indexOf() e utila pentru a verifica daca un sir contine un anumit subsir.
Aceasta returneaza pozitia primei aparitii a unui subsir intr-un sir, sau valoarea -1 daca subsirul nu e gasit.
- Exemplu, daca sirul de la variabila 'str' contine cuvantul 'spirit', afiseaza indexul de inceput a subsirului.
<div id='dv1'>Exemplu cu indexOf().</div>

<script>
let str ='In spiritul libertatii.';

//daca str contine 'spirit', adauga indexul de inceput in #dv1
var ix = str.indexOf('spirit');
if(ix !=-1){
 document.getElementById('dv1').innerHTML ='Cuvantul "spirit" incepe de la index: '+ ix;
}
</script>

Exemplu cu match()

Metoda match() e utila pentru a compara un sir cu o expresie regulata (RegExp). Returneaza un array cu elementele din sir care se potrivesc cu expresia regulata, sau 'null'.
- Exemplu, se verifica daca un sir e o adresa valida de email si preia numele din adresa.
<div id='dv1'>Exemplu JavaScript cu match().</div>

<script>
const email ='some_name@domain.net';

//is_em e un array de forma ['email', 'nume', 'domeniu'] sau null
var is_em = email.match(/^([A-z0-9]+[A-z0-9._%-]*)@([A-z0-9_\-\.]+\.[A-z]{2,5})$/i);

//daca la email e o adresa valida de email, adauga in #dv1 numele din adresa
if(is_em){
 document.getElementById('dv1').innerHTML ='Numele din adresa "'+email+'" este: '+ is_em[1];
}
</script>

Inlantuire Metode

Se pot aplica mai multe metode (inlantuite) la un sir, in aceeasi linie de cod.
str.metoda1().metoda2()

- Exemplu cu replace() si trim().
Metoda replace() inlocuieste intr-un sir unele caractere specificate (sau expresie RegExp) cu altele noi specificate.
Metoda trim() sterge spatiile goale de la inceputul si sfarsitul unui sir.


In urmatorul exemplu se inlocuiesc intr-un sir cu cod HTML caracterele '<' si '>' cu echivalentele pentru afisare in HTML, si se adauga sirul rezultat intr-un element HTML.
<div id='dv1'>Exemplu JavaScript cu metode inlantuite.</div>

<script>
let htm ='<h3>Astazi e o zi Fericita</h3>';

//inlocuieste < si > din htm cu entitatile html, aplica trim() si adauga sirul in #dv1
htm = htm.replace(/</ig, '&lt;').replace(/>/ig, '&gt;').trim();
document.getElementById('dv1').innerHTML = htm;
</script>

Adaugare ghilimele si caractere speciale in sir

La adaugarea de ghilimele in textul dintr-un String se tine cont de ghilimelele de inceput (prin care e definit sirul).
Ghilimelele duble se pot adauga normal intr-un sir definit cu ghilimele simple (si invers).
- Sintaxa:
var str ='Un text cu "ghilimele" duble';

var str ="Un text cu 'ghilimele' simple";

Acelasi tip de ghilimele cu cele folosite la definirea sirului se pot adauga doar escapate (precedate de '\').
- Sintaxa:
var str ='Un text cu \'ghilimele simple\' ca cele la definire';

var str ="Alt text cu \"ghilimele duble\", ca si cele de definire";

In afara de ghilimele sunt si alte caractere speciale care trebuie escapate cand se folosesc in sir.
Iata o lista cu aceste caractere:
- Exemplu, se adauga intr-un tag <pre> un sir cu mai multe linii, care contine ghilimele si backslash.
<pre id='pr1'>HTML content, object string.</pre>

<script>
let str ='Sir definit intre \'ghilimele simple\', \n adaugate cu backslash \\, \n dar contine si "ghilimele duble".';
document.getElementById('pr1').innerHTML = str;
</script>

Sir Template

Sirul Template se adauga intre caracterele de accent ( `...` ).
Acest tip de String permite crearea de siruri cu linii noi adaugate normal (fara \n) si redarea de expresii de cod JavaScript care sunt executate direct in el.
- Sintaxa:
var tmp =`string text line 1
 Line 2 si ${js_expression} expresie de cod.`;
- js_expression poate fi o variabila JavaScript, apelarea unei functii sau o expresie JS cu valori. Acestea se adauga intre: ${} si sunt executate ca orice cod JavaScript.

Exemplu, un sir ce contine mai multe linii si cod html cu continut dinamic.
<pre id='pr1'>Template string, HTML content</pre>

<script>
//se definesc variabile si o functie (arrow) care vor fi utilizate in sirul template
let str_st ='Sir Template';
let arr =[8, 0];
const sumXY =(x, y)=>(x+y);

//sirul template
var tmp =`<h3>Acesta e ${str_st} din JavaScript</h3>
Apelare functie sumXY(): suma 7+8 = ${sumXY(7,8)}
Si o linie cu <strong>expresie JS, 8*0 = ${arr[0] * arr[1]}</strong>.`;

//adauga sirur rezultat in #pr1
document.getElementById('pr1').innerHTML = tmp;
</script>

In interiorul unui sir template, caracterul accent prin care e definit se poate adauga escapat (\`).

Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Ce atribut poate fi utilizat pentru a adauga stiluri CSS direct in tag-ul HTML?
type style class
<div style="width: 80%; border: 3px solid #888888;">Continut</div>
Care din metodele proprietatii CSS transform distorsioneaza elementul HTML la un anumit unghi (inclusiv continutul lui)?
translate() scale() skew()
#un_id {
  transform: skew(20deg, 25deg);
  -ms-transform: skew(20deg, 25deg);   /* IE 9 */
  -webkit-transform: skew(20deg, 25deg);   /* Safari and Chrome */
}
Clic pe functia care poate converti un obiect Date in Sir.
indexOf() toString() getDate()
var rightnow = new Date();
alert( rightnow.toString() );
Care functie aplica o alta functie la elementele unui array?
array_merge() array_search() array_map()
$arr = arra("abc", "<p>xyz</p>", "<em>PHP</em>");
// aplica functia strip_tags() ca sa stearga tag-urile HTML din fiecare element din %arr
$arr = array_map("strip_tags", $arr);
}
Cum se spune "sambata" in limba engleza?
Sunday Saturday Monday
On Saturday I visit my grandparents.
- Sambata imi vizitez bunicii.
Cum se spune "sambata" in limba spaniola?
domingo lunes sábado
Sábado visito mis abuelos.
- Sambata imi vizitez bunicii.
Obiectul String - Sir

Last accessed pages

  1. Substantivul din limba engleza - The Noun (28690)
  2. Blog si Cugetari Personale (3624)
  3. Trecutul simplu - Exercitii si teste incepatori (9256)
  4. Cursuri limba engleza gratuite si lectii online (28767)
  5. Poezii pentru copii, in engleza (10549)

Popular pages this month

  1. Cursuri si Tutoriale: Engleza, Spaniola, HTML, CSS, Php-Mysql, JavaScript, Ajax (2704)
  2. Curs HTML gratuit Tutoriale HTML5 (1980)
  3. Curs si Tutoriale JavaScript (1919)
  4. Curs PHP MySQL, Tutoriale si Scripturi PHP (1855)
  5. Curs CSS Online Tutoriale CSS3 (1708)