【030】Python全栈日记-JavaScript(二)

52 篇文章 4 订阅
20 篇文章 0 订阅

 

核心语法就到今天,下次开始是DOM文档操作。

 

自学最重要的就是查询参考手册,因为所有的教科书都是参考参考手册编写的,每个语言你在安装环境的时候都会在开始菜单生成参考手册。我把JavaScript的参考手册分享一下

链接:(https://pan.baidu.com/s/1o1sdjyxMjdnYuiOfAlSdrw

提取码:kkbx

这个不像python的参考手册全英文,这个是中文的。

 

再提供一个网站(https://javascript.info/variables),里面关于js的东西非常新,互联网是一个日新月异的东西,既然入这行,就要做好时刻学习的准备,例如赋值var已经被let代替,屏幕左上角有选择中文的选项

 

今天内容多到爆炸,自学的可以分成2到3天看,多敲代码!!!!!

 

 

正文开始:

一、数组

其实就是python中的列表

 

1、为什么要学习数组

之前学习的数据类型,只能存储一个值(比如:Number/String。我们想存储班级中所有学生的姓名,此时该如何存储?

 

2、数组的概念

所谓数组,就是将多个元素(通常是同一类型)按一定顺序排列放到一个集合中,那么这个集合我们就称之为数组。

 

3、数组的定义

数组是一个有序的列表,可以在数组中存放任意的数据,并且数组的长度可以动态的调整。

通过数组字面量创建数组


 

4、获取数组元素

数组的取值

 

5、遍历数组

遍历:遍及所有,对数组的每一个元素都访问一次就叫遍历。

数组遍历的基本语法:


 

6、数组中新增元素

数组的赋值

 

 

7、数组中的一些方法:推荐参考JavaScript参考手册。

(1)concat()

定义和用法

concat() 方法用于连接两个或多个数组。

该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。

 

语法

arrayObject.concat(arrayX,arrayX,......,arrayX)

arrayX:是必需的。

该参数可以是具体的值,也可以是数组对象。可以是任意多个。

 

返回值

返回一个新的数组。该数组是通过把所有 arrayX 参数添加到 arrayObject 中生成的。

如果要进行 concat() 操作的参数是数组,那么添加的是数组中的元素,而不是数组。

 

实例:

结果:

 

(2)join()

定义和用法

join() 方法用于把数组中的所有元素放入一个字符串。

元素是通过指定的分隔符进行分隔的。

 

语法

arrayObject.join(separator)

 

参数

Separator:

可选。指定要使用的分隔符。如果省略该参数,则使用逗号作为分隔符。

 

返回值

返回一个字符串。该字符串是通过把 arrayObject 的每个元素转换为字符串,然后把这些字符串连接起来,在两个元素之间插入 separator 字符串而生成的。

 

实例:

结果:

 

(3)pop,push

用于出栈入栈(先进后出)

pop删除并返回数组的最后一个元素

push给数组添加元素

 

语法

array.pop( )

array.push(value, ...)

 

返回值

Pop:array的最后一个元素。

Push:把指定的值添加到数组后的新长度。

 

push参数

value:要添加到array尾部的值,可以是一个或多个。

 

描述

方法pop()将删除array的最后一个元素,把数组长度减1,并且返回它删除的元素的值。如果数组已经为空,则pop()不改变数组,返回undefined。

 

方法push()将把它的参数顺次添加到array的尾部。它直接修改array,而不是创建——个新的数组。方法push()和方法pop()用数组提供先进后出栈的功能。参阅 “Array.pop()”中的示例。

 

(4)reverse()

颠倒数组中元素的顺序

 

(5)shift( )

将第一个元素移出数组

语法

array.shift( )

 

返回值

数组原来的第一个元素。

 

描述

方法shift()将把array的第—个元素移出数组,返回那个元素的值,并且将余下的所有元素前移一位,以填补数组头部的空缺。如果数组是空的,shift()将不进行任何操作,返回undefined。注意,该方法不创建新数组,而是直接修改原有的数组。

 

方法shift()和方法Array.pop()相似,只不过它在数组头部操作,而不是在尾部操作。该方法常常和unshift()一起使用。

 

 

(6)unshift()

在数组头部插入一个元素

语法

array.unshift(value, ...)

 

参数

Value:要插入数组头部的一个或多个值。

 

返回值

数组的新长度!!

 

描述

方法unshift()将把它的参数插入array的头部,并将已经存在的元素顺次地移到较高的下标处,以便留出空间。该方法的第一个参数将成为数组新的元素0,如果还有第二个参数,它将成为新的元素1,以此类推。注意,unshift()不创建新数组,而是直接修改原有的数组。

 

(7)sort()

对数组排序

 

(8)splice()重点

插入、删除或替换数组的元素

语法

array.splice(start, deleteCount, value, ...)

 

参数

start :开始插入和(或)删除的数组元素的下标。

deleteCount :从start开始,包括start所指的元素在内要删除的元素个数。这个参数是可选的,如果没有指定它,splice()将删除从start开始到原数组结尾的所有元素

value,:要插人数组的零个或多个值,从start所指的下标处开始插入。

 

返回值

如果从array中删除了元素,返回的是含有被删除的元素的数组。但是要注意,由于存在—个bug,因此在JavaScriptl.2的Netscape实现中,返回的并不总是数组。

 

描述

方法splice()将删除从start开始(包括start所指的元素在内)的零个或多个元素,并且用参数列表中声明的一个或多个值来替换那些被删除的元素。位于插入或删除的元素之后的数组元素都会被移动,以保持它们与数组其他元素的连续性。注意,虽然spllce()方法与slice()方法名字相似,但作用不同,方法splice()直接修改数组。

 

(9)slice()

返回数组的一部分

语法

array.slice(start, end)

 

参数

start :数组片段开始处的数组下标。如果是负数,它声明从数组尾部开始算起的位置。 也就是说,-1指最后一个元素,-2指倒数第二个元素,以此类推。

end :数组片段结束处的后一个元素的数组下标。如果没有指定这个参数 包含从start开始到数组结束的所有元素。如果这个参数是负数, 从数组尾部开始算起的元素。

 

返回值

一个新数组,包含从start到end(不包括该元素)指定的array元素。

 

描述

方法slice()将返回数组的一部分,或者说是一个子数组。返回的数组包含从start 开始到end之间的所有元素,但是不包括end所指的元素。如果没有指定end,返回的数组包含从start开始到原数组结尾的所有元素。

注意:该方法并不修改数组。如果想删除数组中的一段元素,应该使用方法Array.splice。

 

 

二、字符串

字符串昨天已经大概写了点,再学python时学过字符串是不能修改的类型还记得吧,所以字符串没有增加减少的属性,只有修改为新的字符串,让我们看一些常用的方法。

(1)charAt()

返回字符串中的第n个字符

语法

string.charAt(n)

 

参数

n :应该返回的字符在string中的下标。

 

返回值

字符串string的第n个字符。

 

描述

方法String.charAt()返回字符串string中的第n个字符。字符串中第一个字符的下标值是0。如果参数n不在0和string.length-1之间,该方法将返回一个空字符串。注意,JavaScript并没有一种有异于字符串类型的字符数据类型,所以返回的字符是长度为1的字符串。

 

(2)charCodeAt()

返回字符串中的第n个字符的ASCII码

语法

string.charCodeAt(n)

 

参数

n :返回编码的字符的下标。

 

返回值

string中的第n个字符的Unicode编码。这个返回值是0~65535之间的16位整数。

 

描述

方法charCodeAt()与charAt()执行的操作相似,只不过前者返回的是位于指定位置的字符的编码,而后者返回的则是含有字符本身的子串。如果n是负数,或者大于等于字符串的长度,则charCodeAt()返回NaN。

 

 

(3)concat()

连接字符串

语法

string.concat(value, ...)

 

参数

value, :要连接到string上的一个或多个值。

 

返回值

把每个参数都连接到字符串string上得到的新字符串。

 

描述

方法concat()将把它的所有参数都转换成字符串(如果必要),然后按顺序连接到字符串string的尾部,返回连接后的字符串。注意,string自身并没有被修改。

 

String.concat()与Array.concat()很相似。注意,使用“+”运算符来进行字符串的连接运算通常更简便一些。

 

 

(4)indexOf()

查找字符串元素,和python字符串的find一模一样

 

语法

string.indexOf(substring)

string.indexOf(substring,start)

 

参数

substring :要在字符串string中检索的子串。

 

start :一个可选的整数参数,声明了在字符串String中开始检索的位置。它的合法取值是0(字符串中的第一个字符的位置)到string.length-1(字符串中的最后一个字符的位置)。如果省略了这个参数,将从字符串的第一个字符开始检索。

 

返回值

如果在string中的start位置之后存在substring返回出现的第一个substring 的位置。如果没有找到子串substring返回-1。

 

描述

方法string.indexOf()将从头到尾的检索字符串string,看它是否含有子串 substring。开始检索的位置在字符串string的start处或string的开头(没有 指定start参数时)。如果找到了一个substring那么String.indexOf()将返回 substring的第一个字符在string中的位置。string中的字符位置是从0开始的。

如果在string中没有找到substring,那么String.indexOf()方法将返回-1。

 

重点来了,以后常备!!

(5)slice()

抽取一个子串

语法

string.slice(start, end)

 

参数

start :要抽取的片段的起始下标。如果是负数,那么该参数声明了从字符串的尾部开始算起的位置。也就是说,-1指字符串中的最后一个字符,-2指倒数第二个字符,以此类推。

 

end :紧接着要抽取的片段的结尾的下标。如果没有指定这一参数,那么要抽取的子串包括start到原字符串结尾的字符串。如果该参数是负数,那么它声明了从字符串的尾部开始算起的位置。

 

返回值

一个新字符串,包括字符串string从start开始(包括start)到end为止(不包 括end)的所有字符。

 

描述

方法slice()将返回一个含有字符串string的片段的字符串或返回它的一个子串。 但是该方法不修改string。

 

(6)split()

将字符串分割成字符串数组,和python的也一样,常用

语法

string.split(delimiter, limit)

 

参数

delimiter :字符串或正则表达式,从该参数指定的地方分割string。ECMAScript V3标准化了正则表达式作为定界符使用时的用法,JavaScript 1.2和JAVASCRIPTcript 3.0实现了它。JavaScriptl.1没有实现它。

 

limit :这个可选的整数指定了返回的数组的最大长度。如果设置了该参数,返回的子串不会多于这个参数指定的数字。如果没有设置该参数,整个字符串都会被分割,不考虑它的长度。ECMAScriptv3标准化了该参数,JavaScript 1.2和JAVASCRIPTcript 3.0实现了它。JavaScript 1.1没有实现它。

 

返回值

一个字符串数组,是通过在delimiter指定的边界处将字符串string分割成子串创建的。返回的数组中的子串不包括delimiter自身,但下面列出的情况除外。

 

描述

切片方法,你括号里填写什么,就以什么分割整个字符串,并转为数组。

 

来练一个,平时我们在网址填完数据信息后,是以这样传给后台的:

http://www.baidu.com?name = 'lili'&password='123'&sex='nv'"

物品们需要的东西都在网址问好以后,所以我们就需要使用字符串的一些方法讲网址中的键值对提取出来。试一试:

结果:

我们今天还要学个东西叫对象,是专门存储这些后台数据的,和python中的字典非常相似,但是功能更强,你听这个名字,就感觉又和类有关,所以功能强大。

 

 

在学对象之前我们先学习JavaScript中的函数:

三、函数

1、为什么要有函数

如果要在多个地方求1-100之间所有数的和,应该怎么做?

 

2、什么是函数

把一段相对独立的具有特定功能的代码块封装起来,形成一个独立实体,就是函数,起个名字(函数名),在后续开发中可以反复调用。

函数的作用就是封装一段代码,将来可以重复使用。

 

3、函数的定义

(1)函数声明

 

(2)函数表达式

变量fn就是一个函数,也好理解,你的函数不就是为了处理一些数据,然后得到结果,所以当你给变量fn加上参数,fn就代表了函数的返回值。

 

(3)特点:

函数声明的时候,函数体并不会执行,只要当函数被调用的时候才会执行。函数一般都用来干一件事情,需用使用动词+名词,表示做一件事情 tellStory sayHello等

 

 

3、函数的调用

(1)调用函数的语法:

函数名();

例如:WoShiHanShu(a,b,c)

其实这些我都懒得写,和python差不多的方法,但是怕有从中间看的,不得不写。

 

(2)特点:

函数体只有在调用的时候才会执行,调用需要()进行调用。可以调用多次(重复使用)

 

4、函数的参数

(1)为什么要有参数

 

(2)语法:

 

(3)形参和实参

形式参数:在声明一个函数的时候,为了函数的功能更加灵活,有些值是固定不了的,对于这些固定不了的值。我们可以给函数设置参数。这个参数没有具体的值,仅仅起到一个占位置的作用,我们通常称之为形式参数,也叫形参。

 

实际参数:如果函数在声明时,设置了形参,那么在函数调用的时候就需要传入对应的参数,我们把传入的参数叫做实际参数,也叫实参。

 

练习:

求1-n之间所有数的和

求n-m之间所有数额和

圆的面积

求2个数中的最大值

求3个数中的最大值

判断一个数是否是素数

 

5、函数的返回值

当函数执行完的时候,并不是所有时候都要把结果打印。我们期望函数给我一些反馈(比如计算的结果返回进行后续的运算),这个时候可以让函数返回一些东西。也就是返回值。函数通过return返回一个返回值

返回值语法:

函数的调用结果就是返回值,因此我们可以直接对函数调用结果进行操作。

 

返回值详解:

如果函数没有显示的使用 return语句 ,那么函数有默认的返回值:undefined

如果函数使用 return语句,那么跟再return后面的值,就成了函数的返回值

如果函数使用 return语句,但是return后面没有任何值,那么函数的返回值也是:undefined

函数使用return语句后,这个函数会在执行完 return 语句之后停止并立即退出,也就是说return后面的所有其他代码都不会再执行。

推荐的做法是要么让函数始终都返回一个值,要么永远都不要返回值。

 

练习:

求阶乘

求1!+2!+3!+....+n!(可用递归)

求一组数中的最大值

求一组数中的最小值

 

 

6、arguments的使用

JavaScript中,arguments对象是比较特别的一个对象,实际上是当前函数的一个内置属性。也就是说所有函数都内置了一个arguments对象,arguments对象中存储了传递的所有的实参。arguments是一个伪数组,因此及可以进行遍历

练习

求任意个数的最大值

求任意个数的和                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 

 

 

7、代码规范

 

(1).命名规范

就不说了,说吐了 

 

(2)变量规范  

    var name = 'zs';   

 

(3)注释规范

    // 这里是注释

 

(4)换行规范

  

 

8、全局变量和局部变量

(1)全局变量

  在任何地方都可以访问到的变量就是全局变量,对应全局作用域

(2)局部变量

  只在固定的代码片段内可访问到的变量,最常见的例如函数内部。对应局部作用域(函数作用域)

 

不使用var声明的变量是全局变量,不推荐使用。

变量退出作用域之后会销毁,全局变量关闭网页或浏览器才会销毁

 

 

9、递归

之前讲过,就是比如阶乘,比如斐波那契

 

程序调用自身的编程技巧称为递归( recursion)。递归做为一种算法在程序设计语言中广泛应用。 一个过程或函数在其定义或说明中有直接或间接调用自身的一种方法,它通常把一个大型复杂的问题层层转化为一个与原问题相似的规模较小的问题来求解,递归策略只需少量的程序就可描述出解题过程所需要的多次重复计算,大大地减少了程序的代码量。递归的能力在于用有限的语句来定义对象的无限集合。一般来说,递归需要有边界条件、递归前进段和递归返回段。当边界条件不满足时,递归前进;当边界条件满足时,递归返回。

 

最好还是学明白,看看斐波那契数列的递归方法:

 

今天作业题有两道递归的,好好做一下理解一下。

 

 

 

四、对象

1、什么是对象

现实生活中:万物皆对象,对象是一个具体的事物,一个具体的事物就会有行为和特征。

举例: 一部车,一个手机

人是一类事物,门口站的那个人才是对象

特征:名字、年龄

行为:吃饭、睡觉

    

 

2、JavaScript中的对象

JavaScript中的对象其实就是生活中对象的一个抽象

JavaScript的对象是无序属性的集合。

其属性可以包含基本值、对象或函数。对象就是一组没有顺序的值。我们可以把JavaScript中的对象想象成键值对,其中值可以是数据和函数。

对象的行为和特征

特征---属性

行为---方法

 

- 事物的特征在对象中用属性来表示。

- 事物的行为在对象中用方法来表示。

 

 

3、对象字面量

在计算机科学中,字面量(literal)是用于表达源代码中一个固定值的表示法(notation)。几乎所有计算机编程语言都具有对基本值的字面量表示,诸如:整数、浮点数以及字符串;而有很多也对布尔类型和字符类型的值也支持字面量表示;还有一些甚至对枚举类型的元素以及像数组、记录和对象等复合类型的值也支持字面量表示法。

 

字面量:11 'abc'  true [] {}等

看着是不是特别像python中的字典,又特别像python中的类,其实就是两个结合版。

 

思考:

如何把学生对象、老师对象、英雄对象改写成字面量的方式

 

 

4、对象创建方式

 

(1)对象字面量(常用)

 

(2) new Object()创建对象 (不常用)

 

(3)工厂函数创建对象(常用!!!!带参数)

 

(4) 自定义构造函数(常用!!!!带参数)

 

 

5、属性和方法

如果一个变量属于一个对象所有,那么该变量就可以称之为该对象的一个属性,属性一般是名词,用来描述事物的特征

 

如果一个函数属于一个对象所有,那么该函数就可以称之为该对象的一个方法,方法是动词,描述事物的行为和功能

   

 

6、new关键字

构造函数,是一种特殊的函数。主要用来在创建对象时初始化对象, 即为对象成员变量赋初始值,总与new运算符一起使用在创建对象的语句中。

 

(1)构造函数用于创建一类对象,首字母要大写。

(2)构造函数要和new一起使用才有意义。

 

new在执行时会做四件事情

(1)new会在内存中创建一个新的空对象

(2)new 会让this指向这个新的对象

(3)执行构造函数  目的:给这个新对象加属性和方法

(4)new会返回这个新对象

   

 

7、this详解

JavaScript中的this指向问题,有时候会让人难以捉摸,随着学习的深入,我们可以逐渐了解。

现在我们需要掌握函数内部的this几个特点

(1)函数在定义的时候this是不确定的,只有在调用的时候才可以确定

(2)一般函数直接执行,内部this指向全局window

(3)函数作为一个对象的方法,被该对象所调用,那么this指向的是该对象

(4)构造函数中的this其实是一个隐式对象,类似一个初始化的模型,所有方法和属性都挂载到了这个隐式对象身上,后续通过new关键字来调用,从而实现实例化

   

 

 

五、对象的使用

1、遍历对象的属性

通过for..in语法可以遍历一个对象

结果:

 

2、删除对象的属性

 

 

六、内置对象

JavaScript中的对象分为3种:内置对象、浏览器对象、自定义对象

JavaScript 提供多个内置对象:Math/Array/Number/String/Boolean...

对象只是带有属性和方法的特殊数据类型。

学习一个内置对象的使用,只要学会其常用的成员的使用(通过查文档学习)

可以通过MDN/W3C来查询

内置对象的方法很多,我们只需要知道内置对象提供的常用方法,使用的时候查询文档

 

1、Math对象

Math对象不是构造函数,它具有数学常数和函数的属性和方法,都是以静态成员的方式提供。

跟数学相关的运算来找Math中的成员(求绝对值,取整)

2、Date对象

创建 Date 实例用来处理日期和时间。Date 对象基于1970年1月1日(世界标准时间)起的毫秒数。

Date构造函数的参数

1. 毫秒数 1498099000356:new Date(1498099000356)

2. 日期格式字符串  '2015-5-1' :new Date('2015-5-1')

3. 年、月、日……:new Date(2015, 4, 1)   // 月份从0开始

 

(1)获取日期的毫秒形式

 

(2)日期格式化方法、

 

 

作业:

1、输入a和n,用递归计算an

我不知道为啥我的return老是那种报错的状态,如果知道的告诉我,程序运行没问题。

 

 

2、第一个人10岁,往后每个人+2岁,问第20个人多少岁,用递归。

 

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值