JS简介

JS是一门真正意义上的语言。

什么是语言

语言是人和计算机交流的工具,人类通过语言来控制、操作计算机。

JavaScript的起源

  • JavaScript诞生于1995年,它的出现主要是用于处理网页中的前端验证。
  • 所谓的前端验证,就是检查用户输入的内容是否符合一定的规则。
  • 比如:用户名的长度、密码的长度、邮箱的格式

网景公司(Netscape)的navigator (航海家)浏览器创造了live script,后改名为JavaScript。

之后微软开发了JScript。之后网景公司捐献出JavaScript。

为了确保不同的浏览器上运行的JavaScript标准一致,所以几个公司共同制定了JS的命名标准ECMAScript简称(ES).

实现

  • ES是一个标准,而这个标准需要各个厂商去实现。
  • 不同的浏览器厂商对该标准会有不同的实现。
  • 我们已经知道ECMAScript是JavaScript标准,所以一般情况下这两个词我们认为是一个意思。
  • 但是实际上JavaScript的含义却要更大一些。
  • 一个完整的JavaScript实现应该由以下三个部分构成:ECMAScript ,DOM,BOM.
    1.ECMAScript标准
    2.DOM如何通过JS操作网页
    3.BOM如何通过JS操作浏览器

navigator是火狐的前身。

Chrome的v8引擎最快.

特点

-解释型语言

-动态语言

-基于原型的面向对象

JS的Hello Word

JS代码需要写在script标签中。

控制浏览器弹出一个警告框

alert("hello world");

让计算机在页面中输出一个内容

document.write("hello world")   写入body中,会出现在body中

向控制台输出一个内容

console.logo()的作用是向控制台输出一个内容

console.log("我在哪里");

JavaScript是一门正儿八经的语言,出现了函数()和分号。

JS编写的位置

1.可以将js代码编写到标签onclick属性中

当我们点击按钮时,js代码才会执行

<bottom onclick="alert('你点我干啥')"></buttom>

虽然可以写在标签的属性中,但是他们属于结构与行为的耦合,不方便维护,不推荐使用。

2.可以将js代码写在超链接的href属性中,这样当点击超链接时,会执行js代码

<a href="javascript:alert('又点我');"></a>

3.可以将js代码写到script标签里

4.最佳:引入外部js文件

<script src="path"></script>

script标签一旦用于引入外部文件了,就不能再编写代码了,即使编写了浏览器也会忽略。如果需要则可以再创建一个新的script便签用于编写内部代码。

基本语法

JS注释

注释中的内容不会被执行,但是可以在源代码中查看

多行注释:注释中的内容不会被执行,但是可以在源代码中查看 /* */

单行注释://

1.JS中严格区分大小写

2.JS中每一条语句以分号(;)结尾

-如果不写分号,浏览器会自动添加,但是会消耗一些性能

而且有些时候,浏览器会加错分号,所以在开发中分号必须写

3.JS中会忽略多个空格和换行,所以我们可以利用空格和换行对代码进行格式化

字面量和变量

字面量

都是一些不可改变的值

比如:1 2 3 4 5

字面量都是可以直接使用,但是我们一般都不回直接使用字面量

变量

变量可以用来保存字面量,而且变量的值是可以任意改变的

变量更加方便我们使用,所以在开发中都是通过变量去保存一个字面量,而很少直接使用字面量

可以通过变量对自变量进行描述

声明变量

在js中使用var关键字来声明一个变量

为变量赋值

声明和赋值同时使用

var a = 123;

标识符

-在JS中所有的可以由我们自主命名的都可以成为是标识符。

-例如:变量名、函数名、属性名都属于标识符

-命名一个标识符时需要遵循如下的规则:

1.标识符中可以含有字母、数字、_、$

2.标识符不能以数字开头

3.标识符不能是ES中的关键字或保留字

4.标识符一般都采用驼峰命名法

-首字母小写,每个单词的开头字母大写,其余字母小写 helloWorld

-JS底层保存标识符时实际上是采用Unicode编码,所以理论上讲,所有的UTF-8中含有的内容都可以作为标识符。

数据类型

数据类型指的就是字面量的类型。

在JS中一共有六种数据类型:

  • String 字符串
  • Number 数值
  • Boolean 布尔值
  • Null 空值
  • Undefined 未定义
  • Object 对象

其中String,Number,Boolean,Null,Undefined,Object属于基本数据类型,

而Object属于引用数据类型。

String字符串

-在JS中字符串需要使用引号引起来

-使用双引号或单引号都可以,但是不要混着用

-引号不能嵌套,双引号不能套双引号,单引号不能套单引号

在字符串中我们可以使用\作为转义字符,当表示一些特殊符号时可以使用\进行转义

