JavaScript能用来做什么?
    页面分为:结构、样式、行为。
 
JavaScript的组成:
    ECMAScript、BOM、DOM
 
    ECMAScript是一个标准,它规定了语法、类型、语句、关键字、保留子、操作符、对象。(相当于法律)
 
 
    BOM(浏览器对象模型):可以访问浏览器窗口的浏览器对象模型,对浏览器窗口进行操作。
 
 
    DOM(文档对象类型):DOM把整个页面映射成一个多层节点结构。HTML页面组成都是某种类型的节点,这些节点又包含着不同类型的数据
 
 

js代码位置

  首先是如何编写JavaScript代码,说到这,我们首先要来说明一个需要新人们关注的点,因为我们的js是一门跨平台的语言,所以说,我们的代码可以运行在不同的平台之上。这也就导致了可能相同的代码放在不同的平台运行就会有所出入。

这里面说的平台其实被称之为宿主环境

  同时,代码在不同的平台上的运行方式也有所不同。

  如果运行在服务端,那么更多的时候我们需要通过命令行的形式去运行,而如果是代码运行在客户端,则需要通过启动浏览器来运行代码。

  我们在学习的初期建议是在浏览器中运行代码,减少学习成本。

  首先,我们的js代码可以写在script标签内部并且将script标签放在网页的任何位置。

  

 外联JS的写法为:
        <script src="相对路径"></script>
        这是一条html语句,原则上可以放在html页面的任意位置,不用和link标签一样非得放在head部分
        相对路径链接的是JavaScript文件,文件的扩展名为.js,如index.js
    
    内部JS的写法为:
        <script>
            //在script标签内写js脚本
        </script>
    
    错误的写法:
        <script src="相对路径">
            //在script标签内写js脚本
        </script>
  

<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title></title>
<script>
// js code ...
</script>
</head>
<body>
<script>
// js code ...
</script>
</body>
<script>
// js code ...
</script>
</html>

在上面的代码中,我们把包含有js代码的script标签放在了head标签、body标签、和body标签之后的位置。从语法的层面来说,上面的这几种写法都是正确的。但是较为推荐的写法是将scirpt标签放在body标签的闭合标签的后面。

推荐的原因,是因为js代码经常需要操作html标签,而放在后面可以等到html标签加载完毕之后再来执行js代码。避免因为html标签未加载而导致的报错。

js语句

js当中的语句表示js向宿主环境发送的命令。

例如下面的语句是向页面中输出计算10 + 2的结果。

document.write(10+2);

在每一条语句的后面都带有一个分号,表示语句结束。

当然js允许我们将分号省略掉,但是无论是从代码的维护成本还是其他因素考虑,都不建议将每条语句后面的分号省略掉。

需要注意的是,如果分号前面的语句为空,则没有意义。

 向页面中打印内容:
        document.write(“这是一些文本内容”);
 
    可以直接解析标签:
        document.write(“<strong>加粗的内容</strong>”);
 
    转义字符:
        &lt;  ====  <
        &gt;  ====  >
        document.write(“&lt;strong&gt;这是一些加粗的内容</strong>”);
 
 
console.log("hello world")
向浏览器的控制台打印信息,跟document.write()原理类似
 

注释

注释是任何编程语言当中必不可少的一环。通过注释,可以让我们开发过的代码具有更好的可读性,也能变相的提升后期代码的维护和升级速度。

一般情况下,注释的内容可以包含很多,例如参数信息代码功能使用方式等等。

js中,注释分为两种,一种是单行注释,一种是多行注释

单行注释通过//表示,一般写在语句的后面或者语句的上方。

// 这里是代码注释

多行注释通过/**/的形式来创建,一般写在代码的上方。

/*
这里是多行注释...
*/

直接量

js中,直接使用的量,我们称之为叫做直接量

例如,在代码中,我们要使用10,那么这个10就是一个直接量

表达式

一般情况下,表达式需要得到一个结果。

例如10+2就是一个表达式,我们在创建这个表达式的时候,就希望得到10+2的结果。

document.write(10+2);// 通过document.write()方法将10+2这个表达式的结果输出到网页当中

输出方式

我们在编写js代码的时候,经常需要得到计算的值,用以判断得到的值与我们预期的值是否相符,所以我们需要了解下面的基本的输出方式。

// console.log() 将内容输出到浏览器的控制台
console.log(10+2);
// document.write() 将内容输出到网页当中
document.write(10+2);

通常情况下我们通过console.log()这种形式输出代码我们称之为代码打印

弹窗

js中,如果你的代码运行环境是在浏览器当中,那么就可以使用浏览器给我们提供的弹窗。

alert(10+2);
confirm(10+2);
prompt(10+2);

上述的三个弹窗只能够在运行环境为浏览器的情况下使用。

变量

我们上面说到了表达式,通过表达式能够得到计算的结果,但是如果我们计算的逻辑较为复杂,那么如果单纯的依赖表达式将会变得不那么方便。

