Closure in JavaScript

 Here are some questions that I solved during one of the online courses. Hope they will help you to understand closure in JavaScript


//Write a function, `nonsense` that takes an input `string`.
//This function contains another function, `blab` which alerts `string`
//and is immediately called inside the function `nonsense`.
// `blab` should look like this inside of the `nonsense` function:


    var nonsense(string){
         var function blab(){
             alert(string);
         };

         blab();
    }


//In your function, `nonsense`,
//change the immediate call to a setTimeout so that the call to `blab` comes after 2 seconds.
//The `blab` function itself should stay the same as before.
    var nonsense(string){
         var function blab(){
             alert(string);
         };
        
         setTimeout(blab(),2000);
    }

//Now, instead of calling `blab` inside of `nonsense`, return `blab` (without invoking it).
//Call `nonsense` with some string and store the returned value (the `blab` function) in a variable called `blabLater`.
//Call `nonsense` again with a different string and store the returned value in a variable called `blabAgainLater`.

     var nonsense(string){
         var function blab(){
             alert(string);
         };
        
         return blab();
    }

    var blabLater=nonsense('My name is Saif');
    var blabAgainLater=nonsense('My name is Khan');

//Write a function with a closure. The first function should only take one argument,
//someone's first name, and the inner function should take one more argument, someone's last name.
//The inner function should console.log both the first name and the last name.
    
    var lastName= function(firstName){
       
        var innerFunction=function(lastName){
            console.log(firstName + ' ' + lastName);
        };

        return innerFunction;
    }       

//Create a `storyWriter` function that returns an object with two methods. One method,
//`addWords` adds a word to your story and returns the story while the other one, `erase`,
//resets the story back to an empty string. Here is an implementation:

    var storyWriter= function(){
        var story='';
        return{
            addWords: function(word) {
              story+=' '+ word;
              },
            erase:function(){
                story='';
            },
            logStory:function(){
                console.log(story);
            }
        };
    };

I ran into interesting example that was given by Kyle Simpson about #closure misunderstanding in #javascript
 In the first snapshot, We expected the console to print 1, 2, 3 ,4 ,5 but it printed 6,6,6,6,6 instead of that. 
To solve that issue, Kyle suggested to use iffy so that each function will have its own 'i'. 

for (var i=1;i<=5;i++){
    setTimeout(function(){
    console.log("i: "+i);

    },i*1000);
}

for (var i=1;i<=5;i++){
    (function(i){
        setTimeout(function(){
        console.log("i: "+i);

        },i*1000);
    })(i);
}

Create a custom validation in Spring MVC4

There are few simple steps to create your custom validation :

1- Create a new package (ex. com.yourcompany.view)
2- Create a new annotation like in the screenshot below

3- Add the following annotation to your annotation interface as in the code below

import java.lang.annotation.Documented;
import java.lang.annotation.ElementType;
import java.lang.annotation.Retention;
import java.lang.annotation.RetentionPolicy;
import java.lang.annotation.Target;

import javax.validation.Constraint;
import javax.validation.Payload;


@Documented
@Constraint(validatedBy=PhoneConstraintValidator.class)
@Target({ElementType.METHOD,ElementType.FIELD})
@Retention(RetentionPolicy.RUNTIME)
public @interface Phone {

    String message() default "{Phone}";
    Class<?>[] groups() default {};
    Class<? extends Payload>[] payload() default {};
}

4- Define another class called PhoneConstraintValidator in the same package and the below code

import javax.validation.ConstraintValidator;
import javax.validation.ConstraintValidatorContext;

public class PhoneConstraintValidator implements ConstraintValidator<Phone, String> {

    @Override
    public void initialize(Phone phone) {
       
    }

    @Override
    public boolean isValid(String phoneField, ConstraintValidatorContext cxt) {
        if (phoneField == null){
            return false;
        }

        return phoneField.matches("[0-9()-]*");
    }

}


5- Add the annotation to your bean.

Easy !!! Yeah :)


 

Rest & Angular - Spring MVC4

To implement Rest & Angular client in MVC4, you need to :

1- Create the rest controller 

@RestController
public class ReleasesReportController {

    @RequestMapping("/releases")
    public List<Release> getReleases(){
        List<Release> releases=new ArrayList<Release>();
       
        Release release1 =new Release();
        release1.setName("Strong bad");
       
        Release release2 =new Release();
        release2.setName("Back to the feature");
       
        Release release3 =new Release();
        release3.setName("Trogdor");
       
        releases.add(release1);
        releases.add(release2);
        releases.add(release3);
       
        return releases;
       
    }
}

