码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript基础语法

时间:2019-09-24 21:14:02      阅读:104      评论:0      收藏:0      [点我收藏+]

标签:eof   提升   它的   字符串包含   后退   assign   没有   数据库   undefined   

变量

一级标题的颜色

二级标题的颜色

三级标题的颜色

tip

API

1.什么是变量呢?

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

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

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

console.log(a);//通过控制台可以看到10+2的结果

我们在使用变量的时候,有一点需要理解,变量之所以叫做变量,是因为变量随时可以根据我们的需要更改其中存储的值(因为js是一门弱类型语言)。

var a = 10; a = 20; console.log(a)//此时打印a的结果就为20;

2.变量提升

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

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

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

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

这段代码最后显示的结果为:undefined,标示变量a已经声明,单还未赋值。

数据类型

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

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

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

  • Boolean

  • Null

  • Undefined

  • Number

  • String

*Symbol(es6中新增加的内容)

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

  • Object

  • Array

  • Function

在js当中,引用类型也包括Date ,Math,RegExp等内容

需要注意的是,Js当中的原始值并不能够更改,也就意味着一旦一个原始值创建成功。那么就不能够进行第二次的值得修改,除非重新创建一个数据。。

Boolean

布尔值包含有两个值turefalse。其中turefalse

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

  • undefined

  • null

  • false

  • 0

  • NaN

  • ""或者‘‘ (空字符串)

Null

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

关于null,你可以把它理解为,他表示一个空值。

var a = null;

例如上面的代码当中,就可以理解为此时的变量a的值为空。

undefined

undefined类型里面只有一个值,就是undefined

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

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

例如上面的代码当中,就可以理解为此时的变量a的值为空。

Number

number类型就是 数字类型

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

1 === 1.0 //ture

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

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

0.1 + 0.2 === 0.3  //false

0.3 / 0.1   //2.9999999999999996

数值范围

根据标准,64位浮点数的指数部分的长度是11个二进制位,意味着指数部分的最大值是2047(2的11次方减1)。也就是说,64位浮点数的指数部分的值最大为2047,分出一半标示负数,则JavaScript能够表示的数值范围为21024到2-1012(开区间),超出这个范围的数无法标示。

如果一个数大于2的1024次方,那么就会发生“正向溢出”,即JavaScript无法表示这么大的数,这时就会返回Infinity

如果一个数小于2的—1075次方,那么就会发生“负向溢出”,即JavaScript无法表示这么小的数,这时会直接返回0.

Math.pow(2,-1075) //0

Number当中的特殊值

1.正零和负零

JavaScript的64位浮点数之中,有一个二进制位是符号位,这意味着,任何一个数都有一个对应的负值,就连0也不例外。

JavaScript内部实际上存在2个0:一个是+0,一个是-0,他们的区别就是64位浮点数表示法的符号位不同。但是他们是等价的

-0 === +0   // true

0 === -0    // true

0 === +0    // true

2.NaN

NaN是javascript的 特殊值,标示“非数字”(Not a Number),主要出现在将字符串解析成数字出错的场合。

console.log(5 - ‘x‘); //NaN

NaN并不是一个独立的数据类型,而是一个特殊的数值,他依旧属于Number,使用typeof运算符可以看得很清楚。

需要注意的是,NaN不等于自己

3.Infinity

Infinity标示为无穷大。在js中,如果数值的内容超过了js所能标示的范围,那么就会输出Infinity

Number当中的一些全局方法(API):

1.parseInt()

功能1:parseInt方法用于将字符串转为整数。

eg:parseInt(‘123‘)//123

功能2:如果字符串头部有空格,空格会被自动去除。

parseInt(‘ 11‘)//11

功能3:如果parseInt的参数不是字符串,则会先转为字符串在转换。

parseInt(1.23) // 1

//等同于

parseInt('1.23') //1

功能4:检索数字,去除数字外的部分,并且去除浮点数

parseInt('8a')  //8
parseInt('12**') //12
parseInt('12,34') //12
parseInt('15e2')  //15
parseInt('15px') //15

Tip
:如果字符串的第一个字符不能转换为数字,(后面跟着数字的正负号除外),则返回NaN。

parseInt('abc')  //NaN
parseInt('.3') //NaN
parseInt('') //NaN
parseInt('+')  //NaN
parseInt('+1') //1