这个时候,就可以使用变量

什么是变量呢?

我们可以把变量理解为是一个代名词或者说叫做临时的容器

我们可以把一个具体的值存入到变量中。那么此时这个变量就代表着我们这个具体的值。我们如果想要重新的使用这个值,不再需要重新的计算或者其他操作,直接使用变量就可以得到之前存储的这个值。

而想要创建一个变量(也可以说是声明一个变量),需要通过var关键字(es6中通过let声明)。

var val = 10 + 2;

在上面的代码中,我们创建了一个变量val,并且使用这个变量val存储了表达式10+2的计算结果。那么如果想要第二次使用10+2的结果,可以直接使用变量val即可。

在我们使用变量的时候,还有一点需要理解,变量之所以叫变量,是因为变量随时可以根据我们的需要更改其中存储的值。

var a = 10;
a = 20; // 当我们重新的向变量中存储数据的时候,不需要再加var
console.log(a); // 此时再打印a结果就为20

需要注意的是,上面我们将变量a内存储的数据由10变成了20,在重新存储的过程中,我们并没有使用var,那么上面的代码就相当于我们将20的值存储到之前创建的变量a中。

而如果在重新的存储的过程中使用了var,如同下面的案例:

var a = 10; // 第一次声明变量a
var a = 20; // 再一次通过var声明变量a,并且使用了var
consoloe.log(a);

需要注意的是,虽然最后的结果和上面的打印结果相同,但是变量a本质上已经发生了变化。

如果在重新存储数据的过程中,没有在变量名前面加var,那么相当于是更改变量a中存储的值,而如果前面加了var,则相当于重新的创建了一个变量a,并且存储了20这个数据

变量提升:

JavaScript 引擎的工作方式是,先解析代码,获取所有被声明的变量,然后再一行一行地运行。这造成的结果,就是所有的变量的声明语句,都会被提升到代码的头部,这就叫做变量提升(hoisting)

console.log(a);
var a = 1;

上面代码首先使用console.log方法,在控制台(console)显示变量a的值。这时变量a还没有声明和赋值,所以这是一种错误的做法,但是实际上不会报错。因为存在变量提升,真正运行的是下面的代码。

var a;
console.log(a); //undefined
a = 1;

标识符

标识符(identifier)指的是用来识别各种值的合法名称。最常见的标识符就是变量名,以及后面要提到的函数名。JavaScript 语言的标识符对大小写敏感,所以aA是两个不同的标识符。

标识符有一套命名规则,不符合规则的就是非法标识符。JavaScript 引擎遇到非法标识符,就会报错。

简单说,标识符命名规则如下。

  • 第一个字符,可以是任意 Unicode 字母(包括英文字母和其他语言的字母),以及美元符号($)和下划线(_)。
  • 第二个字符及后面的字符,除了 Unicode 字母、美元符号和下划线,还可以用数字0-9

数据类型

变量用来临时存储数据(如果想要永久的存储数据,需要通过数据库)。而在任何一门编程语言当中,数据都是分为不同类型的。就如同人类也分为男人和女人一样。

下面就来说一下在JavaScript中数据的不同类型。

js当中数据类型分为两类,一类是原始类型,一类是引用数据类型原始类型又称之为基础数据类型引用类型也称之为对象类型

原始类型的数据包含有下面几个:

  • Boolean
  • Null
  • Undefined
  • Number
  • String
  • Symbol(ES6中新增加的内容)

引用类型的数据包含有下面几个:

  • Object
  • Array
  • Function

Boolean

在计算机科学中,布尔值是一种逻辑数据类型,其值只能为真或假。例如,在JavaScript中,布尔条件 常用于决定执行哪一部分代码(例如在if语句中)或重复(例如在For循环中)。

布尔值包含有两个值truefalse。其中true表示false表示

例如我们判断一个条件,如果这个条件满足,那么对应着布尔值true,如果这个条件不满足,那么就对应着布尔值false

下列运算符会返回布尔值:

  • 前置逻辑运算符: ! (Not)
  • 相等运算符:===!====!=
  • 比较运算符:>>=<<=

如果 JavaScript 预期某个位置应该是布尔值,会将该位置上现有的值自动转为布尔值。转换规则是除了下面六个值被转为false,其他值都视为true

  • undefined
  • null
  • false
  • 0
  • NaN
  • ""或''(空字符串)

Null

在计算机科学中,空值表示一个引用,该引用通常有意指向不存在或无效的对象或地址。空引用的含义因语言实现而异。

在JavaScript中,null是一个基本值(原始数据)。

Null类型里面只有一个值,就是null
关于null,你可以把它理解为,它表示一个空值。

var a = null;

例如上面的代码当中,你可以理解为此事的变量a表示的值为空。当我们在一些需要传递值的地方,如果我们没有值进行传递,那么就可以传递一个null,表示传递的值为空。

undefined

Undefined类型当中只有一个值就是undefined

在代码的编写过程中,一个没有被赋值的变量的类型就是undefined

