Как отфильтровать массив из букв, найденных в игре в слова? ⇐ CSS

[Anonymous]

У меня есть словесная игра, созданная с помощью JavaScript.
Я играю против робота, который угадывает слово из имеющегося у него каталога слов. Если угаданное слово имеет совпадающую букву и соответствующий индекс, оно становится синим и отображается.
Если какая-либо буква существует только в отгаданном слове, но не имеет правильного индекса, она становится оранжевой.
Робот теперь случайным образом угадывает слова и ничего не делает с синими или оранжевыми буквами. Я хочу, чтобы робот отфильтровал каталог слов, из которого он угадывает, с помощью букв, которые являются правильными или существуют в угадываемом слове.
Я могу сохранить эти буквы в двух переменных, но у меня есть область действия проблемы с фильтрацией каталога слов из области действия этой переменной

Код: Выделить всё

let wordDirectory = ["ABOUT", "ABOVE", "ACTOR", "ACUTE", "ADEPT", "ADMIT", "ADOPT", "ADORE", "ADULT", "AFTER", "AGILE", "AGREE", "AISLE", "ALBUM", "ALERT", "ALIEN", "ALIKE", "ALIVE", "ALLOW", "ALONG", "ALOUD", "ALTER", "AMBER", "AMEND", "AMPLE", "AMPLY", "AMUSE", "ANGEL", "ANGLE", "ANKLE", "APPLE", "APPLY", "APRON", "ARROW", "ASSET", "AVERT", "AVOID", "BACON", "BAKER", "BASIC", "BASIL", "BASIN", "BATHE", "BEACH", "BEARD", "BEAST", "BEATS", "BEGIN", "BEGUN", "BEING", "BELOW", "BIRCH", "BIRTH", "BLACK", "BLANK", "BLINK", "BLOWN", "BLUSH", "BOARD", "BOAST", "BONUS", "BOOST", "BOUND", "BOWEL", "BRAID", "BRAIN", "BRAKE", "BRAND", "BRAVE", "BREAD", "BREAK", "BRIDE", "BRIEF", "BRING", "BRISK", "BROKE", "BROOM", "BROWN", "BULKY", "BUNCH", "BUYER", "CABIN", "CABLE", "CAMEL", "CANDY", "CATER", "CHAIN", "CHAIR", "CHALK", "CHARM", "CHART", "CHASM", "CHEAP", "CHIEF", "CHINA", "CHIPS", "CHOKE", "CHOPS", "CIGAR", "CLAIM", "CLAMP", "CLASP", "CLASS", "CLEAN", "CLEAR", "CLIMB", "CLOAK", "CLONE", "CLOSE", "CLOTH", "CLOUD", "CLOVE", "CLOWN", "COAST", "CORAL", "COUNT", "CRAFT", "CRANE", "CRANK", "CRAWL", "CRISP", "CROSS", "CROWD", "CROWN", "CRUSH", "CRUST", "CURVE", "DAILY", "DAIRY", "DANCE", "DATUM", "DECAY", "DECOR", "DELAY", "DEVIL", "DIARY", "DINER", "DIRTY", "DISCO", "DIVER", "DOUBT", "DOUGH", "DRAFT", "DRAIN", "DRAWN", "DREAM", "DRESS", "DRINK", "DRIVE", "EARLY", "EARTH", "EIGHT", "ELBOW", "EMAIL", "EMPTY", "ENJOY", "EQUAL", "EQUIP", "ETHIC", "EXACT", "EXIST", "EXTRA", "FACET", "FAIRY", "FAITH", "FALSE", "FANCY", "FAULT", "FAVOR", "FEAST", "FETCH", "FIBER", "FIELD", "FINAL", "FIRST", "FLAIR", "FLAKE", "FLASK", "FLICK", "FLOAT", "FLOCK", "FLOWN", "FLUSH", "FLUTE", "FOCAL", "FOCUS", "FORCE", "FORUM", "FOUND", "FRAME", "FRANK", "FRAUD", "FRESH", "FRONT", "FROST", "FROZE", "FRUIT", "FUNGI", "FUNNY", "GHOST", "GIVEN", "GLASS", "GLAZE", "GLOBE", "GLORY", "GLOVE", "GRACE", "GRADE", "GRAIN", "GRAND", "GRAPE", "GRAPH", "GRASP", "GRASS", "GRAVY", "GREAT", "GREET", "GRILL", "GROUP", "GROWN", "GUARD", "GUESS", "GUEST", "GUIDE", "HABIT", "HAIRY", "HAPPY", "HARDY", "HASTE", "HAUNT", "HEART", "HEAVY", "HEFTY", "HONEY", "HORSE", "HOTEL", "HOUSE", "HUMAN", "HUMID", "HUMOR", "HUSKY", "IDEAL", "IMAGE", "IMPLY", "INCUR", "INDEX", "INFER", "INFRA", "INLET", "INNER", "INPUT", "INSET", "IVORY", "JEANS", "JOINT", "JUICE", "LABOR", "LADEN", "LAPSE", "LARGE", "LATEX", "LAUGH", "LAYER", "LEAFY", "LEANS", "LEARN", "LEMON", "LIGHT", "LINER", "LIVER", "LIVES", "LODGE", "LOFTY", "LOGIC", "LOVER", "LOWER", "LUCID", "LUCKY", "LUNCH", "LYMPH", "MACRO", "MAGIC", "MAIZE", "MAJOR", "MAKER", "MANGO", "MAPLE", "MARCH", "MATCH", "MEDAL", "MEDIA", "MERCY", "MERIT", "METAL", "MICRO", "MIDST", "MIGHT", "MINOR", "MINUS", "MIXER", "MODEL", "MOIST", "MONEY", "MONTH", "MORAL", "MOUNT", "MOUSE", "MOUTH", "MOVER", "MOVIE", "MULTI", "MUSIC", "NAIVE", "NEWLY", "NEXUS", "NICHE", "NIGHT", "NINJA", "NOBLE", "NODAL", "NOISE", "NOISY", "NORTH", "NOTCH", "NOTED", "NOVEL", "NURSE", "OCEAN", "OFTEN", "OLIVE", "ONSET", "OPERA", "OPTIC", "ORBIT", "ORGAN", "OTHER", "OUGHT", "OUNCE", "OUTER", "OVERT", "OWING", "OWNED", "OWNER", "OXIDE", "PACED", "PAINT", "PANIC", "PANTS", "PARTY", "PASTE", "PATCH", "PATIO", "PAUSE", "PAVED", "PAYER", "PEACH", "PEARL", "PEDAL", "PHASE", "PHONE", "PIANO", "PILOT", "PINCH", "PIVOT", "PIZZA", "PLACE", "PLAIN", "PLANE", "PLANK", "PLANT", "PLATE", "PLEAD", "PLUCK", "POINT", "POKER", "POLAR", "PORCH", "POUCH", "POUND", "POWER", "PRESS", "PRICE", "PRIDE", "PRIME", "PRINT", "PRIZE", "PRONE", "PROUD", "PROVE", "PUNCH", "PUPPY", "PURGE", "PURSE", "QUAIL", "QUEEN", "QUERY", "QUEST", "QUICK", "QUIET", "QUILT", "QUITE", "QUOTA", "QUOTE", "RADIO", "RAINY", "RAISE", "RANCH", "RANGE", "RAPID", "RATIO", "REACH", "REACT", "READY", "REALM", "REGAL", "REIGN", "RELAX", "RELAY", "RELIC", "REMIT", "REPAY", "REPLY", "RESIN", "RIDGE", "RIGHT", "RINSE", "RISKY", "RIVAL", "ROAST", "ROCKY", "ROMAN", "ROUGH", "ROUND", "ROYAL", "RUSTY", "SADLY", "SAINT", "SALON", "SALTY", "SANDY", "SATIN", "SAUCE", "SCALE", "SCARE", "SCARF", "SCARY", "SCENT", "SCORE", "SCOUT", "SCREW", "SERUM", "SETUP", "SHADE", "SHADY", "SHAKE", "SHAKY", "SHAME", "SHAPE", "SHARE", "SHARK", "SHARP", "SHAVE", "SHEAR", "SHELF", "SHELL", "SHIFT", "SHINE", "SHIRT", "SHOCK", "SHORE", "SHORT", "SHOUT", "SHOVE", "SHOWN", "SHRUB", "SHRUG", "SIGHT", "SIGMA", "SILKY", "SINCE", "SIXTY", "SKATE", "SKILL", "SKIRT", "SLACK", "SLATE", "SLEEP", "SLEPT", "SLICE", "SLICK", "SLIDE", "SLING", "SLUMP", "SMALL", "SMART", "SMILE", "SMOKE", "SMOKY", "SNACK", "SNAIL", "SNAKE", "SNEAK", "SOBER",  "SOLAR", "SOLVE", "SOUND", "SOUTH", "SPACE", "SPADE", "SPARE", "SPARK", "SPEAK", "SPEAR", "SPELL", "SPICE", "SPICY", "SPIKE", "SPILL", "SPINE", "SPLIT", "SPOIL", "SPOKE", "SPORT", "SPRAY", "SQUAD", "SQUAT", "SQUID", "STACK", "STAFF", "STAGE", "STAIN", "STAIR", "STAKE", "STALE", "STAMP", "STAND", "STARE", "STEAD", "STEAK", "STEAL", "STEAM", "STEEL", "STERN", "STICK", "STILL", "STING", "STOCK", "STONE", "STORE", "STORM", "STORY", "STOVE", "STRAP", "STRAW", "STRAY", "STUCK", "STUDY", "STUFF", "STUMP", "STYLE", "SUGAR", "SUITE", "SUNNY", "SUPER", "SWAMP", "SWEAT", "SWEPT", "SWIFT", "SWINE", "SWING", "SWIRL", "SYRUP", "TABLE", "TAKEN", "TEACH", "TEMPO", "THANK", "THEIR", "THICK", "THING", "THINK", "THIRD", "THORN", "THOSE", "THREE", "THROW", "THUMB", "THYME", "TIDAL", "TIGER", "TIMER", "TODAY", "TOKEN", "TONIC", "TOUCH", "TOUGH", "TOWEL", "TOWER", "TOXIC", "TOXIN", "TRACE", "TRACK", "TRADE", "TRAIL", "TRAIN", "TRASH", "TREAD", "TREND", "TRIAD", "TRIAL", "TRIBE", "TRICK", "TWICE", "TWINS", "ULCER", "ULTRA", "UNCLE", "UNDER", "UNIFY", "UNITE", "UNITY", "UPSET", "URBAN", "USAGE", "VAGUE", "VALID", "VALUE", "VIDEO", "VIRAL", "VITAL", "VOCAL", "VODKA", "VOICE", "VOWEL", "WAFER", "WAGED", "WAGER", "WAGON", "WAIST", "WAIVE", "WASTE", "WATCH", "WATER", "WEARY", "WEIGH", "WEIRD", "WHALE", "WHARF", "WHEAT", "WHILE", "WHITE", "WHOLE", "WHOSE", "WIDEN", "WIDTH", "WINDY", "WOMAN", "WOMEN", "WORLD", "WORSE", "WORST", "WORTH", "WOULD", "WOUND", "WOVEN", "WRECK", "WRITE", "WRONG", "YEAST", "YIELD", "YOUNG", "YOUTH"];

