웹 베이스: JavaScript에서 단어를 대문자로 쓰는 방법

다른 인터넷 기초 지식으로 돌아가다.마지막 예에서 우리는 공부했다How to Reverse a String in Javascript.겸사겸사 한마디 하자면, 우리 동네에 새로 들어온 사람들에게.네트워크 기초는 기본 프로그래밍 주제에 관한 시리즈로 모든 네트워크 개발자는 반드시 절대적으로 알아야 한다!너는 나의 사이트에서 인터넷 기초 문장을 볼 수 있다.자, 소개는 그만하고 수업을 시작합시다🤓
다음은 제가 소개할 세 가지 방법입니다.

toUpperCase()

slice()

charAt()

toLowerCase()

마지막으로 배운 지식을 활용하여 이 기본 알고리즘 문제를 해결할 수 있습니다.

/** Capitalize a Word
 *
 * Implement a function that takes a word and
 *  return the same word with the first letter capitalized
 *
 * capitalize('aWESOME')
 * Output: 'Awesome'
 * 
 */

준비됐어!다행이다, 우리 시작합시다!💪

웹 베이스: toUpperCase()

이 방법은 문자열의 모든 문자를 대문자로 변환하는 데 사용됩니다.원래 문자열은 변경되지 않습니다.반대로, 이것은 새로 수정된 문자열을 되돌려줍니다.🔅

const name = 'samantha';
const result = name.toUpperCase();

console.log(result); 
// 'SAMANTHA'

웹 베이스 예: toUpperCase()

예1:
우리 이 방법의 용례를 좀 봅시다.보시다시피 원본 문자열에는 영향을 주지 않습니다.만약 당신이 숫자가 있는 문자열이 있다면, 그것은 대문자가 없기 때문에, 이것은 변하지 않을 것이다.

const text = 'Web Basics 101';
const upper = text.toUpperCase();

text; // 'Web Basics 101'
upper; // 'WEB BASICS 101'

