美文网首页
js基础之数据类型,运算,流程控制

js基础之数据类型,运算,流程控制

作者: 蘭小木 | 来源:发表于2020-01-16 02:00 被阅读0次

编写位置

写在标签的指定属性中

<button onclick="alert('你点我干嘛~~~~');">点我一下</button>
<a href="javascript:alert('讨厌!!!');">你也点我一下</a>

写在script标签中

<script type="text/javascript">
        alert("我是内部的JS代码");
</script>

在js文件中编写引入

<script type="text/javascript" src="js/script.js"></script>

基本语法

1.在JS中严格区分大小写
2.JS中的每个语句以;结尾
   - 如果不写分号,浏览器会根据上下文自动添加分号
但是浏览器加分号会影响一些性能,而且有些情况它会给你加错了
   - 所以我们必须在每个语句的结尾加上分号
3.JS中会忽略多个空格和换行,所以我们可以利用空格和换行对代码进行格式  

标识符

标识符的规范  
1.标识符中可以含有字母、数字 、 _、$,但是不能以数字开头
2.标识符不能是ES标准中的关键字和保留字
3.标识符命名时需要使用驼峰命名法
- 首字母小写,每个单词开头的字母大写
helloworld
xxxYyyZzz
backgroundColor
borderTopWidth
4.在JS底层保存标识符时,实际上都是使用的Unicode编码进行保存的理论上讲只要在Unicode编码中的字符都可以作为标识符

数据类型

String

js中字符串可以使用双引号或单引号

  • 转义字符

打印一些特殊字符时,可以使用\来作为转义字符

\" 表示"
\' 表示'
\\ 表示\
\t 表示制表符
\n 表示换行
\uxxxx 表示一个Unicode编码

Number

  • 如果我们使用的数字超过了最大值,则会返回Infinity,表示无穷±Infinity 正负无穷,它的类型也是Number
NaN (Not A Number)
  • 用来表示一个非法的数字
  • 使用typeof检查一个NaN时,也会返回number

Boolean

Null

  • Null类型只有一个值,就是null
  • null值专门用来表示为空的对象
  • 使用typeof检查一个Null类型的值时,会返回object

Undifined

  • Undefined表示一个声明但是没有赋值的变量
  • Undefined的类型只有一个值 undefined
  • 使用typeof检查一个Undefined类型的数据时,会返回undefined

Object

检测数据类型

typeof 变量
typeof 100

数据类型转换

转换为String类型

方式一:
- 调用被转换数据类型的toString()方法
- toString()方法不会改变原变量的值,而是将值转换为字符串并返回
- 由于null和undefined中没有toString()方法,所以不能调用toString()将他们转换为字符串

- 对于数字来说,toString()方法,除了可以将一个数字转换为字符串以外,它还可以将一个数字
  转换为指定进制的字符串在数值的toString()方法中,可以传递一个进制的整数作为参数,这样
  数值将会被转换为指定进制的数字的字符串
    a = a.toString(16);
方式二 
- 调用String()函数
  String(100);
- 将被转换的数据做为参数传递给String()
- 原理:
- 对于具有toString()方法的类型来说,String()会调用它们的toString()方法来将其转换为字符串
- 对于null和undefined来说,
  会将null 直接转换为 "null"
  将undefined 直接转换为 "undefined"

转换为Number类型

方法一
    Number()
    Number("100aaa");
    如果字符串是一个合法的数字,则将其转换为对应的数字   
    如果字符串不是一个合法的数字,则转换为NaN                          
    如果字符串是一个空串或纯空格的字符串,则转换为0
    +"100"  
    - true转换为1                  
    - false转换为0
    - null转换为0
    - undefined转换为NaN
方法二
    parseInt()
    - 将一个字符串转换为整数
    使用该函数解析字符串时,它会从字符串的左侧开始解析,直到解析到最后一个有效的整数位
    - 在使用parseInt时,可以传递以进制作为参数,来说明数字的进制
    c = parseInt(c,10);

    parsFloat()
    parseFloat()和parseInt()类似
    不同的是它可以解析到有效的小数位

转换为Boolean类型

Boolean()
null,undefined,空串,0,NaN是false,其他都是true

运算符

+

  • 当对非数字(除了字符串)进行加法运算时,它会将其先转换为数字,然后再运算
  • 任何值和字符串进行加法运算时,都会先将其转换为字符串,然后在和字符串进行拼串的操作
  • 任何值和NaN做任何运算都是NaN(NaN和字符串相加会把NaN转换为字符串)
  • 字符串拼接
  • 数值运算

-

  • 对非数字类型进行运算时,会先将其转换为数字然后在运算
  • 我们还可以通过为一个任意的数据类型 -0 *1 /1 来将其转换为Number类型原理和Number()函数一样。

* / %

  • 同 - 一样

一元运算符

一元的+
一元+就相当于数学运算中的 正号
一元+不会对一个数值产生任何变化
一元的-
一元-相当于数学运算中的 负号
- 负号可以对一个数值进行符号位取反

