Javascript 简介

Javascript 简介

JavaScript是一种运行在浏览器中的解释型的编程语言:
将文本格式的字符代码发送给浏览器由浏览器解释运行。

JavaScript组成

  1. 核心(ECMAScript),定义javascript的语法标准
  2. 浏览器对象模型(BOM)Browse Object Model:提供与浏览器交互的方法和接

口(API)

  1. 文档对象模型(DOM)Document Object Model:提供访问和操作网页HTML内

容的方法和接口

注意:接口API指的是编程接口,英文全称是Application Programming
Interface

在HTML中嵌入JavaScript脚本

JavaScript代码可以直接嵌在网页的任何地方, 必需使用 <script> 标签将JavaScript嵌入到 HTML 文档,才能被浏览器解释和执行。

JavaScript 脚本嵌入到 HTML 文档中方法:

  • 1.通过 <script> 标签嵌入
<head>
  <script type="text/javascript">
      document.write("这是通过script标签嵌入的代码");  
  </script>
</head>
  • 2.引入外部脚本;
可以在同一个页面中引入多个.js文件,浏览器按照顺序依次执行
<head>
 <script src="js/demo1.js"></script>
 <script src="js/demo2.js"></script>
</head>
script标签的 src 表示要引入的外部文件 ,type 表示脚本语言的类型(现代浏览器默认type="text/javascript"),所以script标签可以不写type

语法基础

注释

注释是给开发人员看到,JavaScript引擎会自动忽略。
行注释:

// 这是一行注释

块注释:
块注释是用/.../把多行字符包裹起来,把一大“块”视为一个注释

/* 
块注释
块注释
 */

文档注释:

/* 
 * 文档注释
 *文档注释
 */

标识符和命名规范

标识符就是一个名字。在javascript中,标识符常用于定义变量名和函数名等。

命名规范:
1.在javascript中,标识符由字母,下划线_和美元符$,数字组成
2.标识符不能以数字开头
3.标识符区分大小写:age和Age是不同的标识符,不建议代码里出现用大小写区分不同的标识符
4.变量名或者函数名的标识符不能使用关键字或保留字。
5.命名尽量遵守驼峰原则:personInfo,personName,personAge,

关键字:

break  case  catch  continue  default  delete  do  else  finally  
for  function  if in  instanceof  new  return  switch  this  
throw  try  typeof  var  void  while  with

保留字:

abstract    enum    int    short  boolean    export    interface    
static byte    extends    long   super   char    final    native    
synchronized  class    float    package    throws  const    goto    
private    transient   debugger    implements    protected    
volatile    double    import    public

语句

语句指的是程序执行行为的单元,每个语句以分号';'结束。
语句结束的分号可以不写,浏览器解析会自动添加,但建议都加上。

下面是一个完整的赋值语句:
var x = 1; 

var y = 1; var sum= 2; // 不建议一行写多个语句!,不美观

语句块

块由左花括号开始,由右花括号结束 {...}。
块的作用是使语句序列一起执行。
语句块是一组语句的集合。例如下面{...}中的所有语句组成语句块。

var x=10;
var y=20;
var sum=0;
 {  x=x+5;
    y=y+10;
    sum=x+y;
}

声明

用关键字 var(variable) 声明一个变量或常量(用于存储数据的容器)

例如:var x; //声明一个变量,变量名为x
      var x,y; //可以一次声明多个变量,变量名用逗号分隔;

常量

常量名习惯用大写字母表示
常量的值不会通过再赋值改变,也不会再次声明,通常在初始化的时候被赋值。
var SEX='男';

变量

变量就是可以改变的量,变量的值会通过再赋值改变,也可以再次声明和赋值。

例如:

// 先声明,后赋值
var x;
x=1;

// 声明的同时进行赋值
var x=2;

// 同时声明多个变量用逗号( ,)分开
var x,y,s;
x=1;
y=2;
s=3;
// 同时声明和赋值多个变量,用逗号( ,)分开
var x=1,y=2,s=3;

