{"id":5572,"date":"2024-08-28T22:48:03","date_gmt":"2024-08-28T22:48:03","guid":{"rendered":"https:\/\/wikiform.fr\/codespace\/verifier-plusieurs-conditions-en-javascript-or-and\/"},"modified":"2024-08-28T22:48:05","modified_gmt":"2024-08-28T22:48:05","slug":"verifier-plusieurs-conditions-en-javascript-or-and","status":"publish","type":"post","link":"https:\/\/wikiform.fr\/codespace\/verifier-plusieurs-conditions-en-javascript-or-and\/","title":{"rendered":"5.5 V\u00e9rifier Plusieurs Conditions en JavaScript (OR\/AND)"},"content":{"rendered":"\n<p><strong>V\u00e9rifier Plusieurs Conditions en JavaScript (OR\/AND)<\/strong> est une comp\u00e9tence essentielle qui permet de cr\u00e9er des scripts plus robustes et dynamiques. En utilisant les op\u00e9rateurs logiques <strong>OR (||)<\/strong> et <strong>AND (&#038;&#038;)<\/strong>, vous pouvez contr\u00f4ler le flux de votre code de mani\u00e8re fluide. Apprenons comment les utiliser \u00e0 travers des exemples concrets de code.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Introduction aux <strong>Conditions (OR\/AND)<\/strong> en JavaScript<\/h2>\n\n\n\n<div id=\"videoContainer\" style=\"position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; background: #000;\">\n  <iframe src=\"https:\/\/player.vimeo.com\/video\/658880606?dnt=1&#038;fullscreen=0&#038;pip=0\" loading=\"lazy\" loading=\"lazy\" style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%;\" frameborder=\"0\" allow=\"autoplay\" allowfullscreen id=\"vimeoPlayer\"><\/iframe>\n  \n  <!-- Popup Desktop -->\n  <div id=\"popupContainer\" class=\"desktop-popup\" style=\"display: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 90%; max-width: 400px; padding: 20px; border-radius: 10px; text-align: center; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); background-color: rgba(255, 255, 255, 0.95); box-sizing: border-box;\">\n    <h2 style=\"color: #333; font-size: 1.5em; margin: 10px 0;\" id=\"profitez-de-loffre-spciale-\">Profitez de l\u2019offre sp\u00e9ciale !<\/h2>\n    <p style=\"color: #e74c3c; font-size: 1.2em; margin: 10px 0;\">Obtenez notre cours pour seulement <strong id=\"price\">29.5\u20ac<\/strong> au lieu de <del>59\u20ac<\/del> !<\/p>\n    <a href=\"https:\/\/wikiform.fr\/application\/learnify\/home\/course\/javascript-les-fondamentaux\/142\" target=\"_blank\" style=\"display: block; padding: 10px 20px; background-color: #701CF5; color: #fff; text-decoration: none; border-radius: 5px; font-weight: bold; font-size: 1em; margin: 20px auto;\" rel=\"noopener\">Commencer maintenant<\/a>\n    <button onclick=\"closePopup()\" style=\"padding: 10px 20px; font-size: 1em;\">Fermer<\/button>\n  <\/div>\n\n  <!-- Popup Mobile -->\n  <div id=\"popupContainerMobile\" class=\"mobile-popup\" style=\"display: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 80%; max-width: 300px; padding: 15px; border-radius: 10px; text-align: center; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); background-color: rgba(255, 255, 255, 0.95); box-sizing: border-box;\">\n    <p style=\"color: #e74c3c; font-size: 1em; margin: 5px 0;\">Cours sp\u00e9cial \u00e0 <strong id=\"priceMobile\">29.5\u20ac<\/strong> au lieu de <del>59\u20ac<\/del> !<\/p>\n    <a href=\"https:\/\/wikiform.fr\/application\/learnify\/home\/course\/javascript-les-fondamentaux\/142\" target=\"_blank\" style=\"display: inline-block; padding: 8px 15px; background-color: #701CF5; color: #fff; text-decoration: none; border-radius: 5px; font-weight: bold; font-size: 0.9em;\" rel=\"noopener\">Commencer maintenant<\/a>\n    <button onclick=\"closePopup()\" style=\"padding: 5px 10px; font-size: 0.9em;\">Fermer<\/button>\n  <\/div>\n<\/div>\n\n<script src=\"https:\/\/player.vimeo.com\/api\/player.js\"><\/script>\n<script>\ndocument.addEventListener('DOMContentLoaded', function() {\n    var iframe = document.getElementById('vimeoPlayer');\n    var player = new Vimeo.Player(iframe);\n    var isPopupDisplayed = false;\n\n    player.on('play', function() {\n        if (!isPopupDisplayed) {\n            player.on('timeupdate', function(data) {\n                if (data.seconds >= 120 && !isPopupDisplayed) { \/\/ 120 seconds = 2 minutes\n                    \/\/ Pause the video and display the popup\n                    player.pause().then(function() {\n                        if (window.innerWidth > 768) {\n                            document.querySelector('.desktop-popup').style.display = 'block';\n                        } else {\n                            document.querySelector('.mobile-popup').style.display = 'block';\n                        }\n                        fetchPriceAndUpdatePopup();\n                        isPopupDisplayed = true;\n                    });\n                }\n            });\n        }\n    });\n\n    function fetchPriceAndUpdatePopup() {\n        fetch('https:\/\/wikiform.fr\/application\/learnify\/home\/course\/devenir-un-d%C3%A9veloppeur-python\/144')\n            .then(response => response.text())\n            .then(html => {\n                var parser = new DOMParser();\n                var fetchedDoc = parser.parseFromString(html, 'text\/html');\n                var priceElement = fetchedDoc.querySelector('.ammount .fw-500');\n                var originalPriceElement = fetchedDoc.querySelector('.ammount del');\n                var price = priceElement ? priceElement.textContent.trim() : '29.5\u20ac';\n                var originalPrice = originalPriceElement ? originalPriceElement.textContent.trim() : '59\u20ac';\n\n                document.getElementById('price').textContent = price;\n                document.getElementById('priceMobile').textContent = price;\n                document.querySelector('.desktop-popup del').textContent = originalPrice;\n                document.querySelector('.mobile-popup del').textContent = originalPrice;\n            })\n            .catch(error => console.error('Error fetching the price:', error));\n    }\n\n    function closePopup() {\n        document.querySelector('.desktop-popup').style.display = 'none';\n        document.querySelector('.mobile-popup').style.display = 'none';\n        player.play(); \/\/ Allows resuming the video only after closing the popup\n    }\n});\n<\/script>\n\n\n\n<p>Les op\u00e9rateurs logiques en JavaScript sont utilis\u00e9s pour v\u00e9rifier plusieurs conditions en m\u00eame temps. L&rsquo;op\u00e9rateur <code>AND (&&)<\/code> v\u00e9rifie si toutes les conditions sont vraies, tandis que l&rsquo;op\u00e9rateur <code>OR (||)<\/code> v\u00e9rifie si au moins une condition est vraie. Comprendre et utiliser ces op\u00e9rateurs permet de concevoir des scripts plus pr\u00e9cis et adapt\u00e9s \u00e0 diverses situations.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Utiliser l&rsquo;Op\u00e9rateur <strong>AND (&#038;&#038;)<\/strong> pour V\u00e9rifier Plusieurs Conditions<\/h3>\n\n\n\n<p>L&rsquo;op\u00e9rateur <code>AND<\/code> permet de v\u00e9rifier que toutes les conditions sp\u00e9cifi\u00e9es sont vraies avant de continuer l&rsquo;ex\u00e9cution du script. Voici un exemple simple pour en comprendre l&rsquo;utilisation :<\/p>\n\n\n\n<pre class=\"wp-block-code lang-javascript\"><code>const age = 25;\nconst hasDrivingLicense = true;\n\nif (age >= 18 && hasDrivingLicense) {\n    console.log('Vous pouvez conduire.');\n} else {\n    console.log('Vous ne pouvez pas conduire.');\n}\n<\/code><\/pre>\n\n\n\n<p>Dans cet exemple, la condition est vraie si la personne a au moins 18 ans et poss\u00e8de un permis de conduire. Si l&rsquo;une des conditions n&rsquo;est pas remplie, l&rsquo;autre bloque l&rsquo;ex\u00e9cution de la condition enti\u00e8re.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Utiliser l&rsquo;Op\u00e9rateur <strong>OR (||)<\/strong> pour V\u00e9rifier Plusieurs Conditions<\/h3>\n\n\n\n<p>L&rsquo;op\u00e9rateur <code>OR<\/code> permet de v\u00e9rifier que l&rsquo;une des conditions sp\u00e9cifi\u00e9es est vraie. Voici un exemple pratique :<\/p>\n\n\n\n<pre class=\"wp-block-code lang-javascript\"><code>const isWeekend = true;\nconst isVacation = false;\n\nif (isWeekend || isVacation) {\n    console.log('Je peux me d\u00e9tendre aujourd\\'hui.');\n} else {\n    console.log('Je dois travailler aujourd\\'hui.');\n}\n<\/code><\/pre>\n\n\n\n<p>Dans cet exemple, si c&rsquo;est le week-end ou si la personne est en vacances, elle peut se d\u00e9tendre. Il suffit qu&rsquo;une des deux conditions soit vraie pour que l&rsquo;ensemble de la condition soit valide.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Combiner les Op\u00e9rateurs <strong>AND (&#038;&#038;)<\/strong> et <strong>OR (||)<\/strong> pour des Conditions Complexes<\/h3>\n\n\n\n<p>Il est souvent n\u00e9cessaire de combiner les op\u00e9rateurs <code>AND<\/code> et <code>OR<\/code> pour contr\u00f4ler le flux de votre programme de mani\u00e8re plus complexe. Voici comment vous pouvez le faire :<\/p>\n\n\n\n<pre class=\"wp-block-code lang-javascript\"><code>const age = 20;\nconst hasParentalConsent = false;\nconst hasJob = true;\n\nif ((age >= 18 && hasJob) || hasParentalConsent) {\n    console.log('Vous pouvez participer au programme.');\n} else {\n    console.log('Vous ne pouvez pas participer au programme.');\n}\n<\/code><\/pre>\n\n\n\n<p>Dans cet exemple, une personne peut participer au programme si elle a au moins 18 ans et un emploi, ou si elle a le consentement parental. Cela montre comment combiner les op\u00e9rateurs pour v\u00e9rifier des conditions imbriqu\u00e9es.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Utiliser les Conditions dans des Boucles<\/h3>\n\n\n\n<p>Les op\u00e9rateurs logiques sont particuli\u00e8rement utiles dans les boucles. Par exemple, voyons comment les utiliser dans une boucle <code>for<\/code> pour trouver des nombres pairs ou multiples de 5 :<\/p>\n\n\n\n<pre class=\"wp-block-code lang-javascript\"><code>for (let i = 1; i <= 20; i++) {\n    if (i % 2 === 0 || i % 5 === 0) {\n        console.log(i, 'est pair ou multiple de 5');\n    }\n}\n<\/code><\/pre>\n\n\n\n<p>Ici, la boucle parcourt les nombres de 1 \u00e0 20 et affiche ceux qui sont pairs ou multiples de 5. Cela montre l'efficacit\u00e9 des op\u00e9rateurs <code>OR (||)<\/code> dans les it\u00e9rations.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">V\u00e9rifier des Conditions dans les Fonctions<\/h3>\n\n\n\n<p>Les conditions logiques peuvent \u00e9galement \u00eatre utilis\u00e9es dans des fonctions pour renvoyer des valeurs ou ex\u00e9cuter des actions sp\u00e9cifiques. Par exemple :<\/p>\n\n\n\n<pre class=\"wp-block-code lang-javascript\"><code>function canVote(age) {\n    if (age >= 18) {\n        return 'Vous pouvez voter.';\n    } else {\n        return 'Vous ne pouvez pas voter.';\n    }\n}\n\nconsole.log(canVote(20));\nconsole.log(canVote(16));\n<\/code><\/pre>\n\n\n\n<p>Dans cette fonction, nous v\u00e9rifions simplement si la personne a 18 ans ou plus pour d\u00e9terminer si elle peut voter.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Conclusion<\/h2>\n\n\n\n<p>Les <strong>op\u00e9rateurs logiques OR\/AND en JavaScript<\/strong> sont des outils puissants pour contr\u00f4ler le flux de votre code. Que vous travailliez avec des conditions simples ou complexes, ils vous permettent de v\u00e9rifier plusieurs situations de mani\u00e8re efficace. Continuez \u00e0 exp\u00e9rimenter avec ces op\u00e9rateurs pour voir comment ils peuvent simplifier et am\u00e9liorer vos scripts. Pour en savoir plus sur JavaScript, consultez notre <a href=\"https:\/\/wikiform.fr\/application\/learnify\/home\/course\/javascript-les-fondamentaux\/142\">cours sur les fondamentaux de JavaScript<\/a>.<\/p>\n\n\n\n<a href=\"https:\/\/wikiform.fr\/application\/learnify\/home\/course\/javascript-les-fondamentaux\/142\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"https:\/\/wikiform.fr\/codespace\/wp-content\/uploads\/2024\/07\/learnify-formation-JAVASCRIPT-offre-50.gif\" loading=\"lazy\" alt=\"Learnify Formation JavaScript Offre 50%\" title=\"\"><\/a>\n\n\n\n<h2>Comprendre l'Utilisation des <a href=\"https:\/\/wikiform.fr\/codespace\/qu-est-ce-que-javascript-explications-definition\" target=\"_blank\" rel=\"noopener\">Conditions OR AND JavaScript<\/a><\/h2>\n<p>Lors de l'apprentissage des bases de JavaScript, il est essentiel de comprendre comment v\u00e9rifier plusieurs conditions en utilisant les op\u00e9rateurs <strong>OR<\/strong> et <strong>AND<\/strong>. Dans ce contexte, nous allons explorer plusieurs situations o\u00f9 ces op\u00e9rateurs peuvent \u00eatre combin\u00e9s<\/p>\n\n<h3>Alternance Entre Operateurs Logiques<\/h3>\n<p>Utiliser l'alternance entre les op\u00e9rateurs <code>AND<\/code> et <code>OR<\/code> dans une m\u00eame condition peut sembler complexe, mais avec de la pratique, cela devient intuitif. Par exemple, consid\u00e9rons une situation o\u00f9 une personne doit remplir au moins une de plusieurs exigences pour passer une v\u00e9rification :<\/p>\n\n\n<pre class=\"wp-block-code lang-javascript\"><code>const isCitizen = true;\nconst hasPassport = true;\nconst hasVisa = false;\n\nif ((isCitizen && hasPassport) || hasVisa) {\n    console.log('Vous \u00eates autoris\u00e9 \u00e0 entrer.');\n} else {\n    console.log('Vous n\u2019\u00eates pas autoris\u00e9 \u00e0 entrer.');\n}\n<\/code><\/pre>\n\n\n<p>Dans cet exemple, une personne peut entrer dans le pays si elle est citoyenne et poss\u00e8de un passeport, ou si elle poss\u00e8de un visa. Ce bloc de code d\u00e9montre comment combiner efficacement les op\u00e9rateurs <code>AND<\/code> et <code>OR<\/code>.<\/p>\n\n<!-- Here, linking to another relevant internal resource -->\n<p>Pour approfondir vos connaissances sur <a href=\"https:\/\/wikiform.fr\/codespace\/qu-est-ce-qu-une-condition-en-javascript\" target=\"_blank\" rel=\"noopener\">les conditions en JavaScript<\/a>, explorez notre guide consacr\u00e9 aux conditions <code>if - else<\/code> en JavaScript.<\/p>\n\n<h3>Les Grands Ensembles de Conditions Avec les Boucles<\/h3>\n<p>Manipuler les conditions logiques dans des boucles peut grandement simplifier vos algorithmes. Prenons un scenario classique :<\/p>\n\n\n<pre class=\"wp-block-code lang-javascript\"><code>const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];\nfor (let i = 0; i < numbers.length; i++) {\n    if (numbers[i] % 2 === 0 || numbers[i] % 3 === 0) {\n        console.log(numbers[i], 'est divisible par 2 ou par 3');\n    }\n}\n<\/code><\/pre>\n\n\n<p>Ce morceau de code it\u00e8re \u00e0 travers un tableau de nombres et v\u00e9rifie si chaque nombre est divisible par 2 ou 3, et affiche les nombres conformes. L'usage des op\u00e9rateurs logiques <code>OR (||)<\/code> dans ce contexte simplifie grandement la logique de la boucle.<\/p>\n\n<!-- Adding another internal link -->\n<p>Apprenez \u00e0 <a href=\"https:\/\/wikiform.fr\/codespace\/concatenation-en-javascript-guide-pratique\" target=\"_blank\" rel=\"noopener\">concat\u00e9ner en JavaScript<\/a> pour combiner plusieurs cha\u00eenes de caract\u00e8res ou donn\u00e9es diversit\u00e9.<\/p>\n\n<h3>Les Applications Pratiques avec des Fonctions<\/h3>\n<p>Utilisons une fonction pratique pour examiner une condition complexe :<\/p>\n\n\n<pre class=\"wp-block-code lang-javascript\"><code>function canAccessWebsite(age, isVerified) {\n    if ((age >= 18 && isVerified) || age >= 21) {\n        return 'Acc\u00e8s autoris\u00e9';\n    } else {\n        return 'Acc\u00e8s refus\u00e9';\n    }\n}\n\nconsole.log(canAccessWebsite(20, true));  \/\/ Acc\u00e8s autoris\u00e9\nconsole.log(canAccessWebsite(20, false)); \/\/ Acc\u00e8s refus\u00e9\nconsole.log(canAccessWebsite(22, false)); \/\/ Acc\u00e8s autoris\u00e9\n<\/code><\/pre>\n\n\n<p>Dans cette fonction, une personne peut acc\u00e9der \u00e0 un site web si elle a au moins 18 ans et a v\u00e9rifi\u00e9 son identit\u00e9, ou si elle a 21 ans ou plus. Cet exemple illustre comment une fonction peut encapsuler et appliquer des conditions logiques complexes.<\/p>\n\n<!-- Link to another internal resource -->\n<p>Pour en savoir plus sur la <a href=\"https:\/\/wikiform.fr\/codespace\/utilisation-du-debogueur-en-javascript\" target=\"_blank\" rel=\"noopener\">utilisation du d\u00e9bogueur en JavaScript<\/a>, suivez notre tutoriel complet.<\/p>\n\n<!-- Adding an external link for SEO improvement -->\n<p>Pour mieux ma\u00eetriser les concepts de <a href=\"https:\/\/developer.mozilla","protected":false},"excerpt":{"rendered":"<p>V\u00e9rifier Plusieurs Conditions en JavaScript (OR\/AND) est une comp\u00e9tence essentielle qui permet de cr\u00e9er des scripts plus robustes et dynamiques. En utilisant les op\u00e9rateurs logiques&#8230;<\/p>\n","protected":false},"author":3,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[9],"tags":[18],"class_list":["post-5572","post","type-post","status-publish","format-standard","hentry","category-4-javascript","tag-tutoriels"],"acf":[],"_titre_de_la_formation":null,"_description_":null,"_objectifs_pedagogiques":null,"_programme_":null,"_url_de_limage":null,"_materiel_necessaire":null,"_modalites_devaluation_des_acquis":null,"_moyens_pedagogiques_et_techniques":null,"_accessibilite_":null,"_formateur_":null,"menu_order":0,"_links":{"self":[{"href":"https:\/\/wikiform.fr\/codespace\/wp-json\/wp\/v2\/posts\/5572","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wikiform.fr\/codespace\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wikiform.fr\/codespace\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wikiform.fr\/codespace\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/wikiform.fr\/codespace\/wp-json\/wp\/v2\/comments?post=5572"}],"version-history":[{"count":1,"href":"https:\/\/wikiform.fr\/codespace\/wp-json\/wp\/v2\/posts\/5572\/revisions"}],"predecessor-version":[{"id":5573,"href":"https:\/\/wikiform.fr\/codespace\/wp-json\/wp\/v2\/posts\/5572\/revisions\/5573"}],"wp:attachment":[{"href":"https:\/\/wikiform.fr\/codespace\/wp-json\/wp\/v2\/media?parent=5572"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wikiform.fr\/codespace\/wp-json\/wp\/v2\/categories?post=5572"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wikiform.fr\/codespace\/wp-json\/wp\/v2\/tags?post=5572"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}