所以,parseInt的返回值只有两种,要么是整数,要么是NaN

2.parseFloat()

parseFloat 方法用于讲一个字符串转为浮点数。

parseFloaat(‘3.14‘) // 3.14

如果字符串符合科学计数法,则会进行相应的转换。

parseFloat('314e-2')  // 3.14
parseFloat('0.0314E+2')  //3.14

如果字符串包含不能转为浮点数的字符,则不再进行完后转换,返回已经转换好的部分。

parseFloat(‘3.14more non-digit characters‘) // 3.14

parseFloat方法会自动过滤字符串前面的空格

parseFloat(‘\t\v\r12.34\n‘) // 12.34

如果参数不是字符串,或者字符串的第一个字符不能转化为浮点数,则返回NaN.

尤其值得注意,parseFloat会将空字符串转为NaN

parseFloat([])   //NaN
parseFloat('f12') //NaN
parseFloat('')  //NaN
parseFloat('1asd')  //1
parseFloat('a1')  //NaN

这些特点使得parseFloat的转换结果不同于Number函数。

parseFloat(true)  //NaN
Number(ture)  // 1

parseFloat(null)  //NaN
Number(null) // 0

parseFloat('') //NaN
Number('')  // 0

parseFloat('123.45#')  // 123.45
Number('123.45#')  //NaN

String

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

eg:

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

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

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

'key = "value"';
"this is story about a 'man',cool man "

Tip
:由于HTML语言的属性值使用的双引号,所以很多项目约定,JavaScript语言的字符串只是用单引号,当然,只是用双引号也完全可以,重要的是坚持使用一种风格的引号。

Tip
:如果字符串较长,必须分成多行,可以在每行的尾部使用反斜杠\

var longString = 'LonglongLongString'; 
//"Long long Long String"

转义字符

反斜杠()在字符串内有特殊含义,用来表示一些特殊字符,所以又称为转移符。