如果对非数值进行一元的+或-运算,它会向将其转换为number,然后在运算我们可以利用这一特点来将任意的数据类型 转换为Number

自增/自减

++a/a++
a++的值是变量自增前的值(变量原值)
++a的值是变量自增后的值(变量新值)
--a/a--
a-- 的值变量自减前的值(变量的原值)
--a 的值是变量自减后的值(变量的新值)

逻辑运算符

布尔值的逻辑运算
||
如果第一个值为true,则返回第一个,如果第一个值为false,则返回第二个
对于非布尔值,做与或运算时,它会先将其转换为布尔值,然后在运算最终返回变量的原值
&&
如果第一个值为true,则返回第二个,如果第一个值为false,则返回第一个。

赋值运算符

+= -= *= /= %=

比较运算符

>= <= > <
对非数值类型进行关系运算,则会将他们转换为Number然后在比较

当关系运算符的两侧都是字符串时,它不会将字符串转换为Number,而是会逐位比较字符串的Unicode编码
通过这种方式,可以将文本按照字母顺序进排序(只限英文)

相等运算符

==
对两个类型不同的变量进行相等比较,会先将其转换为相同的类型,然后再比较
(至于具体转换为什么类型,不定,但是大部分情况是转换Number)
===
全等和相等的区别就是相等会做自动的类型转换,而全等不会,
使用全等时,如果两个值的类型不同,直接返回false
!=
!==
isNan()
判断一个值是否是NaN 

三元运算符

条件表达式?语句1:语句2;
var result = 1==2?"对了":"错了";

运算符优先级

流程控制语句

if

if(条件表达式) {
    语句...
}

if..else if...else

switch switch 判断是全等(相当于===)

switch(条件表达式){
case 表达式:
语句...
break;
....
default:
语句...
break;
}
  • 如果全等则会执行当前case后的所有语句,可以在case的最后添加一个break关键字,来避免其他的case执行
  • 如果不全等,则继续向下比较,直到找到全等的case为止,
  • 如果所有的case都不符合要求,则执行default后的语句

while(语句

while(条件表达式){
* 语句...
* }

do...while语句

do{
语句...
}while(条件表达式)

for循环

for(①初始化表达式;②条件表达式;④更新表达式){
③语句...
}

死循环

for(;;){
alert("hello");
}

嵌套for循环


break / continue

break 结束当前循环

可以为循环指定一个label来标识循环,使用break时,可以通过这个label来指定要结束的循环

hello:
for(var i=0 ; i<5 ; i++){
console.log("外层循环:"+i);     
    for(var j=0 ; j<5 ; j++){
        console.log("----->内层循环:"+j)        
        if(j == 2){
        break hello;
        }
    }
}

continue可以用来跳过本次循环

return

可以通过return来设置函数的返回值

语法:return 值;return后的代码不会执行(结束当前方法)
函数的返回值可以是任意的数据类型
如果return后不写值或者不写return,则相当于 return undefined;   

相关文章

  • JS语法

    JavaScript基本概念、基础数据类型、运算符、流程控制语句。 一、CSS和JS在网页中的放置顺序是怎样的? ...

  • 关于Javascript语法

    * 这是关于JavaScript基本概念、基础数据类型、运算符、流程控制语句的一些小知识 * 1.CSS和JS在网...

  • 16.JS 语法

    学习内容:JavaScript基本概念,基础数据类型,运算符,流程控制语句 一、CSS和JS在网页中的放置顺序是怎...

  • 4/07day28_js基础

    day28_js基础 回顾 JS基础语法 JS运算符 JS流程控制语句 条件语句 JS的条件语句和Java语法基本...

  • js基础之数据类型,运算,流程控制

    编写位置 写在标签的指定属性中 写在script标签中 在js文件中编写引入 基本语法 标识符 数据类型 Stri...

  • web前端入门到实战:js函数与作用域,了解函数基本概念

    通过js基础语法了解到js的值包含数字,字符串和布尔值;js运算符分为算数,赋值,比较和逻辑运算符;js的流程控制...

  • js运算符

    js基础语法:运算符,判断语句,数据类型,js对象 一、运算符 赋值运算符 =算数运算符 +-*/% ++...

  • JavaScript基础总结

    ✍目录总览:(JS概念与组成、JS格式规范、JS基本语法【输入、输出、变量、数据类型、数据类型转换、运算符、流程控...

  • java基础大纲

    一、java基础 基础语法(数据类型,变量定义,关键字,运算符,流程控制)类与继承(如何定义类,如何实现继承类,如...

  • 【Flutter 极速指南】Dart 语言篇

    这篇文章你能学习到: 安装 Hello world 基础语法基本规则关键词变量数据类型 函数 运算 流程控制 类&...

网友评论

      本文标题:js基础之数据类型,运算,流程控制

      本文链接:https://www.haomeiwen.com/subject/hugxzctx.html