// generate random word for user and robot to guess

const randomWord = function(array) {
return array[Math.floor(Math.random() * array.length)];
}

let pickedWord = randomWord(wordDirectory);

//recieve user input and show it on screen.

const btn = document.getElementById("btn");
console.log(pickedWord);

btn.addEventListener("click", function(e) {
e.preventDefault();
const li = document.createElement("li");
const list = document.getElementById("list");
const list2 = document.getElementById("list2");

const userGuess = document.getElementById("userInput").value;

/*USER---------*/
const guessResult = document.createElement('p')
if (userGuess === pickedWord) {
li.style.color = 'green';
guessResult.appendChild(document.createTextNode(userGuess));
alert("user wins");
window.location.reload(false);

} else {
userGuess.split('').forEach((char, i) => {
const span = document.createElement('span');

if (pickedWord.charAt(i) === char) {
span.style.color = 'dodgerblue';
} else if (pickedWord.includes(char)) {
span.style.color = 'orange';
}

span.appendChild(document.createTextNode(char));
guessResult.appendChild(span);
});
}

li.appendChild(guessResult);
list.appendChild(li);

setTimeout(function() {
startRobot();
}, 2000);
});

/*ROBOT----------------------------------- */
function startRobot() {
const randomWord = function(array) {
return array[Math.floor(Math.random() * array.length)];
}

let robotGuess = randomWord(wordDirectory);
const li = document.createElement("li");
const robotResult = document.createElement('p')

if (robotGuess === pickedWord) {
li.style.color = 'green';
guessResult.appendChild(document.createTextNode(robotGuess));
alert("robot wins");
window.location.reload(false);

} else {
robotGuess.split('').forEach((char, i) =>  {
const span = document.createElement('span');

if (pickedWord.charAt(i) === char) {
span.style.color = 'dodgerblue';

} else if (pickedWord.includes(char)) {
span.style.color = 'orange';
}

span.appendChild(document.createTextNode(char));
robotResult.appendChild(span);
});

}

li.appendChild(robotResult);
list2.appendChild(li);

}

Код: Выделить всё

* {
margin: 0;
padding: 0;
box-sizing: border-box;
}

.container {
text-align: center;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}

.rules {
font-size: 1.5rem;
}

#green {
color: green;
}

#blue {
color: dodgerblue;
}

#orange {
color: orange;
}

form input {
width: 200px;
height: 50px;
}

form button {
height: 50px;
}

form {
margin-top: 40px;
}

.lists {
width: 100%;
height: 100%;
border: 1px solid red;
display: flex;
justify-content: center;
align-items: center;
margin-top: 10px;
}

.lists ul {
margin: 10px 20px;
list-style: none;
}

Код: Выделить всё

Robot






If the whole word is correct
If the letter guessed and its position is correct
If the letter is corect but its position is not

Robot will start guessing 2 seconds after user guessed



Submit


[list]
user
[/list]
[list]
robot
[/list]

.
как я могу фильтровать массив по тому, где находится моя переменная ?

Подробнее здесь: https://stackoverflow.com/questions/686 ... -word-game