js基础

基本数据类型(原始数据类型)

  1. 数值类型(number)
    • 一切数字都是数值类型(包括二进制,十进制,十六进制等)
    • NaN(not a number),一个非数字
  2. 字符串类型(string)
    • 被引号包裹的所有内容(可以是单引号也可以是双引号)
  3. 布尔类型(boolean)
    • 只有两个(true 或者 false
  4. null类型(null)
    • 只有一个,就是 null,表示空的意思
  5. undefined类型(undefined)
    • 只有一个,就是 undefined,表示没有值的意思

复杂数据类型(暂时先不讲)

  1. 对象类型(object)
  2. 函数类型(function)
  3. 。。。

判断数据类型

  • 既然已经把数据分开了类型,那么我们就要知道我们存储的数据是一个什么类型的数据
  • 使用 typeof 关键字来进行判断
// 第一种使用方式
var n1 = 100;
console.log(typeof n1);//number 

// 第二种使用方式
var s1 = 'abcdefg';
console.log(typeof(s1));//string

判断一个变量是不是数字

  • 可以使用 isNaN 这个方法来判断一个变量是不是数字
  • isNaNis not a number
// 如果变量是一个数字
var n1 = 100;
console.log(isNaN(n1)); //=> false

// 如果变量不是一个数字
var s1 = 'Jack'
console.log(isNaN(s1)); //=> true

数据类型转换

  • 数据类型之间的转换,比如数字转成字符串,字符串转成布尔,布尔转成数字等

其他数据类型转成数值

  1. Number(变量)
  • 可以把一个变量强制转换(显示转换)成数值类型
    • 可以转换小数,会保留小数
    • 可以转换布尔值
    • 遇到不可转换的都会返回 NaN(出现字母)
  1. parseInt(变量)
  • 从第一位开始检查,是数字就转换,直到一个不是数字的内容
    • 开头就不是数字,那么直接返回 NaN
    • 不认识小数点,只能保留整数
  1. parseFloat(变量)
  • 从第一位开始检查,是数字就转换,直到一个不是数字的内容
  • 开头就不是数字,那么直接返回 NaN
  • 认识一次小数点
  1. 除了加法以外的数学运算
    • 运算符两边都是可运算数字才行
    • 如果运算符任何一遍不是一个可运算数字,那么就会返回 NaN
    • 加法不可以用

其他数据类型转成字符串

  1. 变量.toString()
    • 有一些数据类型不能使用 toString() 方法,比如 undefinednull
  2. String(变量)
    • 所有数据类型都可以
  3. 使用加法运算
    • 在 JS 里面,+ 由两个含义
    • 字符串拼接: 只要 + 任意一边是字符串,就会进行字符串拼接
    • 加法运算:只有 + 两边都是数字的时候,才会进行数学运算

其他数据类型转成布尔

  1. Boolean(变量)
    • 在 js 中,只有 ''0nullundefinedNaN,这些是 false,其余都是 true

运算符

  • 就是在代码里面进行运算的时候使用的符号,不光只是数学运算,我们在 js 里面还有很多的运算方式

数学运算符

  1. +
  • 只有符号两边都是数字的时候才会进行加法运算
    • 只要符号任意一边是字符串类型,就会进行字符串拼接
  1. -
  • 会执行减法运算
  • 会自动把两边都转换成数字进行运算
  1. *
  • 会执行乘法运算
    • 会自动把两边都转换成数字进行运算
  1. /
  • 会执行除法运算
    • 会自动把两边都转换成数字进行运算
  1. %
  • 会执行取余运算
    • 会自动把两边都转换成数字进行运算

赋值运算符

  1. =

    • 就是把 = 右边的赋值给等号左边的变量名
    • var num = 100
    • 就是把 100 赋值给 num 变量
    • 那么 num 变量的值就是 100
  2. +=

    var a = 10;
    a += 10;
    console.log(a); //=> 20
    
    • a += 10 等价于 a = a + 10
  3. -=

    var a = 10;
    a -= 10;
    console.log(a); //=> 0
    
    • a -= 10 等价于 a = a - 10
  4. *=

    var a = 10;
    a *= 10;
    console.log(a); //=> 100
    
    • a *= 10 等价于 a = a * 10
  5. /+

    var a = 10;
    a /= 10;
    console.log(a); //=> 1
    
    • a /= 10 等价于 a = a / 10
  6. %=

    var a = 10;
    a %= 10;
    console.log(a); //=> 0
    
    • a %= 10 等价于 a = a % 10

比较运算符

  1. ==
    • 比较符号两边的值是否相等,不管数据类型
    • 1 == '1'
    • 两个的值是一样的,所以得到 true
  2. ===
    • 比较符号两边的值和数据类型是否都相等
    • 1 === '1'
    • 两个值虽然一样,但是因为数据类型不一样,所以得到 false
  3. !=
    • 比较符号两边的值是否不等
    • 1 != '1'
    • 因为两边的值是相等的,所以比较他们不等的时候得到 false
  4. !==
    • 比较符号两边的数据类型和值是否不等
    • 1 !== '1'
    • 因为两边的数据类型确实不一样,所以得到 true
  5. >=
    • 比较左边的值是否 大于或等于 右边的值
    • 1 >= 1 结果是 true
    • 1 >= 0 结果是 true
    • 1 >= 2 结果是 false
  6. <=
    • 比较左边的值是否 小于或等于 右边的值
    • 1 <= 2 结果是 true
    • 1 <= 1 结果是 true
    • 1 <= 0 结果是 false
  7. >
    • 比较左边的值是否 大于 右边的值
    • 1 > 0 结果是 true
    • 1 > 1 结果是 false
    • 1 > 2 结果是 false
  8. <
    • 比较左边的值是否 小于 右边的值
    • 1 < 2 结果是 true
    • 1 < 1 结果是 false
    • 1 < 0 结果是 false

逻辑运算符

  1. &&
    • 进行 且 的运算
    • 符号左边必须为 true 并且右边也是 true,才会返回 true
    • 只要有一边不是 true,那么就会返回 false
    • true && true 结果是 true
    • true && false 结果是 false
    • false && true 结果是 false
    • false && false 结果是 false
  2. ||
    • 进行 或 的运算
    • 符号的左边为 true 或者右边为 true,都会返回 true
    • 只有两边都是 false 的时候才会返回 false
    • true || true 结果是 true
    • true || false 结果是 true
    • false || true 结果是 true
    • false || false 结果是 false
  3. !
    • 进行 取反 运算
    • 本身是 true 的,会变成 false
    • 本身是 false 的,会变成 true
    • !true 结果是 false
    • !false 结果是 true
已标记关键词 清除标记
相关推荐
<p style="color:#666666;"> JavaScript是一种网页交互语言,为网页增添了巨大的表现力和交互能力,极大提高了用户体验,如今很难在找到不使用JavaScript的网站了。本课程主要是为刚刚接触JavaScript的朋友准备,详细的讲解了JavaScript的基本语法,以及事件的处理操作。 </p> <p style="color:#666666;"> <br /></p> <p style="color:#666666;"> 本季课程为JavaScript基础语法篇,着重介绍了JavaScript脚本语言的基础语法部分<br /> 内容包含:<br /> ◆ 认识JavaScript脚本语言、发展史、编译工具<br /> ◆ JavaScript中的变量、数据类型、类型转换<br /> ◆ 条件选择(if--else, if--else if ,switch--case)<br /> ◆ 循环(while循环, do--while循环, for循环,循环嵌套 )<br /> ◆ 集合(Array基础常见操作、案例演示)<br /> ◆ set集合、map集合(集合的遍历、集合常用的方法)<br /> ◆ 课后习题 </p> <p style="color:#666666;"> <br /></p> <p style="color:#666666;"> 在本季课程的讲解部分结合了大量的案例演示,通过案例演示可以清楚的加深对JavaScript基本语言的理解; 建议在学习的过程中,一定要动手实战,这样才能真正的领悟到JavaScript的语法细节。 </p> <p style="color:#666666;"> <br /></p> <p style="color:#666666;"> <span style="color:#FF0000;"><strong>课程案例展示:</strong></span> </p> <p style="color:#666666;"> <br /></p> <p style="color:#666666;"> <strong><span style="color:#FF0000;">案例01:计算器</span></strong> </p> <p style="color:#666666;"> <img src="http://pic3.ablesky.cn/content/pic/communitythreadphoto/2019/07/20/17e34119-11b3-43b0-8dcf-d9cea3e86a84.gif" alt="" /></p> <p style="color:#666666;"> <span style="color:#FF0000;"><strong>案例02:生成学生成绩</strong></span> </p> <p style="color:#666666;"> <img src="http://pic4.ablesky.cn/content/pic/communitythreadphoto/2019/07/20/cf6e14dc-e492-417b-ae7a-7f463191ddeb.gif" alt="" /></p> <p style="color:#666666;"> <br /></p> <p style="color:#666666;"> <span style="color:#FF0000;"><strong>案例03:下拉菜单的联动</strong></span><img src="http://pic5.ablesky.cn/content/pic/communitythreadphoto/2019/07/20/d56761d2-2670-4ef4-8268-8c42bf4212d8.gif" alt="" /></p> <p style="color:#666666;"> <span style="color:#FF0000;"><strong>案例04:首页大图轮番</strong></span> </p> <p style="color:#666666;"> <img src="http://pic3.ablesky.cn/content/pic/communitythreadphoto/2019/07/20/8ba2ec2a-f482-45af-be4b-856433152a5d.gif" alt="" /></p> <p style="color:#666666;"> <img src="http://pic4.ablesky.cn/content/pic/communitythreadphoto/2019/07/21/fbc09717-d2fb-455b-8be5-a40334c09e4b.png" alt="" /></p>
©️2020 CSDN 皮肤主题: 1024 设计师:白松林 返回首页