JavaScript简介

ECMAScript和JavaScript的关系

        1996年11月，Netscape公司决定将JavaScript提交给国际标准化组织ECMA（European Computer Manufacturers Association），希望JavaScript能够成为国际标准，以此抵抗微软。

        1997年7月，ECMA组织发布262号标准文件（ECMA-262）的第一版，规定了浏览器脚本语言的标准，并将这种语言称为ECMAScript。这个版本就是ECMAScript 1.0版。之所以不叫JavaScript，一方面是由于商标的关系，另一方面也是想体现这门语言的制定者是ECMA，不是Netscape，这样有利于保证这门语言的开放性和中立性。

        因此，ECMAScript和JavaScript的关系是，前者是后者的规格，后者是前者的一种实现。在日常场合，这两个词是可以互换的。

JS变量与常量

1.变量命名规则与声明变量

        在JS中声明变量和常量都需要使用关键字，声明变量时有两种情况分别声明在全局与局部中

  全局声明变量：var

  局部声明变量：let

  声明常量：const

ps：JS是动态类型，变量名绑定的数据值类型不固定

var name ="name1"
    name = "name2"
    name = 123

2.常量的特点

        常量保存的是不可变化的量在JS中是不能修改的，在声明常量时不能重复赋值

const name = "name1"
      name = "name2"
//直接报错

JS数据类型之数值类型

1.查看数据值数据类型

        在JS中查看数据类型可以使用：typeof

2.JS数值型(Number)

        在JS中不区分整型与浮点型统一称之为：数值类型(number)

        将数据转换成数值型：parseInt，当数据为非数字的特殊值时返回：NaN(表示不是一个数字)

var a = 22.22;
var b = 999;

parseInt("999")
>>>返回：999
parseInt("ABC")
>>>返回：NaN

JS数据类型之字符串类型

1.JS字符串

        JS字符串用关键字（let）来声明，用单引号、双引号、反引号包含起来的数据

//单引号
let name = 'name1'
//双引号
let gender = “ male”
//反引号
let hobby = `sing`

2.字符串内置方法

JS字符串常用内置方法

方法	说明
length	返回字符串长度
trim()	移除空白
trimLeft()	移除左边的空白
trimRight()	移除右边的空白
charAt(n)	返回第n个字符
concat(value,)	拼接字符串
slice(start,end)	切片
toLowerCase()	字符串小写
toUpperCase()	字符串大写
split(delimiter,limit)	按指定分割字符串

JS数据类型之布尔值

1.布尔值定义(Boolean)

        在JavaScript中有两个布尔值：true和false，区别python中的布尔值JS中的都是小写，其中空字符串、0、null、undefined、NaN都是false值。

//定义布尔值

var a = ture;
var b = false;

//判断布尔值

Boolean(NaN)  #  false
Boolean(undefined) # false
Boolean(a) # true

2.null与undefined区别

          null表示值为空，指的是一个被定义过的变量被手动清空使该变量变为object类型值变为null

          undefined值也是空，但是指的是一个变量被声明之后没有被初始化值，那么该变量的默认值是undefined还有当函数没有明确的返回值时返回的也是undefined。

ps：可以通俗的理解为null是一个谈恋爱后分手了的单身狗，而undefined则表示一个想谈恋爱但是没有谈过的单身狗。

JS数据类型之对象 

1.对象的定义

        JS中也是一切皆对象：字符串、数值、数组、函数等，而且JS允许自定义对象。对象是带有属性和方法等特殊数据类型，JS中提供了多个内建对象如：String、Date、Array等

2.对象之数组

        JS的数组类似Python中的列表，使用单独的变量名来存储多个数据值，数组通过点点出内置方法

