trim 사용 jQuery & javascript

$.trim()은 jQuery 라이브러리에서 제공되는 함수로, 문자열의 앞뒤 공백을 제거하는 역할을 합니다. 이 함수를 사용하여 문자열의 앞뒤에 있는 공백을 제거할 수 있습니다.

아래는 $.trim() 함수의 사용 예시입니다:

html
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

<script>
$(document).ready(function() {
  var str = "   Hello, world!   ";
  var trimmedStr = $.trim(str);
  console.log(trimmedStr); // "Hello, world!"
});
</script>

위의 예시에서는 $.trim() 함수를 사용하여 str 변수에 저장된 문자열의 앞뒤 공백을 제거합니다. trimmedStr 변수에는 공백이 제거된 문자열인 "Hello, world!"가 저장됩니다. 그 후 console.log()를 사용하여 결과를 출력합니다.

위의 코드에서는 jQuery 라이브러리를 사용하므로, 코드 전에 jQuery 라이브러리를 로드하는 <script> 태그를 추가해야 합니다. src 속성에는 jQuery 라이브러리의 URL을 지정합니다.

이와 같이 $.trim() 함수를 사용하여 문자열의 앞뒤 공백을 제거할 수 있습니다.

Vue.js에서는 $.trim()과 같은 jQuery의 함수를 사용할 필요가 없습니다. 대신, JavaScript의 내장 함수인 trim()을 사용하여 문자열의 앞뒤 공백을 제거할 수 있습니다.

아래는 Vue.js에서 trim() 함수를 사용하여 문자열의 앞뒤 공백을 제거하는 예시입니다:

html
<template>
  <div>
    <button @click="trimString">문자열 공백 제거</button>
  </div>
</template>

<script>
export default {
  methods: {
    trimString() {
      let str = "   Hello, world!   ";
      let trimmedStr = str.trim();
      console.log(trimmedStr); // "Hello, world!"
    }
  }
};
</script>

위의 예시에서는 <button>을 클릭하면 trimString 메서드가 호출되고, 해당 메서드에서 trim() 함수를 사용하여 문자열의 앞뒤 공백을 제거합니다. trimmedStr 변수에는 공백이 제거된 문자열인 "Hello, world!"가 저장됩니다. 그 후 console.log()를 사용하여 결과를 출력합니다.

Vue.js에서는 JavaScript의 기본 내장 함수인 trim()을 사용하여 문자열의 앞뒤 공백을 제거할 수 있습니다. 따라서 jQuery의 $.trim() 함수 대신 trim() 함수를 사용하는 것이 권장됩니다.