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中声明变量和常量都需要使用关键字,声明变量时有两种情况分别声明在全局与局部中

\bullet  全局声明变量:var

\bullet  局部声明变量:let

\bullet  声明常量: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区别

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

        \bullet  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 {
    执行语句;
}

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

\bullet  JS大括号等同python中的冒号

\bullet  JS需要完整的写else if

\bullet  执行语句后需要加分号;

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.具体用法

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

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

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

3.匿名函数

\bullet  不需要函数名

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:创建不同参数的日期对象

 \bullet  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() # 反序列化

\bullet  JSON文件多语言交互原理:

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

3.RegExp正则对象

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

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

var res2 = /表达式$/;

\bullet  正则表达式中不能有空格

\bullet  全局匹配时有一个lastIndex属性

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值