爱创课堂 北京前端培训 js基础教程之三元运算符

爱创课堂前端教程js基础复习 arguments复习字符串方法：slice(start,end)截取区间字符串。

split()字符串切割父字符串返回值是数组。

substr(start,howmany)截取一定数目的字符串。

substring(start,end)自行判断数值大小，包括小的不包括大的。

不能使用负值。

match()匹配，返回数组。

通常使用全局匹配。

search()。

查找返回值匹配的索引值。

只能够返回第一次出现的位置。

charAt()返回指定索引值的字符。

indexOf()第一次出现的索引值。

toUpperCase()转换为大写。

toLowerCase()转换为小写。

concat()返回的新字符串。

replace()。

替换正则的方法:exec()查找。

test()检测。

返回值true或者false一、argumentsarguments是一个类数组对象。

后台其他的语言都有一种函数重载现象。

就是函数名相同，但是传递的参数不同。

属于不同的函数。

js没有重载现象。

js中函数名相同，传递的参数不同时，后面的会覆盖掉前边的。

1 function fun(a,b){2 console.log(1);3 }4 function fun(a,b,c){5 console.log(2);6 }7 fun(1,2);当函数执行时，传递的实际参数会存入到arguments这个类数组对象中。

arguments可以通过下标获取任意一项。

sum(1,2,3,4,5,6,7)1 console.log(arguments[0]);2 console.log(arguments[1]);3 console.log(arguments[2]);4 console.log(arguments[3]);5 console.log(arguments[4]);6 console.log(arguments[5]);7 console.log(arguments[6]);8 console.log(arguments[7]);9 console.log(arguments[8]);10 console.log(arguments[9]);arguments还可以通过下标进行赋值1 console.log(arguments[8] = 100);还可以通过遍历得到所有项。

JavaScript三元运算符JavaScript三元运算符的多种使⽤技巧发现代码慢慢写多了的时候会不⾃觉的将if else ⽤三元来替代，仅仅是未了让代码更简洁精辟，当然也有⼈说⽤三元可以让你有⾼潮的感觉。

最近在写js 的时候也有这样的感觉，并且收集了⼀些⼩技巧，分享分享。

⼤鸟请跳过下⾯这段，⼤⼤鸟帮忙指正 ^__^====普及线====表达式 (expr1) ? (expr2) : (expr3)在 expr1 求值为 TRUE 时的值为 expr2，在 expr1 求值为 FALSE 时的值为 expr3。

============普通⽤法当你发现你经常⽤if else代码如下:if(拜春哥 || 拜考试帝){不挂科;}else{门门挂;}那么三元的表⽰法就是代码如下:拜春哥 || 拜考试帝 ? 不挂科 : 门门挂很帅⽓的发现代码精辟了好多。

⽇常中经常会有这样的 if else 判断，特别是嵌套⽐较多的时候⽤三元是⽐较和谐的，可以让你的代码看起来更加清爽，结构清晰。

稍微聪明点的⽤法通过不断的变化，可以衍⽣出很多三元的⽤法。

如下⼀段jquery代码代码如下:flag ? $('body').addClass('hover') : $('body').removeClass('hover') ;甚⾄更变态些的。

代码如下:$('.item')[ flag ? 'addClass' : 'removeClass']('hover')上⾯的代码看着⽐较困惑。

因为当flag = true 的时候，代码就变成以下代码：代码如下:$('.item')['addClass']('hover')这样写法等同于。

代码如下:$('.item').addClass('hover')再升华⼀下可以根据需要来调⽤⾃⼰想要的function来处理更多的事情。

