lasseesharp
lasseesharp

Reputation: 51

Repeat a function in JavaScript doesn't work

So I am trying to make a simple translator. I am just having some issues with it. For example, I want it to register the letter B and then it will write bob. Now when I write b in the translate to box (which is the normal variable) it says in the translated to box (which is theifTalk) [object HTMLTextAreaElement]bob. And in the console it says: Cannot read property 'repeat' of undefined. Anyways here's my code:

const theifTalk = document.getElementById('theiftalk');
const normal = document.getElementById('normal');
const translateBtn = document.getElementById('translateBtn');


translateBtn.onclick = function() {
    theifTalk.value = "";
    translate();
}

function translate() {

    if (normal.value.includes("b")) {
        var bCount = normal.value.match(/b/g)||[].length;

        b().repeat(bCount.length);        
    }

}

function b() {
    theifTalk.value = theifTalk + "bob";
}

HTML CODE:

<textarea type="text" id="normal" rows="15" cols="80" placeholder="Normal text goes in here..."></textarea>
<textarea type="text" id="theiftalk" rows="15" cols="80" placeholder="Theif Talk text goes out here..."></textarea>
<br>
<button id="translateBtn">translate</button>

Upvotes: 0

Views: 290

Answers (1)

Mamun
Mamun

Reputation: 68933

As you are not returning anything from function explicitly undefined is returned. You have return the value from function. Also, theifTalk is the element itself, you should take the value from that:

function b() {
  theifTalk.value = theifTalk.value + "bob";
  return theifTalk.value;
}

You also should set the value back to the theifTalk:

theifTalk.value = b().repeat(bCount.length);

const theifTalk = document.getElementById('theiftalk');
const normal = document.getElementById('normal');
const translateBtn = document.getElementById('translateBtn');

translateBtn.onclick = function() {
  translate();
}
function translate() {
  if (normal.value.includes("b")) {
    var bCount = normal.value.match(/b/g)||[].length;
    theifTalk.value = b().repeat(bCount.length);        
  }
}

function b() {
  theifTalk.value = theifTalk.value + "bob";
  return theifTalk.value;
}
<textarea type="text" id="normal" rows="15" cols="80" placeholder="Normal text goes in here..."></textarea>
<textarea type="text" id="theiftalk" rows="15" cols="80" placeholder="Theif Talk text goes out here..."></textarea>
<br>
<button id="translateBtn">translate</button>

Upvotes: 1

Related Questions