var a;
console.log(a); // 会在浏览器的控制台中输出undefined

Number

Number类型即为数字类型

MDN中关于Number类型的描述如下:

根据 ECMAScript 标准,JavaScript 中只有一种数字类型:基于 IEEE 754 标准的双精度 64 位二进制格式的值(-(263 -1) 到 263 -1)。它并没有为整数给出一种特定的类型。除了能够表示浮点数外,还有一些带符号的值:+Infinity-Infinity 和 NaN (非数值,Not-a-Number)。

JavaScript 内部,所有数字都是以64位浮点数形式储存,即使整数也是如此。所以,11.0是相同的,是同一个数。

1 === 1.0 // true

这就是说,JavaScript 语言的底层根本没有整数,所有数字都是小数(64位浮点数)。容易造成混淆的是,某些运算只有整数才能完成,此时 JavaScript 会自动把64位浮点数,转成32位整数,然后再进行运算。

由于浮点数不是精确的值,所以涉及小数的比较和运算要特别小心

0.1 + 0.2 === 0.3
// false 0.3 / 0.1
// 2.9999999999999996 (0.3 - 0.2) === (0.2 - 0.1)
// false

String

0个或者任意多个字符排列起来放在单引号或者双引号当中,就是一个字符串(String)

var a = "hello,world!";
var b = 'hello,JavaScript!';

上面的变量ab当中存储的数据就是字符串,其中一个使用了单引号,一个使用了双引号,两者都是合法的。

单引号字符串的内部,可以使用双引号。双引号字符串的内部,可以使用单引号。

运算符

在编程语言当中,运算符是处理数据的基本方法,能够根据现有的值得到新的值。

JavaScript当中,存在下列的运算符。

  • 赋值运算符
  • 比较运算符
  • 算数运算符
  • 位运算符
  • 逻辑运算符
  • 字符串运算符
  • 条件(三元)运算符
  • 逗号运算符
  • 一元运算符
  • 关系运算符

顺序是从右向左的进行赋值操作。

下面的列表中包含全部的赋值运算符

  • 赋值 x = y
  • 加赋值 x += y
  • 减赋值 x -= y
  • 乘赋值 x *= y
  • 除赋值 x /= y
  • 模赋值 x %= y
  • 指数赋值 x **= y
  • 左移赋值 x <<= y
  • 右移赋值 x >>= y
  • 无符号右移赋值 x >>>= y
  • 按位与赋值 x &= y
  • 按位异或赋值 x ^= y
  • 按位或赋值 x |= y

比较运算符

比较运算符包括下列内容:

  • 等于 == 如果两边操作数相等时返回true。
  • 不等于 != 如果两边操作数不相等时返回true
  • 全等 === 两边操作数相等且类型相同时返回true。
  • 不全等!== 两边操作数不相等或类型不同时返回true。
  • 大于> 左边的操作数大于右边的操作数返回true
  • 大于等于>= 左边的操作数大于或等于右边的操作数返回true
  • 小于< 左边的操作数小于右边的操作数返回true
  • 小于等于<= 左边的操作数小于或等于右边的操作数返回true

算数运算符

js当中,除了提供基础的+,-,*,/以外,还提供了一些其他的运算符,下面是所有的算术运算符:

  • +加法运算
  • - 减法运算
  • *乘法运算
  • / 除法运算
  • %求余运算(求模运算)
  • ++自增运算
  • --自减运算
  • +一元正值符
  • -一元负值符
  • **指数运算符

逻辑运算符

逻辑运算符常用于布尔(逻辑)值之间; 当操作数都是布尔值时,返回值也是布尔值。 不过实际上&&||返回的是一个特定的操作数的值,所以当它用于非布尔值的时候,返回值就可能是非布尔值。

下面是逻辑运算符:

  • 逻辑与(&&)
  • 逻辑或(||)
  • 逻辑非(!)

数据类型转换

JavaScript 是一种动态类型语言,变量没有类型限制,可以随时赋予任意值。

隐式类型转换:

 
    但是:
 
    if(1){
        alert("会弹出来么?");
    }
    1是数值型,不是布尔值,更不是true?为什么会执行花括号内的语句了呢?
 
    在一些特定的情况下,计算机会进行一些隐式转换,他和强制类型转换不一样,他不需要你做什么,会自动对数据类型进行转换
    在运算中,if(小括号)中的语句会发生隐式类型转换。
 
    1.运算中的隐式类型转换:
    var a = "1",b = 2;
    a + b = ???
    
    +号有两种含义:数学中的+号运算符;字符串的拼接。优先字符串拼接,所以在检测到+号左右两边存在字符串的时候,会自动将另一边不是字符串的数据,转成字符串,再进行操作
 
    a - b = ???
    
    除了+号有两层意义为外,-*/%号只有数学意义,所以当进行-*/%的时候,默认将运算符两边的数据类型隐式转换成数字类型再进行运算
    
    2.if(小括号)内的隐式类型转换。
    if()中只需要布尔值,那么在if判断中,会把括号内所有的数据类型,都隐式转换成布尔型。
    在if()中,非零数字都会转成true,非空字符串都会转成true;这是两条基础规则
 
    alert(1 == true)

