Getting Started with Angular2 and Bootstrap

Getting Started with Angular2 and Bootstrap

# Install Angular2 Cli
npm install -g @angular/cli

# Create new application
ng new application-name

# Start serving application, see browser localhost:4200
ng serve

# In src directory, install bootstrap using bower
bower install bootstrap –save

# Link bootstrap style to application, edit .angular-cli.json
# add new element to app->styles array
“bower_components/bootstrap/dist/css/bootstrap.min.css”

# Stop and again start serving the application and it is ready!

JavaScript “this” at simplest level

In JavaScript “this” thing confuses the beginners as well as experienced ones sometimes. There is lot of stuff on Internet (may be like this one) and almost each book on JavaScript emphasizes on explaining “this“.

Here lets go through very simplest definition (though informal one) which can help us in understanding “this“.

this” is a reference to object to which enclosing method belongs and if there is no enclosing method “this” is global object “window“.

Examples

1. In global context, without enclosing function
console.log(this);
// window….

Here “this” is in global context hence simply it is nothing but reference to “window” object.
2. In global context, within enclosing function

function foo(){
     console.log(this);
}

foo();
// window

Here “this” is in enclosing function which belongs to global object “window” (you can call window.foo() here),
hence here “this” is “window”.

 

3. In enclosing function which is method of some object.

var foo = {
    bar: function (){
        console.log(this);
    }
};

foo.bar();
// foo

Here “this” is in enclosing function “bar” which belongs to object “foo”, hence “this” is a reference to “foo” object.

 

4. Another varient of #3, but with one more level of nesting

var person = {
    name: “Sachin”,
    showName: function () { console.log(this.name); },
    employee: {
        name: “Web Develoepr Sachin”,
        showName: function () { console.log(this.name);}
    }
};

person.showName();
// Sachin

person.employee.showName();
// Web Developer Sachin

Even if this example shows nesting here, but if we simply follow our informal defination “person.showName” method’s “this” is “person” object and “person.employee.showName” method’s “this” is “employee” object.

 

Let me know your comments.

Happy coding 🙂

Javascript string functions

Knowing string functions is always useful and saves time to Google the correct function. Hence I have prepared list of most useful, usually used string functions.

First of all definition of String

In computer programming, a string is traditionally a sequence of characters, either as a literal constant or as some kind of variable.

In JavaScript context it inherits prototype of String object.
A string can be any text inside double or single quotes.

List of almost all kinds of string manipulations.

Creating a String:
var name = new String (“sachin”)
Or simply
var name = “sachin”

Changing a String
Replace
name.replace(“in”,”out”)
replace replaces first occurrence only.

Change case
name.toUpperCase()
name.toLowerCase()

// Custom title case function

Concat
var fullName = name + ” ” + “Gaikwad”
or
var fullName = name.concat(” Gaikwad”)

Stuff String or Char
name.substring(0,3)+”123″+name.substring(3,name.length)
//sac123hin
// No direct method to stuff string/char in string

Stat- counting

chars
name.length

words
name.split(” “).length

Char at position
name.charAt(0) //s

Check Substring
name.includes(“chi”) // true

Get first occurrence index or last occurrence index of other string resp.
name.indexOf(“sa”)
name.lastIndexOf(“hi”)

Extract another string 
name.slice(2) // chin

Trim whitespace
name.trim() // removes whitespace ” sachin ” to “sachin”

 

Export/Import from/to other data type

Array
name.split(” “) // gives array
nameArray.join() // gives string

Number
parseInt(“123”)// string to integer
parseFloat(“12.3”) // string to float
“”+123 // number to string