2- Add JSON mapping to the WebAppInitializer class 

    @Override
    public void onStartup(ServletContext servletContext) throws ServletException {
        WebApplicationContext context = getContext();
        servletContext.addListener(new ContextLoaderListener(context));
        ServletRegistration.Dynamic dispatcher = servletContext.addServlet("DispatcherServlet", new DispatcherServlet(context));
        dispatcher.setLoadOnStartup(1);
        dispatcher.addMapping("*.html");
        dispatcher.addMapping("*.pdf");
        dispatcher.addMapping("*.json");

    }


3- Bind it to the front end 


<html ng-app>

<head>
<title> Hello Releases Tracker</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js" > </script>
<script type="text/javascript" src="releases.js"></script>
</head>

<body>
    <div ng-controller="Releases">
        I have {{releases.length}} releases !
       
        <ul class="releases-container">
            <li ng-repeat="release in releases">
            {{release.name}}
             </li>
       
        </ul>
    </div>

</body>

</html>


4- Create the angular file (releases.js) under src/main/webapp folder

function Releases($scope, $http){
  
    $http.get('http://localhost:8080/ReleaseTracker/releases.json').
        success(function(data){
        $scope.releases=data;
    });
  
}

Custom validation example - Spring MVC 4

To build a custom validation example you need to:

1-Create an Interface
2-Create a class that implements ConstraintValidator
3-Use the  custom validation in the Bean


 Step 1: 

@Documented
@Constraint(validatedBy=PhoneConstraintValidator.class)
@Target({ElementType.METHOD,ElementType.FIELD})
@Retention(RetentionPolicy.RUNTIME)
public @interface Phone {

    String message() default "{Phone}";
    Class<?>[] groups() default {};
    Class<? extends Payload>[] payload() default {};
}

Step 2:

public class PhoneConstraintValidator implements ConstraintValidator<Phone, String> {

    @Override
    public void initialize(Phone phone) {
       
     }

    @Override
    public boolean isValid(String phoneField, ConstraintValidatorContext cxt) {
        if (phoneField == null){
            return false;
        }
        return phoneField.matches("[0-9()-]*");
    }

}

Step 3: 

@NotEmpty @Phone
    private String phoneNumber;

Famous Exceptions in Spring MVC 4

java.lang.UnsupportedOperationException: Cannot change HTTP accept header

The DispatcherServlet  looks for a bean with the name localeResolver.

If this isn't detected it will use the default, 

which is a AcceptHeaderLocaleResovler. 

 @Bean
 public MessageSource messageSource(){
  
  ResourceBundleMessageSource messageSource=new 

                ResourceBundleMessageSource();
  messageSource.setBasename("messages");
  return messageSource;
  
 }
 
 @Bean
 public LocaleResolver localeResolver(){
  SessionLocaleResolver resolver =new SessionLocaleResolver();
  resolver.setDefaultLocale(Locale.ENGLISH);
  return resolver;
 }
 
 @Override
 public void addInterceptors(InterceptorRegistry registry)
 {
  LocaleChangeInterceptor changeInterceptor=new 

                LocaleChangeInterceptor();
  changeInterceptor.setParamName("language");
  registry.addInterceptor(changeInterceptor);
 } 

Spring - MVC4 - web.xml file sample

<web-app id="WebApp_ID" version="3.0"
 xmlns="http://java.sun.com/xml/ns/javaee"
 xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
 http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd">

 <display-name>Archetype Created Web Application</display-name>

 <servlet>
   <servlet-name>springDispatcherServlet</servlet-name>
   <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
  
   <init-param>
       <param-name>contextConfigLocation</param-name>
       <param-value>com.saifmasadeh.WebConfig</param-value>
   </init-param>
  
   <init-param>
       <param-name>contextClass</param-name>
       <param-value>org.springframework.web.context.support.AnnotationConfigWebApplicationContext</param-value>
   </init-param>
  
   <load-on-startup>1</load-on-startup>
 </servlet>

 <servlet-mapping>
   <servlet-name>springDispatcherServlet</servlet-name>
   <url-pattern>*.html</url-pattern>
 </servlet-mapping>

</web-app>

Localization in struts2

1- add this line to the struts.xml file :

<constant name="struts.custom.i18n.resources" value="global" />

2-add the (global.properties) under source package

3-in the (global.properties)

connection.success.message=Connection Success %s


4-to use it in the action, just write the following :

getText("connection.success.message")