“表示” ‘表示’ \n表示换行 \t表示制表符 \\表示\ 三个\需要写成\\\\\\

Number数值

在JS中所有的数值都是Number类型,包括整数和浮点数(小数)

JS中可以表示得数字的最大值

Number.MAX_VALUE 1.7976931348623157e+308

Number.MIN_VALUE 5e-324 大于0的最小值

如果使用Number表示的数字超过了最大值,则会返回一个

Infinity 表示正无穷

-Infinity表示负无穷

使用typeof检查Infinity也会返回number

NAN是一个特殊的数字,表示not a number

使用typeof检查NAN也会返回number

typeof

可以使用typeof运算符检查一个变量的类型

语法:typeof变量名

检查字符串会返回string

检查数值会返回number

精确度问题

在JS中整数的运算基本可以保证精确

如果使用JS进行浮点运算,可能得到一个不精确的结果

所以千万不要用JS进行对精确度要求比较高的运算

Boolean布尔值

true表示真

false表示假

使用typeof检查一个布尔值时,会返回boolean

Null

Null类型的值只有一个,就是null

null这个值专门用来表示一个为空的对象

使用typeof检查null时会反悔object

Undefined

undefined类型的值只有一个,那就是undefined

声明变量但是并不给变量赋值时,它的值就是undefined

强制类型转换

-指将一个数据类型强制转换为其他的数据类型

-数据类型主要指,将其他的数据类型转换为String Number Boolean

将其他的数据类型转换为String

方式一

-调用被转换数据类型的toString()方法

-该方法不会影响到原变量,他会将转换的结果返回

调用a的toString()方法

调用xxx的yyy方法,就是xxx.yyy()

-但是注意:null和undefined这两个值没有toString()方法,如果调用会报错

方式二

-调用String()函数,并将被转换的数据作为参数传递给函数

-使用String()函数做强制类型转换时,

对于Number和Boolean实际上就是调用的toString()方法

但是对于null和undefined,就不会调用toString()方法

它会将null直接转换为"null"

将undefined直接转换为"undefined"

将其他的数据类型转换为Number

方式一

使用number()函数

-字符串–>数字

1.如果是纯数字的字符串,则直接将其转换为数字

2.如果含有非数字内容,则会返回NaN

3.如果字符串是一个空串或者是一个全是空格的字符串,则转换为0

-布尔值–>数字

true 1

false 0

-null–>数字 0

-undefined --> 数字NaN

方式二

-这种方式专门用来对付字符串

-parseInt()把一个字符串转换为一个整数,parseFloat()把一个字符串转换为一个浮点数

parseInt()可以将一个字符串中有效的整数内容取出来 例如123px取123,123a567px取123 遇到字母就停

-parseFloat()作用和parseInt()类似,不同的是它可以获得有效的小数

–如果对非String使用parseInt()和parseFloat(),它会闲将其转换为string然后再操作

其他进制的表示

在JS中,如果需要表示16进制的数字,则需要以0x开头

如果需要表示8进制的数字,则需要以0开头

如果需要表示2进制的数字,则需要0b开头

但是不是所有浏览器都支持

像“070”这种字符串,有些浏览器会当成0进制解析,有些浏览器当成10进制解析

可以在parseInt()中传递一个第二个参数,来制定数字的进制。

转换为Boolean

方式一:使用Boolean()函数

-数字–>布尔 除了0和NaN,其余的都是true

-字符串–>布尔 除了空字符串,其余的都是true

-null和undefined都会转换为false

--对象都会转换为true

方式二(隐式类型转换)

为任意的数据类型做两次非运算,即可将其转换为布尔值

例子:var a = “hello”;

a = !!a; //true

运算符

运算符也叫操作符,通过运算符可以对一个或多个值进行运算,并获取运算结果

typeof运算符

比如:typeof就是运算符,可以来获得一个值的类型 它会将该值的类型以字符串的形式返回

string number boolean null undefined object

算术运算符

+ - * / %

当对非number类型的值进行运算时,会将这些值转换为number,然后再运算(加号除外)

任何值和NaN做运算都会得到NaN



可以对两个值进行加法运算,并返回结果

如果对两个字符串进行加法运算,则会做拼串。会将两个字符串拼接成一个字符串,并返回。

任何值和字符串做加法,都会先转换成字符串,然后再和字符串进行拼接。

-我们可以利用这一点,让任一数据类型加空字符串即可转换成字符串。这是一种隐式的类型转换

由浏览器自动完成,实际上它也是调用的String()函数。

console.log("c = "+c)会更好看

result = 1 +2 + “3”; 结果是33

result = “1” + 2 + 3;结果是123



可以对两个值进行减法运算,并将结果返回



可以对两个值进行乘法运算

/

除法运算

3/2=1.5 有别于C语言