表达式

表达式是javascript中的一个短语,表达式指的是可用于计算的式子,即可能产生一个值的式子。
变量名也是一种简单的表达式,它的值就是赋值给变量的值。 复杂的表达式由简单表达式和运算符组成。

例如:

var x=15;      //表达式x的值是15
var y=20;      //表达式的值是20
var sum=x+y;   //表达式x+y的值的35

数据类型

编程语言最基本的特性就是能够支持多种数据类型

数据类型分类

Number:数字(整数int,浮点数float)  
String:字符串
Boolean: 布尔类型  
特殊数据类型 Null、Undefined
Object:对象
Array:数组对象 
Function :函数对象

typeof 操作符返回数据类型:

typeof 操作符:
用来检测变量的数据类型, 对于值或变量使用 typeof 操作符会返回  
  如下字符串:
  1.Undefined数据类型的值为: 
    var a; console.log(typeof a); //undefined 未定义
  2.Boolean数据类型的值为: 
    var a=true; console.log(typeof a); //boolean 布尔值  
  3.String数据类型的值为: 
    var a='hello world'; console.log(typeof a); //string 字符串  
  4.Number数据类型的值为: 
  var a=1314; console.log(typeof a);  //number 数字  
  5.Object数据类型的值为: 
    var a=null; console.log(typeof a); //object null  
    var b={ }; console.log(typeof b); //object 对象 
  6.Function数据类型的值为: 
    var a=function () {}; console.log(typeof a); //function 函数
Number

Number 数字类型包含两种数值:整型和浮点型
合法的数字类型Number类型:
整型:

var b = 100;  
console.log(b);
console.log(typeof  b);

浮点类型: 就是该数值中必须包含一个小数点,并且小数点后面必须至少有一位数字

var b = 3.8;
var b = 0.8;
var b = .8; //有效,但不推荐此写法

由于保存浮点数值需要的内存空间比整型数值大两倍,因此 ECMAScript
会自动将可以 转换为整型的浮点数值转成为整型。

var a = 8. ;  console.log(a);     //小数点后面没有值,转换为 8
var b = 12.0 ;  console.log(b);  //小数点后面是 0,转成为 12

对于那些过大或过小的数值,可以用科学技术法来表示(e 表示法)。用 e 表示 该数值的前面 10 的指数次幂。

var box = 4.12e9 ;         //即 4120000000
var box = 0.000000124;    //即 1.24e-7

浮点数值的范围在:Number.MIN_VALUE ~ Number.MAX_VALUE 之间, 如果 数值超过了JavaScript的Number所能表示的最大值或最小值,那么就先出现 Infinity(正无穷)或-Infinity(负无穷)。

var num=12/0  // Infinity
var num=-12/0 // -Infinity

NaN, 即非数值(Not a Number)是一个特殊的值 ,当无法计算结果时用NaN表示

var b = 0/0 ; //NaN

ECMAScript 提供了 isNaN()函数,用来判断这个值到底是不是 NaN。如果是返回true,如果不是返回false

console.log(isNaN(NaN));  //true
console.log(isNaN(25));   //false,25 是一个数值
console.log(isNaN('25'));  //false,'25'是一个字符串数值,可以转成数值
console.log(isNaN('Lee')); //true,'Lee'不能转换为数值
console.log(isNaN(true));  //false true 可以转成成 1

数值的转换

1.parseInt()    是把string类型或number类型的数据转换为整型  
parseInt("10.898797");       //返回 10
parseInt(10.898797);  //返回 10

2.parseFloat()  是把string类型或number类型的数据转换为浮点型(小数)
parseFloat("10.898797");     //返回 10.898797
parseFloat("10.898797");     //返回 10.898797

3.Number.toFixed(x) 把数字转换为字符串,返回数据小数点后有x位数字
var num = 5.56789;  
var n=num.toFixed(2);  //"5.57"  四舍五入

