요약(Summary)

문자열에서 특정한 구간의 문자열을 추출한다.

문법(Syntax)

string.substring(from,to)

인자(Parameters)

인자명	데이터형	필수/옵션	설명
from	number	필수	탐색구간의 시작점(index)
to	number	옵션	탐색구간이 끝나는 점, 0 index부터 시작됨

반환값(Return)

string, from과 to 사이의 문자열

설명(Description)

from과 to 모두 index 0부터 시작하는 위치 값을 가진다.
from이 to 보다 작으면 from부터 to사이의 문자열을 리턴한다.
from이 to 보다 크면 to부터 from 사이의 문자열을 리턴한다.
from과 to가 같으면 빈문자열을 리턴한다.

slice, substring, substr 비교  

var str = 'coding everybody';	str.slice	str.substr	str.substring
function(7)	everybody	everybody	everybody
function(0,7)	coding	coding	coding
function(3,7)	ing	ing eve	ing
function(7,2)		ev	ding
function(-7)	erybody	erybody	coding everybody
function(-7,2)		er	co
function(7,7)		everybo

예제(Example)

var str = 'coding everybody';
alert(str.substring(0)) // coding everybody 
alert(str.substring(0,6)) // coding 
alert(str.substring(7,0));  // coding 
alert(str.substring(7,2)); // ding

slice, substr, substring의 차이점

<style type="text/css">
  .reference {
  border: 1px solid gray;
  border-collapse: collapse;
  width: 80%;
  }
  .reference th {
  background: none repeat scroll 0 0 #EEEEEE;
  }
  .reference td, .reference th {
  border: 1px solid gray;
  padding: 5px;
  }
  </style>
<table class="reference">
<script type="text/javascript">
  var str = 'coding everybody'; 
document.write('<tr>');
  document.write('<th>인자</th>');
  document.write('<th>slice</th>');
  document.write('<th>substr</th>');
  document.write('<th>substring</th>');
document.write('</tr>');

document.write('<tr>');
  document.write('<td>function(7)</td>');
  document.write('<td>'+str.slice(7)+'</td>');
  document.write('<td>'+str.substr(7)+'</td>');
  document.write('<td>'+str.substring(7)+'</td>');
document.write('</tr>');

document.write('<tr>');
  document.write('<td>function(0,7)</td>');
  document.write('<td>'+str.slice(0,7)+'</td>');
  document.write('<td>'+str.substr(0,7)+'</td>');
  document.write('<td>'+str.substring(0,7)+'</td>');
document.write('</tr>');

document.write('<tr>');
  document.write('<td>function(3,7)</td>');
  document.write('<td>'+str.slice(3,7)+'</td>');
  document.write('<td>'+str.substr(3,7)+'</td>');
  document.write('<td>'+str.substring(3,7)+'</td>');
document.write('</tr>');

document.write('<tr>');
  document.write('<td>function(7,2)</td>');
  document.write('<td>'+str.slice(7,2)+'</td>');
  document.write('<td>'+str.substr(7,2)+'</td>');
  document.write('<td>'+str.substring(7,2)+'</td>');
document.write('</tr>');

document.write('<tr>');
  document.write('<td>function(-7)</td>');
  document.write('<td>'+str.slice(-7)+'</td>');
  document.write('<td>'+str.substr(-7)+'</td>');
  document.write('<td>'+str.substring(-7)+'</td>');
document.write('</tr>');

document.write('<tr>');
  document.write('<td>function(-7,2)</td>');
  document.write('<td>'+str.slice(-7, 2)+'</td>');
  document.write('<td>'+str.substr(-7, 2)+'</td>');
  document.write('<td>'+str.substring(-7, 2)+'</td>');
document.write('</tr>');

document.write('<tr>');
  document.write('<td>function(7,7)</td>');
  document.write('<td>'+str.slice(7, 7)+'</td>');
  document.write('<td>'+str.substr(7, 7)+'</td>');
  document.write('<td>'+str.substring(7, 7)+'</td>');
document.write('</tr>');

</script>
  </table>