强制类型转换

强制转换主要指使用Number()String()Boolean()三个函数,手动将各种类型的值,分别转换成数字、字符串或者布尔值。

Number()

使用Number函数,可以将任意类型的值转化成数值。

// 数值:转换后还是原来的值
Number(324) // // 字符串:如果可以被解析为数值,则转换为相应的数值
Number('324') // // 字符串:如果不可以被解析为数值,返回 NaN
Number('324abc') // NaN // 空字符串转为0
Number('') // // 布尔值:true 转成 1,false 转成 0
Number(true) //
Number(false) // // undefined:转成 NaN
Number(undefined) // NaN // null:转成0
Number(null) //

对象:
简单的规则是,Number方法的参数是对象时,将返回NaN,除非是包含单个数值的数组。

Number({a: 1}) // NaN
Number([1, 2, 3]) // NaN
Number([5]) //

String()

String函数可以将任意类型的值转化成字符串,转换规则如下。
(1)原始类型值

    • 数值:转为相应的字符串。
    • 字符串:转换后还是原来的值。
    • 布尔值:true转为字符串"true",false转为字符串"false"。
    • undefined:转为字符串"undefined"。
    • null:转为字符串"null"。
String(123) // "123"
String('abc') // "abc"
String(true) // "true"
String(undefined) // "undefined"
String(null) // "null"
String({a: 1}) // "[object Object]"
String([1, 2, 3]) // "1,2,3"

Boolean()

Boolean()函数可以将任意类型的值转为布尔值。

