khamsat khamsat khamsat

jsH

jsH is Javascript compiler , uses to write code line by line (HTML5 , JS , CSS , JSON ) together with Javascript Expression .
with jsH you can control the content by Javascript Expression
another word you don't need to use DOM Selector to render Content
jsH is working like server side language .
anything in Javascript can be use in jsH

loop support :

unlike the most frameworks JS loop supported by jsH
for, while , array.forEach

Note :

any operator takes more than 2 ms will be ignored setTimeout() , setInterval() , XHR Ajax that doesn't mean these operator will not be executed as JS. will works Just as JS , but return will be Void


<div fn-init  >
 {%

   if(true){
   {{
      <p>Hello World :) </p>
   }}
 }

var names = ["Manassa","Joseph","Jad","Afrim","Shiraz"];
  for(var i=0; i < names.length; i++){
   {{
      <p>Hello : {{+names[i]+}} </p>
   }}
 }
 %}  
</div>
      

Result :

{% if(true){ {{

Hello World :)

}} } var names = ["Manassa","Joseph","Jad","Afrim","Shiraz"]; for(var i=0; i < names.length; i++){ {{

Hello : {{+names[i]+}}

}} } %}

<div fn-init  >
 {%

   if(true){
   setTimeout(() => {
     {{
        <p>Hello World :) </p>
     }}
   } , 2);
 }
 %}  
</div>
      

Result :

{% if(true){ setTimeout(() => { {{

Hello World :)

}} } , 2); } %}

as you see result is empty , but if you need to show result after a few time you should use DOM Selector


<div fn-init  >
 {%

   if(true){
    {{
        <p id="app"></p>
    }}
   setTimeout(() => {
      document.querySelector('#app').innerHTML = "Hello";
   } , 2000);
 }
 %}  
</div>
      

Result :

{% if(true){ {{

}} setTimeout(() => { document.querySelector('#app').innerHTML = "Hello"; } , 2000); } %}

Warning :(

jsH is Very sensitive to the semicolon so do not forget to put the semicolon after each .
except: loops , if condition , and try-catch .

how is jsH compile

The code is interpreted in two increments, first signle data is interpreted and secondly large and complex operations are performed .
JavaScript code is handled within these tags {@ simple Code @} and {% Complex Code %}

first {@ @}

These tags are used to compile the variables, and functions that will return value and this value must be numeric or literal type.
because this value is displayed in the content. Everything here is limited. {@ variable @} is interpreted before operations between {%%} and This is very important if you want to use it in the second process.

   {% 
      {{ {@new Date (); @} }} 
   %}

how it's works ?

jsH code :

{%

{{ {@new Date(); @} }}

%}

step 1 :

{%

{{ Sat Jan 13 2018 18:39:20 GMT+0300 (EAT) }}

%}

step 2 :

Sat Jan 13 2018 18:39:20 GMT+0300 (EAT)

second {% %}

This tag is used to work on large operations, unlike the first, through which you can execute JavaScript scripts. The goal is to write HTML content programmatically and logically The reverse JavaScript script can not use the quotation mark for text data to be used {{ <p>Hello</p> }} to type the values you want.

  {{+ Variable +}} 
is used for variables ,objects , and functions that return value


{%
  if(true)
   {
     {{
        <h1>Date : {{+ new Date() +}} </h1>
     }}
   }
%}     
    
khamsat khamsat khamsat khamsat