//定义一个数组
var a = [1, 2, 3, a, b, "True"];
//索引取值
console.log(a[5]
结果："True"

常用方法：

方法	说明
.length()	统计数组的大小
.push(ele)	数组尾部追加元素
.pop()	获取数组尾部的元素
.unshift(ele)	头部插入元素
.shift()	头部移除元素
.slice(start,end)	切片取值
.reverse()	反转
.join(seq)	将数组元素连接成字符串
.concst(val,...)	连接数组
.sort()	排序
.forEach()	将数组的每个元素传递给回调函数
.splice()	删除元素，并向数组添加新元素
.map()	返回一个数组元素调用函数处理后的值的新数组

// 举例理解
var num =[1, 22, 33, 44, 55, 66, 77, 88];
num.forEach(function(a){console.log(a)})
结果：以换行的形式循环打印数组

num.splice(0,1,1111)
num
结果：把数组中索引从0开始修改1个元素
[111, 22, 33, 44, 55, 66,7 7, 88]

3.JS数据类型之自定义对象

        在JS中自定义对象相当于python中的字典且方式不是单一的

方式一：类似"字典"方式

let a1 = {'name':'aa','age':18};

方式二：关键字 new

let b1 = newBject() 

ps：自定义对象直接用句点符对数据值进行操作

拓展：遍历数组中的数据和python中如何让字典也可以通过句点符操作数据

var a1 = [1,2,3,4,5,6]
for (var i=0;i<a.length;i++) {
    console.log(i);
}

JS运算符 

1.常规运算符

        常规的运算符与python中的大致相同分算数运算符、赋值运算符、比较运算符、逻辑运算符、但也有一些特别的符号

常规运算符

运算符	用法
+	加法
-	减法
*	乘法
/	除法
%	取模
=	赋值
！=	不等于
>,<	大于，小于
>=,<=	大于等于，小于等于

2.特殊运算符

特别符号

运算符	方法
==	弱等于，自动转换成相同数据类型
===	强等于，不自动转换数据类型
&&	关系运算，等价于and
｜｜	关系运算，等价于or
！	关系运算，等价于not
？	三元运算符

// 注意点：在JS中符号位置不同结果也不同
var a = 10;
var res = a++;
结果：先赋值后自增 11
var res1 = ++a;
结果：先自增后赋值 12

JS流程控制 

1.if分支结构

        JS中if分支结构与Python的if语句逻辑相同，但语法格式不一样我们可以对照着Python语法来学习JS的语法结构

# python中的if语句格式

if 条件1:
    执行语句
elif 条件2:
    执行语句
else：
    执行语句

// JS中if语法格式

if (条件1) {
    执行语句;
}else if(条件2) {
    执行语句;
}else {
    执行语句;
}

  JS中条件需要用括号括起来

  JS大括号等同python中的冒号

  JS需要完整的写else if

  执行语句后需要加分号;

2.循环结构

1.for循环：由两部分组成，条件控制和循环体

for(初始化语句;循环条件;自增或自减) {
        执行的代码块;
}

// for循环遍历代码
a1 = [1,2,3,4,5,6,7]
for (let i=0;i < a1.length;i++) {
    console.log(a1[i]);
}

2.while循环：循环会重复执行一段代码，直到某个条件不再满足

while(条件表达式语句){
    执行的代码块;
}

// 具体用法：遍历数组数据
a1 = [1,2,3,4,5,6,7]
let i=0;
while (i < a1.length) {
    console.log(a1[i]);
    i++;
}

 JS函数定义

1.函数的定义

        JS函数通过function关键字进行定义，后面跟函数名和括号，函数名可以包含字母、数字、下划线和$符

2.具体用法

  参数与参数间用逗号隔开，函数执行代码放在大括号中

  函数体个数不需要一一对应要限制参数个数需要用到关键字：arguments        

// 语法格式
function 函数名(参数1、参数2,...) {
    执行体代码
    return 返回值
}
// 限制个数
function 函数名(参数1、参数2,...) {
    if (arguments.length==2){
        两个形参条件成立执行体代码
    }else{
        条件不成立执行体代码
    }
}

3.匿名函数

  不需要函数名

function(a, b){
    return a + b;
}

4.箭头函数

var f = () => 5;
// 等同于
var f = function(){return 5};
var sum = (num1, num2) => num1 + num2;

// 等同于
var sum = function(num1, num2){
    return num1 + num2;  //这里的return只能返回一个值，如果想返回多个值需要自己手动给他们包一个数组或对象中
  }

 JS内置对象

1.Date日期对象

        Date对象用于处理日期与时间，创建内置对象的有固定的语法：

var 变量名 = new 内置对象名();

//创建不指定参数对象
var d1 = new Date();
console.log(d1.toLocaleString());
//创建参数为日期字符串
var d2 = new Date("2004/3/20 11:12");
console.log(d2.toLocaleString());
var d3 = new Date("04/03/20 11:12");
console.log(d3.toLocaleString());
//创建参数为毫秒数
var d3 = new Date(5000);
console.log(d3.toLocaleString());
console.log(d3.toUTCString());

//创建参数为年月日小时分钟秒毫秒
var d4 = new Date(2004,2,20,11,12,0,300);
console.log(d4.toLocaleString());  //毫秒并不直接显示

ps：创建不同参数的日期对象

   Date对象的方法：

/*
获取日            getDate()
获取星期          getDay()
获取月(0-11)      getMonth()
获取完整年份        geFullYear()
获取年            getYear
获取小时          getHours()
获取分钟           getMinutes()
获取秒            getSeconds()
获取毫秒           getMilliseconds()
返回累计毫秒数      getTime()
*/
var d3 = new Date();
d1.getDate()
d1.getMonth()
d1.getMilliseconds()
d1.getYear()

2.JSON序列化对象

        和python序列化一样，通过JSON序列化能够达到多语言交互

JSON.stringify() //序列化
JSON.parse()    //反序列化

import json # python中需要先导模块

json.dumps() # 序列化
json.loads() # 反序列化

  JSON文件多语言交互原理：

        在python中当对字典数据进行序列化时结果会成为{"name":"a","age":"18"} json格式，而这时候把这个数据穿给JS中时可以通过JSON.parse()将传过来的数据进行反序列化得到数据，反之也是一样的JS中序列到python中反序列

3.RegExp正则对象

        在JS中的正则表达式有两种表达方式：

var res1 = new RegExp("表达式"); // 方式一

var res2 = /表达式$/;

  正则表达式中不能有空格

  全局匹配时有一个lastIndex属性