JavaScript三元运算符以及运算符顺序三⽬运算符（三元运算符）三⽬运算符：运算符需要三个操作语法：表达式1？表达式2：表达式3表达式1是⼀个条件，值为Boolean类型若表达式1的值为true，则执⾏表达式2的操作，并且以表达式2的结果作为整个表达式的结果；若表达式1的值为false，则执⾏表达式3的操作，并且以表达式3的结果作为整个表达式的结果；⽰例：'0'和's'的布尔值都是true，所以返回第⼆个表达式的值 'hello'数字 0的布尔值为false，所以返回第三个表达式的值 'world'案例：数字补0⽤户输⼊数字，如果数字⼩于0，就在前⾯补0，例如01,09，如果数字⼤于10，就不需要补0，例如14 1、⽤户输⼊0~59之间的数字 2、如果数字⼩于10，就在数字前⾯补0，否则不作操作 3、⽤⼀个变量接收返回值并且输出var num = prompt('请输⼊0~59之间的⼀个数字');if(num<10){var zero = '0' + num;alert(zero);}或者是var num = prompt('输⼊数字');num<10?alert('0'+num):alert(num);三元运算符与If...else语句的区别：⼀般来说三元条件表达式与if...else语句有相同的表达效果，前者可以表达的后者同样也可以表达；两者最⼤的不同之处在于：if...else是语句没有返回值，三元表达式有返回值；所以在需要返回值的场合，只能使⽤三元表达式，⽽不能使⽤if...else语句；在下⾯的代码中，console.log()⽅法的参数必须为表达式，所以只能使⽤三元表达式。

实例：（条件运算符的嵌套）输⼊⼀个考试成绩，判断：如果成绩在 80 以上，则输出优秀；如果成绩在 60 以上，则输出合格；否则输出：不合格。

jsdiv三元表达式1.引言1.1 概述概述部分旨在介绍本篇长文的主题：jsdiv三元表达式。

在这一部分中，我们将提供一个简要的概览，为读者提供关于jsdiv三元表达式的基本背景和概念。

首先，我们将解释什么是jsdiv。

jsdiv是一个常用的JavaScript库，它提供了丰富的功能和工具，用于简化和增强JavaScript在web开发中的应用。

其中一个重要的特性是jsdiv中的三元表达式。

接下来，我们将详细介绍什么是三元表达式以及它的用法。

三元表达式是JavaScript中的一种基本语法，它由三个部分组成，分别是一个条件表达式、一个真值表达式和一个假值表达式。

根据条件表达式的结果，三元表达式会返回其中一个值。

这种简单而灵活的语法结构可以在很多情况下代替传统的if-else语句，使代码更加简洁和可读。

在本篇长文的后续部分中，我们将深入探讨三元表达式的定义和用法，并展示它在实际应用中的优势。

我们还将探讨三元表达式的一些常见应用场景和注意事项，以帮助读者更好地理解和运用这个功能。

总结来说，本篇长文将全面介绍jsdiv三元表达式的相关知识，从概述到具体的使用场景和注意事项，希望能够为读者提供一个系统和完整的学习资源。

接下来，让我们开始进入正文部分，深入了解jsdiv三元表达式的奥秘。

1.2 文章结构文章结构是指文章的组织和安排方式，它能够帮助读者更好地理解文章的内容和逻辑关系。

在本文中，文章结构主要包括引言、正文和结论三个部分。

引言部分是文章的开头，通过几句话简要概述文章的主题和要点，引起读者的兴趣，并说明本文的目的和意义。

在本文中，引言部分旨在介绍jsdiv三元表达式的相关概念和背景，引导读者进入正文内容的阅读。

正文部分是文章的主体部分，主要介绍了jsdiv的介绍和三元表达式的定义和用法。

在jsdiv的介绍部分，需要向读者解释jsdiv的概念和特点，包括它是一种什么样的技术、它的作用和优势等。

在三元表达式的定义和用法部分，需要详细阐述三元表达式的含义和语法结构，并举例说明其具体的使用场景和注意事项。

二、流程控制语句我们的js通常执行顺序，是从上到下依次。

但是我们可以使用其他方法控制js的执行顺序。

也就是控制一些语句先执行或者控制一些语句不执行。

常用的是条件分支语句：分类：if语句、三元表达式、switch语句。

2.1 if语句2.1.1 简单的if语句if....else...if：如果else：否则抽象模型：1if(条件表达式){2当条件表达式为真时，执行的结构体。

3}else{4当条件表达式为假时，执行的结构体。

5}结构体：就是多个语句的一个集合。

1var a = parseInt(prompt("请输入您这次考试的成绩"));2if(a >= 90){3alert("恭喜您及格了！！！！");4alert("别骄傲，继续努力");5}else{6alert("虽然没有及格但是下次继续努力");7}if语句可以不写else。