任何值做-*/都会自动转换为number

我们可以利用这一点做隐式的类型转换 可以用过为一个值-0 *1 /1这样的操作来将其转换为Number

原理和Number()一样,使用起来更加简单

%

取模运算(取余)

一元运算符

一元运算符,只需要一个操作数

+正号 正号不会对数字产生任何影响

-负号 负号可以对数字进行负号的取反

对于非Number类型的值,

它会将先转换为Number,然后再运算

可以对一个其他的数据类型使用+,来将其转换为number 它的原理和Number()一样

自增 自减

自增++

-通过自增可以使变量在自身的基础上增加1

–对于一个变量自增以后,原变量的值会立即自增1

-自增分为两种:后++(a++)和前++(++a)

无论是a++还是++a,都会立即使得原变量的值自增1

不同的是a++和++a的值不同

a++的值等于原变量的值(自增前的值)

++a的值等于新值(自增后的值)

自减–

-通过自减可以使变量在自身的基础上减少1

–对于一个变量自减以后,原变量的值会立即减少1

-自增分为两种:后–(a–)和前–(--a)

无论是a–还是–a,都会立即使得原变量的值自减1

不同的是a–和--a的值不同

a–的值等于原变量的值(自减前的值)

--a的值等于新值(自减后的值)

逻辑运算符

JS中为我们提供了三种逻辑运算符

! 非

-!可以用来对一个值进行非运算

-所谓非运算就是对一个布尔值进行取反操作, true便false false便true

-如果对一个值进行两次取反操作,他不会变化

–如果对非布尔值进行运算,则会将其转换为布尔值,然后再取反

所以我们可以利用该特点,来讲一个其他的数据类型转换为布尔值

可以为一个任意数据类型取两次反,来将其转换为布尔值

原理和Boolean()一样

&&与

可以对符号两侧的值进行与运算并返回结果

-运算规则

-两个值只要有一个false就返回false 只有两个值都为true是才会返回true

-JS中的“与”属于短路的与,如果第一个是false,则不会看第二个值

||或

运算规则:

-两个值中只要有一个true就返回true 只有当两个值都为false才返回false

-JS中的“或”类似于短路的或,如果第一个值为true 则不会检查第二个值

非布尔值的逻辑运算

与运算:现将其转换为布尔值,然后再运算,并且返回原值

-如果第一个值为true,则必然返回第二个值

-如果第一个值为false,则直接返回第一个值

或运算

-如果第一个值为true,则直接返回第一个值

-如果第一个值为false,则直接返回第二个值

只有在JS中可以对非布尔值进行逻辑运算。

赋值运算符

可以将符号右侧的值赋值给符号左边的变量。

= += -+ *= /+

关系运算符

通过关系运算符可以比较两个值之间的大小关系

如果关系成立它会返回true,如果关系不成立则返回false

> >= < <=

非数值的情况

-对于非数值进行比较时,会将其转换为数字然后再比较

-任何值和NaN作比较都是false

-如果两侧都是字符串,不会将其转换为数字进行比较,而会分别比较字符串中字符的Unicode编码

比较两个字符串时,比较的是字符串的字符编码

比较字符编码时是一位一位进行比较

如果两位一样,则比较下一位,所以借用他来对英文进行排序

比较中文时没有意义 排序无规律

-如果比较的是两个字符类型的数字,可能会得到不可预期的结果

注意:在比较两个字符串类型的数字时,一定一定要转型

相等运算符

相等返回true,否则false

–当时用==来比较两个值时,如果值的类型不同,会自动转换成相同类型,再判断是否相等。

大部分都是转换成数字的。

undefined衍生于null,所以这两个值做相等判断时,会返回true

NaN不和任何值相等,包括他本身

可以通过isNaN()函数来检查一个值是否是NaN,如果是返回true,不是返回false

不相等运算符

不相等也会对变量进行自动类型转换,如果转换后相等返回false

相等和不相等都会自动进行类型转换。

全等,不全等

===

全等用来判断两个值是否全等,它和相等类似,不同的是它不会做类型转换,如果类型不相等直接返回false。

!==

不全等用来判断两个值是否不全等,和不等类似,不同的是他不会做类型转换,如果类型不相等直接返回true。

条件运算符

条件运算符也叫三元运算符。

语法:

条件表达式?语句1:语句2;

条件成立执行语句1,否则执行语句2

var max = a > b ? (a > c ? a : c) : (b > c ? b :c); 这种写法不推荐使用

如果条件表达式的求值结果是一个非布尔值,则会将其转换为布尔值然后再运算。

Unicode编码表

在字符串中使用转义字符输入Unicode编码 “\u四位编码”(16进制)

在网页中使用Unicode编码 &#四位编码; 这里的编码需要的是10进制(用计算器)