它的转换规则相对简单:除了以下五个值的转换结果为false,其他的值全部为true

  • undefined
  • null
  • 0(包含-0+0
  • NaN
  • ""(空字符串)
Boolean(undefined) // false
Boolean(null) // false
Boolean(0) // false
Boolean(NaN) // false
Boolean('') // false
//注意,所有对象(包括空对象)的转换结果都是true,甚至连false对应的布尔对象new Boolean(false)也是true
Boolean({}) // true
Boolean([]) // true
Boolean(new Boolean(false)) // true

------------恢复内容结束------------

JavaScript能用来做什么?
    页面分为:结构、样式、行为。
 
JavaScript的组成:
    ECMAScript、BOM、DOM
 
    ECMAScript是一个标准,它规定了语法、类型、语句、关键字、保留子、操作符、对象。(相当于法律)
 
 
    BOM(浏览器对象模型):可以访问浏览器窗口的浏览器对象模型,对浏览器窗口进行操作。
 
 
    DOM(文档对象类型):DOM把整个页面映射成一个多层节点结构。HTML页面组成都是某种类型的节点,这些节点又包含着不同类型的数据
 
 

js代码位置

  首先是如何编写JavaScript代码,说到这,我们首先要来说明一个需要新人们关注的点,因为我们的js是一门跨平台的语言,所以说,我们的代码可以运行在不同的平台之上。这也就导致了可能相同的代码放在不同的平台运行就会有所出入。

这里面说的平台其实被称之为宿主环境

  同时,代码在不同的平台上的运行方式也有所不同。

  如果运行在服务端,那么更多的时候我们需要通过命令行的形式去运行,而如果是代码运行在客户端,则需要通过启动浏览器来运行代码。

  我们在学习的初期建议是在浏览器中运行代码,减少学习成本。

  首先,我们的js代码可以写在script标签内部并且将script标签放在网页的任何位置。

  

 外联JS的写法为:
        <script src="相对路径"></script>
        这是一条html语句,原则上可以放在html页面的任意位置,不用和link标签一样非得放在head部分
        相对路径链接的是JavaScript文件,文件的扩展名为.js,如index.js
    
    内部JS的写法为:
        <script>
            //在script标签内写js脚本
        </script>
    
    错误的写法:
        <script src="相对路径">
            //在script标签内写js脚本
        </script>
  

<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title></title>
<script>
// js code ...
</script>
</head>
<body>
<script>
// js code ...
</script>
</body>
<script>
// js code ...
</script>
</html>

在上面的代码中,我们把包含有js代码的script标签放在了head标签、body标签、和body标签之后的位置。从语法的层面来说,上面的这几种写法都是正确的。但是较为推荐的写法是将scirpt标签放在body标签的闭合标签的后面。

推荐的原因,是因为js代码经常需要操作html标签,而放在后面可以等到html标签加载完毕之后再来执行js代码。避免因为html标签未加载而导致的报错。

js语句

js当中的语句表示js向宿主环境发送的命令。

例如下面的语句是向页面中输出计算10 + 2的结果。

document.write(10+2);

在每一条语句的后面都带有一个分号,表示语句结束。

当然js允许我们将分号省略掉,但是无论是从代码的维护成本还是其他因素考虑,都不建议将每条语句后面的分号省略掉。

需要注意的是,如果分号前面的语句为空,则没有意义。

 向页面中打印内容:
        document.write(“这是一些文本内容”);
 
    可以直接解析标签:
        document.write(“<strong>加粗的内容</strong>”);
 
    转义字符:
        &lt;  ====  <
        &gt;  ====  >
        document.write(“&lt;strong&gt;这是一些加粗的内容</strong>”);
 
 
console.log("hello world")
向浏览器的控制台打印信息,跟document.write()原理类似
 

注释

注释是任何编程语言当中必不可少的一环。通过注释,可以让我们开发过的代码具有更好的可读性,也能变相的提升后期代码的维护和升级速度。

一般情况下,注释的内容可以包含很多,例如参数信息代码功能使用方式等等。

js中,注释分为两种,一种是单行注释,一种是多行注释

单行注释通过//表示,一般写在语句的后面或者语句的上方。

// 这里是代码注释

多行注释通过/**/的形式来创建,一般写在代码的上方。

/*
这里是多行注释...
*/

直接量

js中,直接使用的量,我们称之为叫做直接量

例如,在代码中,我们要使用10,那么这个10就是一个直接量

表达式

一般情况下,表达式需要得到一个结果。

例如10+2就是一个表达式,我们在创建这个表达式的时候,就希望得到10+2的结果。

document.write(10+2);// 通过document.write()方法将10+2这个表达式的结果输出到网页当中

输出方式

我们在编写js代码的时候,经常需要得到计算的值,用以判断得到的值与我们预期的值是否相符,所以我们需要了解下面的基本的输出方式。

// console.log() 将内容输出到浏览器的控制台
console.log(10+2);
// document.write() 将内容输出到网页当中
document.write(10+2);

通常情况下我们通过console.log()这种形式输出代码我们称之为代码打印

弹窗

js中,如果你的代码运行环境是在浏览器当中,那么就可以使用浏览器给我们提供的弹窗。

alert(10+2);
confirm(10+2);
prompt(10+2);

上述的三个弹窗只能够在运行环境为浏览器的情况下使用。

变量

我们上面说到了表达式,通过表达式能够得到计算的结果,但是如果我们计算的逻辑较为复杂,那么如果单纯的依赖表达式将会变得不那么方便。

这个时候,就可以使用变量

什么是变量呢?

我们可以把变量理解为是一个代名词或者说叫做临时的容器

我们可以把一个具体的值存入到变量中。那么此时这个变量就代表着我们这个具体的值。我们如果想要重新的使用这个值,不再需要重新的计算或者其他操作,直接使用变量就可以得到之前存储的这个值。

而想要创建一个变量(也可以说是声明一个变量),需要通过var关键字(es6中通过let声明)。

var val = 10 + 2;

在上面的代码中,我们创建了一个变量val,并且使用这个变量val存储了表达式10+2的计算结果。那么如果想要第二次使用10+2的结果,可以直接使用变量val即可。

在我们使用变量的时候,还有一点需要理解,变量之所以叫变量,是因为变量随时可以根据我们的需要更改其中存储的值。

var a = 10;
a = 20; // 当我们重新的向变量中存储数据的时候,不需要再加var
console.log(a); // 此时再打印a结果就为20

需要注意的是,上面我们将变量a内存储的数据由10变成了20,在重新存储的过程中,我们并没有使用var,那么上面的代码就相当于我们将20的值存储到之前创建的变量a中。

而如果在重新的存储的过程中使用了var,如同下面的案例:

var a = 10; // 第一次声明变量a
var a = 20; // 再一次通过var声明变量a,并且使用了var
consoloe.log(a);

需要注意的是,虽然最后的结果和上面的打印结果相同,但是变量a本质上已经发生了变化。

如果在重新存储数据的过程中,没有在变量名前面加var,那么相当于是更改变量a中存储的值,而如果前面加了var,则相当于重新的创建了一个变量a,并且存储了20这个数据

变量提升:

JavaScript 引擎的工作方式是,先解析代码,获取所有被声明的变量,然后再一行一行地运行。这造成的结果,就是所有的变量的声明语句,都会被提升到代码的头部,这就叫做变量提升(hoisting)

console.log(a);
var a = 1;

上面代码首先使用console.log方法,在控制台(console)显示变量a的值。这时变量a还没有声明和赋值,所以这是一种错误的做法,但是实际上不会报错。因为存在变量提升,真正运行的是下面的代码。

var a;
console.log(a); //undefined
a = 1;

标识符

标识符(identifier)指的是用来识别各种值的合法名称。最常见的标识符就是变量名,以及后面要提到的函数名。JavaScript 语言的标识符对大小写敏感,所以aA是两个不同的标识符。

标识符有一套命名规则,不符合规则的就是非法标识符。JavaScript 引擎遇到非法标识符,就会报错。

简单说,标识符命名规则如下。

  • 第一个字符,可以是任意 Unicode 字母(包括英文字母和其他语言的字母),以及美元符号($)和下划线(_)。
  • 第二个字符及后面的字符,除了 Unicode 字母、美元符号和下划线,还可以用数字0-9

数据类型

变量用来临时存储数据(如果想要永久的存储数据,需要通过数据库)。而在任何一门编程语言当中,数据都是分为不同类型的。就如同人类也分为男人和女人一样。

下面就来说一下在JavaScript中数据的不同类型。

js当中数据类型分为两类,一类是原始类型,一类是引用数据类型原始类型又称之为基础数据类型引用类型也称之为对象类型

原始类型的数据包含有下面几个:

  • Boolean
  • Null
  • Undefined
  • Number
  • String
  • Symbol(ES6中新增加的内容)

引用类型的数据包含有下面几个:

  • Object
  • Array
  • Function

Boolean

在计算机科学中,布尔值是一种逻辑数据类型,其值只能为真或假。例如,在JavaScript中,布尔条件 常用于决定执行哪一部分代码(例如在if语句中)或重复(例如在For循环中)。

布尔值包含有两个值truefalse。其中true表示false表示

例如我们判断一个条件,如果这个条件满足,那么对应着布尔值true,如果这个条件不满足,那么就对应着布尔值false

下列运算符会返回布尔值:

  • 前置逻辑运算符: ! (Not)
  • 相等运算符:===!====!=
  • 比较运算符:>>=<<=

如果 JavaScript 预期某个位置应该是布尔值,会将该位置上现有的值自动转为布尔值。转换规则是除了下面六个值被转为false,其他值都视为true

  • undefined
  • null
  • false
  • 0
  • NaN
  • ""或''(空字符串)

Null

在计算机科学中,空值表示一个引用,该引用通常有意指向不存在或无效的对象或地址。空引用的含义因语言实现而异。

在JavaScript中,null是一个基本值(原始数据)。

Null类型里面只有一个值,就是null
关于null,你可以把它理解为,它表示一个空值。

var a = null;

例如上面的代码当中,你可以理解为此事的变量a表示的值为空。当我们在一些需要传递值的地方,如果我们没有值进行传递,那么就可以传递一个null,表示传递的值为空。

undefined

Undefined类型当中只有一个值就是undefined

在代码的编写过程中,一个没有被赋值的变量的类型就是undefined

var a;
console.log(a); // 会在浏览器的控制台中输出undefined

Number

Number类型即为数字类型

MDN中关于Number类型的描述如下:

根据 ECMAScript 标准,JavaScript 中只有一种数字类型:基于 IEEE 754 标准的双精度 64 位二进制格式的值(-(263 -1) 到 263 -1)。它并没有为整数给出一种特定的类型。除了能够表示浮点数外,还有一些带符号的值:+Infinity-Infinity 和 NaN (非数值,Not-a-Number)。

JavaScript 内部,所有数字都是以64位浮点数形式储存,即使整数也是如此。所以,11.0是相同的,是同一个数。

1 === 1.0 // true

这就是说,JavaScript 语言的底层根本没有整数,所有数字都是小数(64位浮点数)。容易造成混淆的是,某些运算只有整数才能完成,此时 JavaScript 会自动把64位浮点数,转成32位整数,然后再进行运算。

由于浮点数不是精确的值,所以涉及小数的比较和运算要特别小心

0.1 + 0.2 === 0.3
// false 0.3 / 0.1
// 2.9999999999999996 (0.3 - 0.2) === (0.2 - 0.1)
// false

String

0个或者任意多个字符排列起来放在单引号或者双引号当中,就是一个字符串(String)

var a = "hello,world!";
var b = 'hello,JavaScript!';

上面的变量ab当中存储的数据就是字符串,其中一个使用了单引号,一个使用了双引号,两者都是合法的。

单引号字符串的内部,可以使用双引号。双引号字符串的内部,可以使用单引号。

运算符

在编程语言当中,运算符是处理数据的基本方法,能够根据现有的值得到新的值。

JavaScript当中,存在下列的运算符。

  • 赋值运算符
  • 比较运算符
  • 算数运算符
  • 位运算符
  • 逻辑运算符
  • 字符串运算符
  • 条件(三元)运算符
  • 逗号运算符
  • 一元运算符
  • 关系运算符

顺序是从右向左的进行赋值操作。

下面的列表中包含全部的赋值运算符

  • 赋值 x = y
  • 加赋值 x += y
  • 减赋值 x -= y
  • 乘赋值 x *= y
  • 除赋值 x /= y
  • 模赋值 x %= y
  • 指数赋值 x **= y
  • 左移赋值 x <<= y
  • 右移赋值 x >>= y
  • 无符号右移赋值 x >>>= y
  • 按位与赋值 x &= y
  • 按位异或赋值 x ^= y
  • 按位或赋值 x |= y

比较运算符

比较运算符包括下列内容:

  • 等于 == 如果两边操作数相等时返回true。
  • 不等于 != 如果两边操作数不相等时返回true
  • 全等 === 两边操作数相等且类型相同时返回true。
  • 不全等!== 两边操作数不相等或类型不同时返回true。
  • 大于> 左边的操作数大于右边的操作数返回true
  • 大于等于>= 左边的操作数大于或等于右边的操作数返回true
  • 小于< 左边的操作数小于右边的操作数返回true
  • 小于等于<= 左边的操作数小于或等于右边的操作数返回true

算数运算符

js当中,除了提供基础的+,-,*,/以外,还提供了一些其他的运算符,下面是所有的算术运算符:

  • +加法运算
  • - 减法运算
  • *乘法运算
  • / 除法运算
  • %求余运算(求模运算)
  • ++自增运算
  • --自减运算
  • +一元正值符
  • -一元负值符
  • **指数运算符

逻辑运算符

逻辑运算符常用于布尔(逻辑)值之间; 当操作数都是布尔值时,返回值也是布尔值。 不过实际上&&||返回的是一个特定的操作数的值,所以当它用于非布尔值的时候,返回值就可能是非布尔值。

下面是逻辑运算符:

  • 逻辑与(&&)
  • 逻辑或(||)
  • 逻辑非(!)

数据类型转换

JavaScript 是一种动态类型语言,变量没有类型限制,可以随时赋予任意值。

隐式类型转换:

 
    但是:
 
    if(1){
        alert("会弹出来么?");
    }
    1是数值型,不是布尔值,更不是true?为什么会执行花括号内的语句了呢?
 
    在一些特定的情况下,计算机会进行一些隐式转换,他和强制类型转换不一样,他不需要你做什么,会自动对数据类型进行转换
    在运算中,if(小括号)中的语句会发生隐式类型转换。
 
    1.运算中的隐式类型转换:
    var a = "1",b = 2;
    a + b = ???
    
    +号有两种含义:数学中的+号运算符;字符串的拼接。优先字符串拼接,所以在检测到+号左右两边存在字符串的时候,会自动将另一边不是字符串的数据,转成字符串,再进行操作
 
    a - b = ???
    
    除了+号有两层意义为外,-*/%号只有数学意义,所以当进行-*/%的时候,默认将运算符两边的数据类型隐式转换成数字类型再进行运算
    
    2.if(小括号)内的隐式类型转换。
    if()中只需要布尔值,那么在if判断中,会把括号内所有的数据类型,都隐式转换成布尔型。
    在if()中,非零数字都会转成true,非空字符串都会转成true;这是两条基础规则
 
    alert(1 == true)

强制类型转换

强制转换主要指使用Number()String()Boolean()三个函数,手动将各种类型的值,分别转换成数字、字符串或者布尔值。

Number()

使用Number函数,可以将任意类型的值转化成数值。

// 数值:转换后还是原来的值
Number(324) // // 字符串:如果可以被解析为数值,则转换为相应的数值
Number('324') // // 字符串:如果不可以被解析为数值,返回 NaN
Number('324abc') // NaN // 空字符串转为0
Number('') // // 布尔值:true 转成 1,false 转成 0
Number(true) //
Number(false) // // undefined:转成 NaN
Number(undefined) // NaN // null:转成0
Number(null) //

对象:
简单的规则是,Number方法的参数是对象时,将返回NaN,除非是包含单个数值的数组。

Number({a: 1}) // NaN
Number([1, 2, 3]) // NaN
Number([5]) //

String()

String函数可以将任意类型的值转化成字符串,转换规则如下。
(1)原始类型值

    • 数值:转为相应的字符串。
    • 字符串:转换后还是原来的值。
    • 布尔值:true转为字符串"true",false转为字符串"false"。
    • undefined:转为字符串"undefined"。
    • null:转为字符串"null"。
String(123) // "123"
String('abc') // "abc"
String(true) // "true"
String(undefined) // "undefined"
String(null) // "null"
String({a: 1}) // "[object Object]"
String([1, 2, 3]) // "1,2,3"

Boolean()

Boolean()函数可以将任意类型的值转为布尔值。

它的转换规则相对简单:除了以下五个值的转换结果为false,其他的值全部为true

  • undefined
  • null
  • 0(包含-0+0
  • NaN
  • ""(空字符串)
Boolean(undefined) // false
Boolean(null) // false
Boolean(0) // false
Boolean(NaN) // false
Boolean('') // false
//注意,所有对象(包括空对象)的转换结果都是true,甚至连false对应的布尔对象new Boolean(false)也是true
Boolean({}) // true
Boolean([]) // true
Boolean(new Boolean(false)) // true

------------恢复内容结束------------

------------恢复内容结束------------

------------恢复内容结束------------

JavaScript基础入门01的更多相关文章

  1. JavaScript基础入门 - 01

    JavaScript入门 - 01 准备工作 在正式的学习JavaScript之前,我们先来学习一些小工具,帮助我们更好的学习和理解后面的内容. js代码位置 首先是如何编写JavaScript代码, ...

  2. javascript基础入门之js中的数据类型与数据转换01

    javascript基础入门之js中的数据结构与数据转换01 js的组成(ECMAScript.BOM.DOM)        js中的打印语句:        数据类型        变量      ...

  3. JavaScript基础入门06

    目录 JavaScript 基础入门06 Math 对象 Math对象的静态属性 Math对象的静态方法 指定范围的随机数 返回随机字符 三角函数 Date对象 基础知识 日期对象具体API 构造函数 ...

  4. CSS3基础入门01

    CSS3 基础入门 01 前言 相对于css2来说,css3更新了很多的内容,其中包括选择器.颜色.阴影.背景.文本.边框.新的布局方案.2d.3d.动画等等. 而如果想要学习css3的诸多部分,不妨 ...

  5. JavaScript 基础入门

    JavaScript 基础入门   JavaScript 的组成 JS 由三部分组成,它们分别是:ECMAScript.DOM.BOM. ECMAScript     因为网景开发了JavaScrip ...

  6. JavaScript基础入门10

    目录 JavaScript 基础入门10 正则表达式 为什么使用正则表达式? 正则表达式的应用场景 如何创建一个正则表达式 基础语法 具有特殊意义的转义字符 量词 字符类 贪婪模式 练习 邮箱验证 中 ...

  7. JavaScript基础入门09

    目录 JavaScript 基础入门09 Event 自定义右键菜单 获取鼠标按键 获取鼠标坐标 获取键盘按键 页面中位置的获取 浏览器的默认行为 冒泡 什么是冒泡 小练习 JavaScript 基础 ...

  8. JavaScript基础入门08

    目录 JavaScript 基础入门08 DOM 介绍 绑定事件 给一组元素绑定事件 节点 节点树 节点类型 选取文档内容 通过id选取元素 通过指定的标签名选取元素 用指定的css类来选取元素 通过 ...

  9. JavaScript基础入门07

    目录 JavaScript 基础入门07 BOM window对象 Navigator对象 Screen 对象 Location对象 History 对象 JavaScript 基础入门07 BOM ...

随机推荐

  1. Java之四大元注解@Target、@Retention、@Documented、@Inherited

    什么叫做元注解??   ==>用于注解[注释]的注解就叫做元注解 注解叫做:元数据,标签,注释           元注解[数据]--->注解--->标记代码 1.@Target : ...

  2. 示例:WPF实现ApplicationCommands.Delete的TextBox

    原文:示例:WPF实现ApplicationCommands.Delete的TextBox 目的:通过模仿TextBox中Ctrl+C等快捷键原理来了解CommandBindings实现原理,可以通过 ...

  3. 我的第一个netcore2.2 api项目搭建(二)

    上一章快速使用SqlSugar搭建了netcore api项目,我的第一个netcore2.2 api项目搭建(一) 这一章实现目标二:api使用Swagger,实现api文档管理 效果图:第一张收缩 ...

  4. SQL 查询表外键_T-Sql 2016——级联删除外键查询

    SELECT fk.name AS foreign_key_name, oSub.name AS table_name, SubCol.name AS table_column, oMain.name ...

  5. Java自学-数字与字符串 装箱和拆箱

    Java中基本类型的装箱和拆箱 步骤 1 : 封装类 所有的基本类型,都有对应的类类型 比如int对应的类是Integer 这种类就叫做封装类 package digit; public class ...

  6. Java自学-类和对象 单例模式

    Java的饿汉式与懒汉式单例模式 LOL里有一个怪叫大龙GiantDragon,只有一只,所以该类,只能被实例化一次 步骤 1 : 单例模式 单例模式又叫做 Singleton模式,指的是一个类,在一 ...

  7. pat 1039到底买不买

    小红想买些珠子做一串自己喜欢的珠串.卖珠子的摊主有很多串五颜六色的珠串,但是不肯把任何一串拆散了卖.于是小红要你帮忙判断一下,某串珠子里是否包含了全部自己想要的珠子?如果是,那么告诉她有多少多余的珠子 ...

  8. 【Kafka】Exactly Once语义与事务

    Kafka在0.11.0.0之前的版本中只支持At Least Once和At Most Once语义,尚不支持Exactly Once语义. 但是在很多要求严格的场景下,如使用Kafka处理交易数据 ...

  9. 【MySQL】数据库事务深入分析

    一.前言 只有InnoDB引擎支持事务,下边的内容均以InnoDB引擎为默认条件 二.常见的并发问题 1.脏读 一个事务读取了另一个事务未提交的数据 2.不可重复读 一个事务对同一数据的读取结果前后不 ...

  10. Java 之 自定义异常

    1.为什么需要自定义异常类 Java中不同的异常类,分别表示着某一种具体的异常情况,那么在开发中总是有些异常情况是没有定义好的,此时我们根据自己业务的异常情况来定义异常类.  一些异常都是 Java ...