예2:
주의해야 할 일이 하나 있다.이 방법은 문자열에만 적용됩니다.다른 데이터 유형 (예: null, undefined 또는 number 을 전송하려고 하면 오류가 발생합니다.획득할 수 있습니다TypeError.따라서 이 함수에 전달하기 전에 형식을 확인하십시오. 그렇지 않으면 프로그램이 붕괴될 것입니다.

(null).toUpperCase(); // TypeError
(undefined).toUpperCase(); // TypeError
(['hi']).toUpperCase(); // TypeError
(45).toUpperCase(); // TypeError

웹 베이스: charAt()

이 방법은 문자열이 지정한 색인에 있는 문자를 되돌려줍니다.

const name = 'samantha';
const result = name.charAt(0);

console.log(result);
// 's'

웹 베이스 예: charAt()

예1:
기본값은 0입니다.이것은 그것이 첫 번째 자모를 되돌려준다는 것을 의미한다.자바스크립트의 배열은 0 인덱스라는 것을 기억하십시오.첫 번째 알파벳은 색인 0에서 시작합니다.

const text = 'Web Basics';

text.charAt(); // default is 0
// 'W'

text.charAt(text.length - 1); // get the last letter
// 's'

text.charAt(1000); // out of range index
// ''

예2:
만약 당신이 총명한 사람이라면, 숫자가 아닌 것을 전달하고 싶다면, 무슨 일이 일어날지😝 만약 네가 이렇게 하려고 한다면, 기본값은 인수할 것이고, 너는 첫 번째 알파벳을 얻을 것이다.

// Everything else will be the default (0) 

'hi'.charAt(undefined); // 'h'
'hi'.charAt(null); // 'h'
'hi'.charAt(false); // 'h'
'hi'.charAt('W'); // 'h'

charAt() 및 [] 기호 간의 차이

JavaScript 경험이 더 많으면 다른 사람이 괄호 기호를 사용하여 문자열에 액세스하는 것을 볼 수 있습니다.

const name = 'Samantha';

name.charAt(2); // 'm'
name[2]; // 'm'

그들은 같은 결과를 내놓았는데, 그렇다면 무슨 차이가 있겠는가.좋아, 이 모든 것은 브라우저 지원에 귀결된다.charAt 첫 번째 ECMAScript 1에 도입되므로 모든 브라우저에서 지원됩니다.🤩. 괄호 표현은 ECMAScript 5에 도입됩니다.따라서 괄호 표현은 Internet Explorer 7 및 다음 릴리즈에서 사용할 수 없습니다.특히 오래된 브라우저가 지원하는 클라이언트 프로젝트를 처리할 때 이 점을 기억해야 한다.

웹 베이스: 슬라이스()

이 방법은 문자열의 일부분을 추출하고 추출한 부분을 새 문자열로 되돌려줍니다.🍏 다시 한 번 자바스크립트는 0 - index임을 알려드립니다.첫 번째 문자의 위치는 0, 두 번째 문자의 위치는 1입니다.👍
이 방법은 두 개의 매개 변수를 받아들인다: 시작과 끝
시작. 추출할 시작 인덱스를 전달하는 곳입니다.컨텐트가 전송되지 않으면 기본값은 0 (또는 첫 번째 문자) 입니다.
끝. 색인을 전달하는 곳입니다. 그 전에 추출을 끝냅니다.이 인덱스의 문자는 포함되지 않습니다.컨텐트가 전송되지 않으면 slice() 시작 문자부터 끝 문자까지 모두 선택됩니다.

const name = 'samantha';
const sliced = name.slice(0,3);

console.log(sliced); // 'sam'
console.log(name); // 'samantha'

웹 기본 예: slice()

예1:slice() 문자열을 복제하거나 복사하는 좋은 방법입니다.0을 불러올 수도 있고 기본값만 인자 없이 시작할 수도 있습니다.마지막 알파벳을 원한다면, 간단하게 -1을 전달할 수 있다.

'Web Basics'.slice(0); // clone the string
// 'Web Basics'

'Web Basics'.slice(); // default is 0
// 'Web Basics'

'Web Basics'.slice(-1); // get the last letter
// 's'

예2:
시작 값과 끝 값을 중심으로 양수 또는 음수를 사용하여 원하는 문자열 부분을 추출할 수 있습니다.

'Web Basics'.slice(4, 7); // 'Bas'
'Web Basics'.slice(-6, -3); // 'Bas'
'Web Basics'.slice(4, -3); // 'Bas'

예 3: 범위 이상의 시작 지수
전송의 시작 값이 길이보다 크면 빈 문자열이 반환됩니다.반대로 길이가 넘는 마이너스 시작 값을 입력하면 전체 문자열만 되돌아옵니다.

'Web Basics'.slice(1000); // ''
'Web Basics'.slice(-1000); // 'Web Basics'

웹 기반: toLowerCase()

이 방법은 문자열의 모든 문자를 소문자로 변환하는 데 사용됩니다.원래 문자열은 변경되지 않습니다.반대로, 이것은 새로운 수정 문자열을 되돌려줍니다.본질적으로 toUpperCase()와 상반된다.

const name = 'SaMaNthA';
const result = name.toLowerCase();

console.log(result); 
// 'samantha'

웹 베이스 예: toLowerCase()

예1:

const original = 'WeB BasIcS 102';
const lower = original.toLowerCase();

console.log(original); // 'WeB BasIcS 102'
console.log(lower); // 'web basics 102'

예2:toUpperCase()와 마찬가지로 이 방법은 문자열에만 적용됩니다.다른 데이터 유형 (예: null, undefined 또는 number 을 전송하려고 하면 오류가 발생합니다.획득할 수 있습니다TypeError.따라서 이 함수에 전달하기 전에 형식을 확인하십시오. 그렇지 않으면 프로그램이 붕괴될 것입니다.

(null).toLowerCase(); // TypeError
(undefined).toLowerCase(); // TypeError
(['hey']).toLowerCase(); // TypeError
(75).toLowerCase(); // TypeError

알고리즘 도전

좋아, 이제 우리 모든 것을 모으자!이것은 당신의 알고리즘 도전입니다!너는 우리가 함께 사용하는 내장 함수로 이 문제를 해결할 수 있어야 한다💪

/** Capitalize a Word
 *
 * Implement a function that takes a word and
 *  return the same word with the first letter capitalized
 *
 * capitalize('hello')
 * Output: 'Hello'
 *
 * capitalize('GREAT')
 * Output: 'Great'
 *
 * capitalize('aWESOME')
 * Output: 'Awesome'
 *
 */

너 어떻게 했어, 해결했어?나는 이 박문에서 해결 방안을 제시하지 않을 것이다.하지만 나는 나에게 연결된 해결 방안을 제공할 것이다. 너는 그것으로 나와 비교할 수 있다.이 도전을 해결할 수 있는 여러 가지 방법이 있다는 것을 명심하세요.올바른 방법도 잘못된 방법도 없다.이것은 프로그래밍의 위대한 점이다. 너는 여러 가지 방법으로 같은 결과를 얻을 수 있다.물론 다른 방법보다 더 효과적인 방법도 있다.하지만 코드 초보자로서 우리는 그것을 해결할 수 있는 것에 전념할 수 있다는 것을 알고 있습니까?이게 첫걸음이야.더 많은 자신감을 얻고 문제를 해결하는 방법을 배울 때 항상 재구성할 수 있다.
My Solution

리소스

MDN Web Docs: toUpperCase

w3schools: toUpperCase

MDN Web Docs: charAt

w3schools: charAt

MDN Web Docs: slice

w3schools: slice

MDN Web Docs: toLowerCase

w3schools: toLowerCase

Stack Overflow: string.charAt(x) or string[x]

읽어주셔서 감사합니다.❤
인사! |Facebook | Medium | Blog