当if条件表达式为假时，直接跳出if语句，执行if语句后的其他语句。

当结构体只有一句js语句时，可以省略大括号（但是不推荐使用）2.1.2 多分支if语句可以写多个else if(只能出现一次if只能出现一次else,可以出现多次else if)。

1if(条件表达式1){2满足表达式1，执行的结构体3}else if(条件表达式2){4不满足表达式1，满足表示式2执行的结构体5}else if(条件表达式3){6不满足表达式1和表达式2，满足表达式3执行的结构体7}else{8都不满足执行的结构体。

9}我们将考试成绩分为了4个档次，一个成绩只能出现一个档次内。

1var a = parseInt(prompt("请输入您这次考试的成绩"));2if(a >= 90){3alert("优秀");4}else if(a >= 80){//不用写 80 <= a < 90 ,含义直接就是不满足第一个条件。

JavaScript三元运算符㈠条件运算符也叫做三元运算符⑴语法：条件表达式？语句1：语句2；⑵执⾏的流程：①条件运算符在执⾏时，⾸先对条件表达式进⾏求值▶如果该值为true，则执⾏语句1，并返回执⾏结果▶如果该值为false，则执⾏语句2，并返回执⾏结果②如果条件的表达式的求值结果是⼀个⾮布尔值；▶会将其转换为布尔值，然后再运算⑶具体⽰例演⽰①演⽰：true?alert("语句1"):alert("语句2");当为true时，返回语句1：②演⽰： false?alert("语句1"):alert("语句2");当为false时，返回语句2：③演⽰：a > b ? alert("a⼤"):alert("b⼤");当b⼤于a时，返回后⾯的语句，b⼤a >b ? alert("a⼤"):alert("b⼤");当a⼤于b时，返回前⾯的语句，a⼤④演⽰：获取a和b中的最⼤值⑤演⽰：获取a b c 中的最⼤值第⼀种⽅法：⽰例第⼆种⽅法：⽰例注：这种⽅法不推荐使⽤，不⽅便阅读⑥演⽰："hello"?alert("语句1"):alert("语句2");结果返回语句1：⑦演⽰： ""?alert("语句1"):alert("语句2");空串时，结果返回语句2：以上就是条件运算符的相关内容，希望有所帮助。

前端入门——JavaScript操作符所谓操作符，就是用来操作数据值的符号，在JavaScript中包括算术操作符、位操作符、关系操作符和相等操作符。

这些操作符可以操作所有类型的数据，比如字符串、数字、布尔值，甚至对象。

一元操作符所谓一元操作符就是只能对一个数据值进行操作，比如（递增、递减）操作符。

递增、递减操作符是直接借鉴C语言的，它分前置型和后置型。

前置就是操作符在要操作的变量之前，后置在变量之后。

如下示例：// 前置型let age = 20;++age; // 递增console.log(age); // 结果输出21--age；//递减console.log(age); // 结果输出20 如上面例子，age通过++操作符递增变成21，又通过--操作符递减变成20；上面的操作等同下面的操作：// 后置型let age = 20;age = age + 1; // 加1age = age -1; // 减1同理使用后置操作符会得到上面同样的结果，但是前置和后置有区别。

前置操作符在语句被求值以前改变，后置是在语句被求值后改变。

通过下面的例子看下其区别：// 前置let age = 20;let anotherAge = --age + 5;alert(age); // 输出19alert(anotherAge); // 输出24由于前置操作符的优先级和执行语句相等，因此会从左到右依次求值。

上面的--age 会先进行递减操作，再继续后面的+ 5 运算，所以结果是24。

// 后置时let age = 20;let anotherAge = age-- + 5;alert(age); // 输出19alert(anotherAge); // 输出25但是后置的最终结果却是25，因为age-- 使用了递减前的值继续和后面进行+5运算。

如果使用一个加号或减号时，加号代表正值、减号代表负值。

加减乘除操作符操作多个数据值，比如加减乘除等：let a = 1,b=2;let c = a + b; // 加let d = c - a; // 减let e = d * b; // 乘let f = e/d; // 除注意加减乘除主要用来操作数字类型的数据，如果操作数不是数字类型，会先进性强制转换再进行计算，这样结果会不确定。