4.Number.toPrecision(x)  把数字转换为字符串,返回数据长度为x
var num = 13.3714;  
var n=num.toPrecision(3);    //"13.4"  四舍五入


5.Math.round四舍五入
Math.round(3.15) //3
Math.round(3.65) //4

6.Math.ceil 向上取整
Math.ceil(3.15)  //4
Math.ceil(3.65) //4

7.Math.floor向下取整
Math.floor(3.15) //3
Math.floor(3.65)  //3
String

String字符串类型,表示一串字符,可以由双引号(" ")和单引号(' ')表示。

var str="hello" ;
var str='world' ;
请注意,''或""本身只是一种表示方式,不是字符串的一部分,因此,字符串'hello'只有h,e,l,l,o这5个字符。
Boolean

Boolean 布尔类型只有两个值:true(真)和 false(假)。
而true一般等于1,false一般等于0。
JavaScript 是区分大小写的,True和False或者其他都不是Boolean类型的值。

var flag=true;
console.log(typeof flag); //boolean

可以使用转型函数 Boolean(),将一个值转换为其对应的 Boolean 值

var a = 'Hello World!';  
var b = Boolean(a);  
console.log(typeof   b);

Boolean 类型的转换规则: (牢记)

String:        非空字符串为true        空字符串为false  
Number:        非0数值为true           0或者NaN为false  
Object:        对象不为null则为true    null为false  
Undefined :    undefined为false
Undefined

Undefined 类型的值只有一个,就是undefined。当一个变量被声明,但未被赋值时,它的值就是undefined,代表未定义。

var num;
console.log(typeof num); //undefined
//注意: 我们在定义变量的时候, 尽可能的不要只声明,不赋值, 而是声明的同  时初始化一个值。
Null

Null 类型的值只有一个,就是 null。null表示一个空的对象。 typeof 操作符检测 null 会返回 object。

var b = null;      console.log(typeof   b); //object

undefined 是派生自 null 的,因此 ECMA-­262 规定对它们的相等性测试返回 true, 表示值相等。

console.log(undefined == null);   //true

但是两者的数据类型是不一样的

var b ; var car = null;
console.log(typeof b== typeof car)     //false

如果定义的变量准备在将来用于保存对象,那么最好将该变量初始化为 null 而不是其他值。

var obj=null;
obj={}
对象

JavaScript自定义对象对象是用花括号分隔,由一组由键(属性名)-值(属性值)组成的无序集合,属性由逗号分隔,例如:

var obj = {
    name: 'jack',
    age: 18
};

JavaScript对象的键(属性名)和值(属性值)组成。
属性名是一个有效的变量名,可以通过.操作符来访问属性。
如果属性名包含特殊字符,就必须用''或者""括起来,访问这个属性也无法使用.操作符,必须用['xxx']或者["xxx"]来访问。

属性值可以是任意的数据类型。

访问对象属性的两种方式

var name=obj.name;
var age=obj['age'];
数组

数组:多个数据元素按一定顺序排列的集合
数组用[]表示,元素之间用','分隔

var array=[1, 1.5,'Hello', null, true]; //数组可以包括任意数据类型。

访问数组

通过下标索引来获取和设置数组某个特定的元素。
访问数组的元素可以通过索引来访问,索引的起始值为0:

console.log(array[0]) ;
console.log(array[1]) ;
函数

函数定义方法:
函数由关键字'function',和函数名'functionname',和括号以及花括号组成:

function functionname (参数1,参数2) {
    //这里写函数执行的代码
}

function:关键字 function 来声明函数。
functionname :函数名称
(参数1,参数2):(可选)括号内列出函数的参数,多个参数以','分隔
{...}:花括号之间的代码是函数体,由若干语句组成。

函数的实例和调用:

function add(x,y){
  var sum=x+y;
  return sum;
}

// var result=add(2,3);
// alert(result);
alert(add(2,3));

注意:JavaScript 对大小写敏感。关键词 function 必须是小写的,并且必须以与函数名称相同的大小写来调用函数

