javascript string handling with array why it's print 'r' on console but not 'z'

Strings are immutable. You cannot change them. You have to create a new string for that.

function cun(str) {
    var newString = 'z' + str.substring(1);
    console.log( newString[0] );
    return newString;
}

cun('ratul');

Because strings are immutable (meaning you can't change their value) in JavaScript.

You can accomplish what you are trying to do a variety of ways, including:

var cun = function(cun){
    return "z" + cun.slice(1);
}
cun("ratul");

from the rhino book:

In JavaScript, strings are immutable objects, which means that the characters within them may not be changed and that any operations on strings actually create new strings. Strings are assigned by reference, not by value. In general, when an object is assigned by reference, a change made to the object through one reference will be visible through all other references to the object. Because strings cannot be changed, however, you can have multiple references to a string object and not worry that the string value will change without your knowing it

You can try:

String.prototype.replaceAt=function(index, character) {
   return this.substr(0, index) + character + this.substr(index+character.length);
}
var hello="ratul";
alert(hello.replaceAt(0, "z"));

Here is working Demo