[Javascript] Exemplu break + label

outerloop:
  for(var i = 0; i < 10; i++) {
    innerloop:
      for(var j = 0; j < 10; j++) {
          if (j > 3) break;             // Quit the innermost loop
          if (i == 2) break innerloop;  // Do the same thing
          if (i == 4) break outerloop;  // Quit the outer loop
          document.write("i = " + i + " j = " + j + "
");
      }
  }
  document.write("FINAL i = " + i + " j = " + j + "
"); 
 
Rezultatul fiind:
i = 0 j = 0
i = 0 j = 1
i = 0 j = 2
i = 0 j = 3
i = 1 j = 0
i = 1 j = 1
i = 1 j = 2
i = 1 j = 3
i = 3 j = 0
i = 3 j = 1
i = 3 j = 2
i = 3 j = 3
FINAL i = 4 j = 0 

[Learn JavaScript] Operatorul + este special

The + operator is a special one -- it gives priority to string operands over numeric operands. If either operand to + is a string (or an object), the other operand is converted to a string (or both operands are converted to strings) and concatenated, rather than added.

On the other hand, the comparison operators (<, >, <=, >=) perform string comparison only if both operands are strings. If only one operand is a string, JavaScript attempts to convert it to a number.

1 + 2        // Addition. Result is 3.
"1" + "2"    // Concatenation. Result is "12".
"1" + 2      // String Concatenation; 2 is converted to "2". Result is "12".
11 < 3       // Numeric comparison. Result is false.
"11" < "3"   // String comparison. Result is true.
"11" < 3     // Numeric comparison; "11" converted to 11. Result is false.
"one" < 3    // Numeric comparison; "one" converted to NaN. Result is false.
             // In JavaScript 1.1, this causes an error instead of NaN.

It is important to note that when the + operator is used with strings and numbers, it may not be associative. That is, the result may depend on the order in which operations are performed. This can be seen with examples like these:

s = 1 + 2 + " blind mice";   // Yields "3 blind mice"
t = "blind mice: " + 1 + 2;  // Yields "blind mice: 12"
 
The reason for this surprising difference in behavior is that the + operator works from left to right.

http://docstore.mik.ua/orelly/webprog/jscript/ch05_06.htm

Operatori in JavaScript

P A Operator Operand type(s) Operation performed
15 L . object, identifier Property access
  L [] array, integer Array index
  L ( ) function, arguments Function call
  R new constructor call Create new object
14 R ++ lvalue Pre- or post-increment (unary)
  R -- lvalue Pre- or post-decrement (unary)
  R - number Unary minus (negation)
  R + number Unary plus (no-op)
  R ~ integer Bitwise complement (unary)
  R ! boolean Logical complement (unary)
  R delete lvalue Undefine a property (unary)
  R typeof any Return data type (unary)
  R void any Return undefined value (unary)
13 L *, /, % numbers Multiplication, division, remainder
12 L +, - numbers Addition, subtraction
  L + strings String concatenation
11 L << integers Left shift
  L >> integers Right shift with sign-extension
  L >>> integers Right shift with zero extension
10 L <, <= numbers or strings Less than, less than or equal
  L >, >= numbers or strings Greater than, greater than or equal
  L instanceof object, constructor Check object type
  L in string, object Check whether property exists
9 L == any Test for equality
  L != any Test for inequality
  L === any Test for identity
  L !== any Test for non-identity
8 L & integers Bitwise AND
7 L ^ integers Bitwise XOR
6 L | integers Bitwise OR
5 L && booleans Logical AND
4 L || booleans Logical OR
3 R ?: boolean, any, any Conditional operator (3 operands)
2 R = lvalue, any Assignment
  R *=, /=, %=, +=, -=, <<=, >>=, >>>=, &=, ^=, |= lvalue, any Assignment with operation
1 L , any Multiple evaluation

The column labeled "P" specifies the precedence of each operator. Operator precedence controls the order in which operations are performed. Operators with higher numbers in the "P" column are performed before those with lower numbers.
Consider the following expression:
w = x + y*z; 
The multiplication operator * has a higher precedence than the addition operator +, so the multiplication is performed before the addition. Furthermore, the assignment operator = has the lowest precedence, so the assignment is performed after all the operations on the righthand side are completed.

Obs.

http://docstore.mik.ua/orelly/webprog/jscript/ch05_02.htm

Iphone CSS

Dimensiunile ecranului 320px cu 480px.

<meta name="viewport" content="width=320">

-> pentru a seta latimea ecranului (si implicit zoomul).
 
 
Putin javascript: 
 
window.scrollTo(0, 1) -> pentru a ascunde bara iphone-ului 
onorientationchange -> eveniment: la schimbarea orientarii mobilului ( portret <->orizontal ) 

http://css-tricks.com/video-screencasts/38-basics-tips-on-designing-for-the-iphone/ 

Colectarea gunoiului in javascript

Garbage Collection

In languages like C and C++, memory must be freed manually.

The JavaScript interpreter is able to detect when an object will never again be used by the program. When it determines that an object is unreachable (i.e., there is no longer any way to refer to it using the variables in the program), it knows that the object is no longer needed and its memory can be reclaimed.

Garbage collection is automatic and is invisible to the programmer. You can create all the garbage objects you want, and the system will clean up after you!
 
http://docstore.mik.ua/orelly/webprog/jscript/ch04_05.htm 


Variables scope chain


When JavaScript code needs to look up the value of a variable x (a process called variable name resolution), it starts by looking at the first object in the chain. If that object has a property named x, the value of that property is used. If the first object does not have a property named x, JavaScript continues the search with the next object in the chain. If the second object does not have a property named x, the search moves on to the next object, and so on.



http://docstore.mik.ua/orelly/webprog/jscript/ch04_07.htm

Variabile In JavaScript

Exemple de variabile:
var i, sum;
for(var i = 0, j=10; i < 10; i++,j--) document.write(i*j, "
");

Observatii importante:
  • If you attempt to read the value of an undeclared variable, JavaScript will generate an error.
  • If you assign a value to a variable that you have not declared with var, JavaScript will implicitly declare that variable for you. Implicitly declared variables are always created as global variables, even if they are used within the body of a function. To prevent the creation of a global variable (or the use of an existing global variable) when you meant to create a local variable for use within a single function, you must always use the var statement within function bodies.:
Exemplu:
var scope = "global";         // Declare a global variable
function checkscope( ) {
    var scope = "local";      // Declare a local variable with the same name
    document.write(scope);    // Use the local variable, not the global one
}
checkscope( );               // Prints "local" 
  • All variables declared in a function, no matter where they are declared, are defined throughout the function.
Exemplu:
var scope = "global";
function f( ) {
    alert(scope);         // Displays "undefined", not "global"
    var scope = "local";  // Variable initialized here, but defined everywhere
    alert(scope);}         // Displays "local"}
f( ); 

The local variable is defined throughout the body of the function, which means the global variable by the same name is hidden throughout the function. Although the local variable is defined throughout, it is not actually initialized until the var statement is executed.

Cartea:
http://docstore.mik.ua/orelly/webprog/jscript/ch04_01.htm

    Calculator js pentru credite bancare

    Teoria:
    http://www.investopedia.com/articles/03/082703.asp


    Practica:

    Enter Loan Information:
    1) Amount of the loan (any currency):
    2) Annual percentage rate of interest:
    3) Repayment period in years:



    Payment Information:
    4) Your monthly payment will be:
    5) Your total payment will be:
    6) Your total interest payments will be:




    Calculul efectiv (javascript):


    function calculate() {
    // Get the user's input from the form. Assume it is all valid.
    // Convert interest from a percentage to a decimal, and convert from
    // an annual rate to a monthly rate. Convert payment period in years
    // to the number of monthly payments.
    var principal = document.loandata.principal.value;
    var interest = document.loandata.interest.value / 100 / 12;
    var payments = document.loandata.years.value * 12;

    // Now compute the monthly payment figure, using esoteric math.
    var x = Math.pow(1 + interest, payments);
    var monthly = (principal*x*interest)/(x-1);

    // Check that the result is a finite number. If so, display the results.
    if (!isNaN(monthly) &&
    (monthly != Number.POSITIVE_INFINITY) &&
    (monthly != Number.NEGATIVE_INFINITY)) {

    document.loandata.payment.value = round(monthly);
    document.loandata.total.value = round(monthly * payments);
    document.loandata.totalinterest.value =
    round((monthly * payments) - principal);
    }
    // Otherwise, the user's input was probably invalid, so don't
    // display anything.
    else {
    document.loandata.payment.value = "";
    document.loandata.total.value = "";
    document.loandata.totalinterest.value = "";
    }
    }

    // This simple method rounds a number to two decimal places.
    function round(x) {
    return Math.round(x*100)/100;
    }



    Link:

    http://docstore.mik.ua/orelly/webprog/jscript/ch01_08.htm#jscript4-CHP-1-EX-3


    Cartea:

    Selectorii CSS

    SelectorCe reprezintaDenumire
    *
    Orice element
    Selector universal
    EOrice element E, i.e orice marcaj de tipul ESelectori de marcaj
    E FOrice element F, care este descendent al unui element de tip ESelector Descendent
    E > F
    Orice element F care este copil al unui element de tip E

    Selector copil
    E:first-childOrice element E, cand este primul copil ala parintelui sauSelector primul-copil
    E:link
    E:visited
    Linkurile nevizitate inca/vizitatePseudo-clasele linkurilor
    E:active
    E:hover
    E:focus
    Linkurile E, la diferite actiuni (atentie la ordinea LOVE/HATE)Pseudo-clasele
    dinamice
    E:lang(c) Orice element E daca este in limba cPseudo clasa de limba
    E + F
    Orice element F ce este imediat urmator unui element vecin, de tip E
    Selector adiacent
    E[x]
    Orice element E, al carui atribut x este setat

    Selector de atribut
    E[x="eroare"]
    Orice element E, al carui atribut x are exact valoarea "eroare"

    Selector de atribut
    E[x~="warning"]
     Orice element E, al carui atribut x are contine valoarea "eroare"(dintr-o lista de valori)
    Selector de atribut
    E[x|="en"]
    Orice element E, al carui atribut x incepe cu "en"

    Selector de atribut
    DIV.warning
    Echivalent cu DIV[class~="warning"]: orice div ale carui clase contine si valoarea "warning"

    Selector de clasa
    E#myid
    Orice element E cu id-ul "myid"
    Selector de id


    Rezolutii curente si denumirile lor

    Code Name Aspect ratio Width Height
    VGA Video Graphics Array 4:3 640 480
    SVGA Super Video Graphics Array 4:3 800 600
    XGA eXtended Graphics Array 4:3 1024 768
    XGA+ eXtended Graphics Array Plus 4:3 1152 864
    WXGA Widescreen eXtended Graphics Array 5:3 1280 768
    WXGA Widescreen eXtended Graphics Array 8:5 (16:10) 1280 800
    SXGA Super eXtended Graphics Array 4:3 1280 960
    SXGA Super eXtended Graphics Array 5:4 1280 1024
    WXGA Widescreen eXtended Graphics Array 16:9 1366 768
    WSXGA Widescreen Super eXtended Graphics Array 8:5 (16:10) 1440 900
    UXGA Ultra eXtended Graphics Array 4:3 1600 1200
    WSXGA+ Widescreen Super eXtended Graphics Array Plus 8:5 (16:10) 1680 1050
    HD-1080 Full High Definition 16:9 1920 1080
    WUXGA Widescreen Ultra eXtended Graphics Array 8:5 (16:10) 1920 1200

    Trepte pentru marimea fonturilor in Html/css

    <font size="1">...</font>
    sau:
    font[size="1"]{
    font-size:10px
    }


    <font size="2">...</font>
    sau:
    font[size="2"]{
    font-size:13px
    }


    <font size="3">...</font>
    sau:
    font[size="3"]{
    font-size:16px; // medium size
    }


    <font size="4">...</font>
    sau:
    font[size="4"]{
    font-size:18px;
    }


    <font size="5">...</font>
    sau:
    font[size="5"]{
    font-size:24px;
    }


    <font size="6">...</font>
    sau:
    font[size="6"]{
    font-size:32px;
    }


    <font size="7">...</font>
    sau:
    font[size="7"]{
    font-size:48px;
    }


    Valoarea default a tuturor browserelor este 16px/medium, iar pentru titluri:

    Heading h1 - 32px

    Heading h2 - 24px

    Heading h3 - 19px

    Heading h4 - 16px

    Heading h5 - 13px

    Heading h6 - 11px

    Fonturi folosite pe web

    1. New York Times http://www.nytimes.com

      Georgia 20px/15px ; 24px (h1) + Arial 10px

    2. Vanity Fair http://www.vanityfair.com

      Georgia 22px/13px+Verdana 10px



    3. Yahoo http://news.yahoo.com

      Titluri: Georgia 26px (h1: 28px) + text: Arial 13px
    4. Mocoloco http://mocoloco.com/

      titluri : Arial litere mari 22px (h1:30px) + text: Georgia 12px
    5. BBC http://www.bbc.co.uk/

      Titluri: Verdana 18px (h1:22px) + text: Verdana 12px
    6. Wordpress http://wordpress.org

      Titluri: Georgia 16px Italic (h1:36px normal) + text: Lucida Grande 12px

    Concluzie: Georgia este unul din cele mai folosite fonturi, iar serifurile sunt in tendinte.

    Cum sa scrii o extensie pentru Google Chrome

    1. Citeste documentatia de la google:
    http://code.google.com/chrome/extensions/getstarted.html


    2.Creeaza propria ta extensie.
    Exemplul meu evidentiaza linkurile atributul "cu nofollow" doar prin background, culoare si caractere italice, dar nu si chenar. (chenarul poate strica uneori layoutul siteului).

    Codul este cat se poate de simplu: un css cu urmatoarele randulete:
    a[rel~=nofollow]
    {
    background-color: cyan !important;
    border: 0!important;
    color: #630 !important;
    font-style:italic !important
    }


    3.Instaleaza si trimite codul tau catre galeria de extensii.

    Rezultat:

    Eternele colturi rotunjite in css cross browser


    border:5px solid #666;
    -o-border-radius: 20px; // pentru Opera
    -icab-border-radius: 20px; //pentru Icab
    -khtml-border-radius: 20px;// pentru Konqueror
    -moz-border-radius: 20px;// pentru Firefox
    -webkit-border-radius: 20px;// pentru Safari si Chrome
    border-radius: 20px;// viitorul standard


    Ps. Despre IE:
    Prezent:
    "While the W3C has specified the border-radius properties in its latest CSS3 working draft, Microsoft has not implemented the border-radius properties in Internet Explorer 8." vezi http://msdn.microsoft.com/en-us/library/bb250413%28VS.85%29.aspx#borderradius

    Viitorul IE9:
    A more meaningful (from the point of view of web developers) example of standards support involves rounded corners. Here’s IE9 drawing rounded corners

    Update: Da, Ie9 suporta border-radius !!!

    Holographic Laser Projection

    Viitorul suna bine...



    Via http://lightblueoptics.com/products/light-touch/ and http://revuedesign.wordpress.com/2010/01/12/light-touch-light-blue-optics/