函数体语句执行到return时,函数就执行完毕,并将结果返回。
如果没有return语句,函数执行完毕后也会返回结果,只是结果为undefined。
JavaScript 是弱类型的语言,拥有动态类型,同一个变量可以赋予不同类型的值。变量的类型在赋值时才能确定
var b;
  b=20;
  b = "张三";
  b={};
  b=[];
  b=function(){ };
  console.log(typeof b);

运算符

  • 算术运算符

    +  加法  x=2+3   5
    -  减法  x=5-3   2

/ 除法 x=5/2 2.5
% 求余 x=5 %2 1
++ 自增 var x=3; x++; console.log(x)
-- 自减 var x=3; x--; console.log(x)

前自加:
var x=5;
var num1=++x; // 相当于x=x+1; var num1=x;
console.log('num1='+num1+' x='+x); //num1=6 x=6

后自加:
var x=5;
var num2=x++; // 相当于 var num2=x; x=x+1;
console.log('num2='+num2+' x='+x); //num2=5 x=6

前自减:
var x=5;
var num3=--x; //相当于 x=x-1; var num3=x;
console.log('num3='+num3+' x='+x); //num3=4 x=4

后自减
var x=5;
var num4=x--; //相当于 var num4=x; x=x-1;
console.log('num4='+num4+' x='+x); //num4=5 x=4

- 字符串'+' 遇到字符串,用来连接字符串

// 两个都是字符串, 直接连接两个字符串
var result1='hello'+'world';
console.log(result1); //helloworld
console.log(typeof result1);

//如果其中有一个是字符串, 另一个是其他类型, 则会先将其他的类型强制转换成字符,然后再连接
var result2='hello'+2;
console.log(result2); //hello2
console.log(typeof result2);

####二进制, 八进制, 十进制, 十六进制(扩展)
进制:
在计算机处理器内部只认识二进制, 在内存存储的数据其实就是大量的开关,  每个开关,可以存储一个1或0,称为一位(1bit),每八位称为1字节(1byte)

1byte = 8位 1KB = 1024byte 1MB = 1024KB
1GB = 1024MB
1TB = 1024GB
..1PB, 1EB
1位 : 是二进制的0或者1

例如: 十进制的23在内存中存储的是二进制10111  23 -­> 10111
00000000 00000000 00000000 00010111(内存中存储的23)

**进制:**

二进制: 0, 1 (0~1)
八进制: 0, 1, 2, 3, 4, 5, 6, 7 (0~7)
十进制: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 (0~9)
十六进制: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F (0~15)

>常用值: 2的次方  2^2 = 4
2^3 = 8
2^4 = 16
2^5 = 32
2^6 = 64
2^7 = 128
2^8 = 256
2^9 = 512
2^10 = 1024
2^11 = 2048

**进制转换:**
2进制 :101011
转10进制: (从右往左)1*2^0 + 1*2^1 + 0*2^2 + 1*2^3 +0*2^4 + 1*2^5 =  1+2+0+8+0+32 = 43
转8进制: (从右往左3个一组 101 011): 1*2^0+0+1*2^2  1*2^0+1*2^1+0  = 53
转16进制: (从右往左4个一组 0010 1011): 1*2^1  1*2^0+1*2^1+0+1*2^3 = 2B 

10进制: 43
转2进制: 32+8+2+1 = 101011
转8进制: 40+3 = 53
转16进制: 32+11 = 2B

**其他的方法:**
!['转2进制'](img/j1.jpg '转2进制')
!['转8进制'](img/j3.jpg '转8进制')
!['转16进制'](img/j2.jpg '转16进制')

8进制: 53
转10进制: 3*8^0+5*8^1 = 43

16进制: 2B
转10进制:  11*16^0+2*16^1  = 32+11 = 43

8进制和16进制转非10进制,可以先转换成10进制,再由10进制转
8进制的53转16进制:
8进制转10进制: 3*8^0+5*8^1 = 43
43转16进制: 32+11 = 2B

相关推荐