需要用反斜杠转义的特殊字符,主要有下面这些。

  • \0 :null(\u0000

  • \b :后退键(\u0008

  • \f :换页符(\u000C

  • \n :换行符(\u000A

  • \r :回车键(\u000D

  • \t :制表符(\u0009

  • \v :垂直制表符(\u000B

  • \‘ :单引号(\u0027

  • \" :双引号(\u0022

  • \\ :反斜杠(\u005C

如果在一个正常的字符前面加了,是没有效果的。

console.log("\a");  //输出的是a

运算符

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

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

  • 赋值运算符

  • 比较运算符

  • 算数运算符

  • 位运算符

  • 逻辑运算符

  • 字符串运算符

  • 条件(三元)运算符

  • 逗号运算符

  • 一元运算符

  • 关系运算符

赋值运算符

赋值运算符(assignment operator) 是基于右值(right operand)的值,给左值(left operand)赋值。

说的通俗一些就是 =

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

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

  • 赋值 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

赋值

简单的赋值运算符,吧一个值赋给一个变量,为了把一个值赋给多个变量,可以用链式使用赋值运算符。

加赋值

加赋值运算符把一个右值与一个变量相加,然后把相加的结果赋给该变量。两个操作数的类型决定了加赋值运算符的行为。算术相加或字符串连接都有可能。

例如:

var x = 10;
var y = 20;
x += y;
console.log(x); 
// 相当于 
x = x + y;

减赋值

减赋值运算符使一个变量减去右值,然后把结果赋给该变量。

例如:

var x = 10;
var y = 20;
x -= y;
console.log(x); // -10 
// 相当于 
x = x - y;

乘赋值

乘赋值运算符使一个变量乘以右值,然后把相成的结果赋给该变量。

例如:

var x = 10;
var y = 20;
x *= y;
console.log(x); // 200
// 相当于
x = x * y;

除赋值

除赋值运算符使一个变量除以右值,然后把结果赋给该变量。

例如:

var a = 10;
var b = 20;
a /= b;
console.log(a);
// 相当于 
a = a / b; 

模赋值

模赋值运算符使一个变量除以右值,然后把余数交给该变量。

例如:

var x = 10;
var y = 20;
a %= b;
console.log(a);
//等同于 
a = a % b;

指数赋值

指数赋值运算符使一个变量为底数、以右值为指数的指数运算(乘方)结果赋给该变量。

例如:

var x = 2;
var y = 3;
x **= y;
console.log(x); // 8
// 相当于
x = x ** y 

比较运算符

  • 等于 == 如果两边操作数相等时返回true。

  • 不等于 != 如果两边操作数不相等时返回true

  • 全等 === 两边操作数相等且类型相同时返回true。

  • 不全等!== 两边操作数不相等或类型不同时返回true。

  • 大于> 左边的操作数大于右边的操作数返回true

  • 大于等于>= 左边的操作数大于或等于右边的操作数返回true

  • 小于< 左边的操作数小于右边的操作数返回true

  • 小于等于<= 左边的操作数小于或等于右边的操作数返回true

tip

=> 这个是箭头函数

算数运算符

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

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

逻辑运算符

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

下面是逻辑运算符:

  • 逻辑与(&&)

  • 逻辑或(||)

  • 逻辑非(!)

逻辑与:

逻辑与&&运算符又称为且运算符,往往用于多个表达式之间的求值。

它的运算规则是:如果第一个运算子的布尔值为true,则返回第二个运算子的值(注意是值,不是布尔值);如果第一个运算子的布尔值为false,则直接返回第一个运算子的值,且不再对第二个运算子求值。

逻辑或:

逻辑或||运算符又称为或运算符,同样用于在多个表达式之间求值。

它的运算规则是:如果第一个运算子的布尔值为true,则返回第一个运算子的值,且不再对第二个运算子求值;如果第一个运算子的布尔值为false,则返回第二个运算子的值。

逻辑非:

逻辑非(!)运算符又叫取反运算符,就是取一个值的反值。主要用于将一个布尔值变为相反值。即true变为false,false变为true

如果使用取反运算符的值不是一个布尔值,那么取反运算符就会将其变为一个布尔值,然后再取反。

下面的六个值使用取反运算符取反后都为true,其他都为false。

  • undefined
  • null
  • false
  • 0
  • NaN
  • 空字符串(‘‘)

字符串运算符

字符串运算符指的是+,通过加号,我们可以对两个字符串进行拼接从而返回一个新的字符串。

var a = "hello,";
var b = "world!";
console.log(a + b); // hello,world!

也可以采用简写的形式来拼接字符串。

var str = "hello,";
var str += "world!";
console.log(str); // hello,world!

也可以在使用的过程中进行数据的拼接。

var sayHello = "hello,my name is ";
console.log(sayHello + "zhangsan");// hello,my name is zhangsan

条件运算符

条件运算符也称之为三元运算符

条件运算符是JavaScript中唯一需要三个操作数的运算符。运算的结果根据给定条件在两个值中取其一。

一。语法为:

条件 ? 值1 : 值2

如果条件,则结果取值1。否则为值2。可以在任何允许使用标准运算符的地方使用条件运算符。

数据类型转换

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

例如:

var a = 10; // 创建一个变量a,并且赋值为10
a = "hello,world!"; // 将"hello,world"重新赋值给变量a,这样a就由number变为string

强制类型转换

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

Number()

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

下面分成两种情况讨论,一种是参数是原始类型的值,另一种是参数是对象。

// 数值:转换后还是原来的值
Number(324) // 324

// 字符串:如果可以被解析为数值,则转换为相应的数值
Number('324') // 324

// 字符串:如果不可以被解析为数值,返回 NaN
Number('324abc') // NaN

// 空字符串转为0
Number('') // 0

// 布尔值:true 转成 1,false 转成 0
Number(true) // 1
Number(false) // 0

// undefined:转成 NaN
Number(undefined) // NaN

// null:转成0
Number(null) // 0
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

自动类型转换

上面说完了强制类型转换,再来说下自动类型转换,它是以强制类型转换为基础的。

遇到以下三种情况时,JavaScript 会自动转换数据类型,即转换是自动完成的,用户不可见。

第一种情况,不同类型的数据互相运算。

123 + 'abc' // "123abc"

第二种情况,对非布尔值类型的数据求布尔值。

if ('abc') {
  console.log('hello')
}  

第三种情况,对非数值类型的值使用一元运算符(即+和-)。

var a = "10";
console.log(+ a,typeof +a); // 10 "number"
+ {foo: 'bar'} // NaN
- [1, 2, 3] // NaN

JavaScript基础语法

标签:eof   提升   它的   字符串包含   后退   assign   没有   数据库   undefined   

原文地址:https://www.cnblogs.com/triennium/p/11580902.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!