JS基础第二节

作者: 空谷悠 | 来源:发表于2017-01-11 23:13 被阅读20次

一、数组

数组是一个有序列表,所以有下标.

并且数组在js中可以存在任意类型的数据.并且同一个数组中可以存放不同的类型.

获取数组容量可以用length.

1.创建数组

使用Array数组对象来创建数组

定义一个空数组

var    arr1=newArray();

定义一个数组length是20,并且每个元素都是未定义

var    arr2=newArray(20);

多个值代表数组内部元素,而上面的那种写法一个值代表容量

var  arr3=newArray(1,2,3);

使用字面量(语法糖,笑笑语法),来创建数组

var   arr5=[];

var   arr6=[1,2,3,4];

在使用字面量创建数组时,一个值不再代表容量,代表就是一个值。区别于用Array对象创建的数组。

var   arr7=[20];

怎么使用数组:

访问数组元素 语法格式:数组名[下标]

下标从0开始数,到数组容量减去1。不允许越界访问

在很多应用中,不管是遍历数组还是为数组赋值,都离不开for循环。

var   arr2=[];//创建一个空数组

for(var   i=0; i<20; i++) {//循环赋值

arr2[i]=parseInt(Math.random()*(40-20+1)+20)}

2.Math数学对象

Math对象, 针对于数字。

Math随机函数:Math.random() [0,1)之间的浮点数

如果想得到[a,b]的随机整数

var   randomNum = parseInt(Math.random() * (b - a + 1) + a);   //如果不加1,就不能获取到最大值

取最大值

var   a=Math.max(1,5,7);

取最小值

var   a=Math.min(1,5,7);

向上取整

var   num1=Math.ceil(1.1);

向下取整

var   num2=Math.floor(1.1);

四舍五入

var   num3=Math.round(2.5);

绝对值

var    num4=Math.abs(-6);

次方

var    num5=Math.pow(5,2);//第一个数是底数第二个数是幂

//平方根,开平方

var    num6=Math.sqrt(4);

3.数组排序

冒泡排序,双层for循环

原理:冒泡排序名称的缘来是根据气泡排序的原理,通过一趟趟的比较,每一趟可以得到当前趟的最大值

比较相邻两个值的大小关系,如果前面的大于后面的,交换位置

外层循环控制比较的趟数,内层循环控制每一趟比较的次数

//定义一个数组

var  arr=[ ];

for(var    i=0;i<5;i++) {//随机产生一个数组

arr[i]=parseInt(Math.random()*(40-20+1)+20);

}

//从小到大排序,大的在后面,小的在前面(升序)

for(var    i=0;i<arr.length-1;i++) {

for(var     j=0;j<arr.length-i-1;j++) {

//如果前面的大于后面的换位置

if(arr[j]>arr[j+1]) {

var    temp=arr[j];

arr[j]=arr[j+1];

arr[j+1]=temp;

}

}

}

console.log(arr);

4.数组对象

var   arr=[1,2,3,4,5];

在尾部添加元素,push(),返回值为添加的元素之后的数组容量,不管有没有接收返回值,都将元素添加到数组里面

var b=arr.push(6,7,8,9,12,18);

在头部添加元素,unshift(),返回值为添加的元素之后的数组容量,元素的添加位置在数组头部

var count2=arr.unshift(7);

删除尾部元素,pop(),一次只能删一个,返回值为删除的那个数,并且数组本身最后一个元素也被删除

var   count3=arr.pop();

删除头部元素,shift(),一次只能删一个,返回值为删除的那个数,并且数组本身第一个元素也被删除

var   count4=arr.shift();

从指定位置开始删除多少个元素,splice(),返回值为删除的元素组成的数组,返回值是一个数组额!splice既可以进行添加删除的操作,又可以进行替换的操作。splice添加的元素的个数可以不跟删除的元素的个数相同。

var   count5=arr.splice(1,2);

从下标为1的地方删除0个元素,并且新添加的元素从下标为1,返回值没有任何意义,是一个空数组

var  count6=arr.splice(1,0,8,9);

数组排序方法,sort(): 方法能实现数组的排序(按照ASCII表的顺序排序),按照ASCII表的顺序排序,只能挨个数字或者字母比较,所以不行。可以用函数完成对数组的升序和降序。sort()返回值是一个排序之后的数组。

var  arr=[12,8,9,5,3,28];

var   d=arr.sort();

 //console.log(arr.sort())

//console.log(d);

//sort里面封装的有判断语句

function   sort1(a,b){

return    a-b;

}

console.log(arr.sort(sort1))

数组的拼接,concat(): 方法可以实现两个数组的拼接

var newArr=arr.concat(7,12,19);

var   newArr2=arr.concat(arr2);

数组元素之间添加分隔符,join(),将数组分割成字符串

var   arr=[12,8,9];

var    str=arr.join("&");

console.log(str);

5.二维数组

二维数组解决行、列问题,二维数组有行,列概念,二维数组有双下标概念,数组元素是数组

var    var2D=[

[1,2,3],

[4,5,6],

[7,8,9]

];


二、字符串

1.创建字符串

空字符串

var   str= newString();

创建一个hello world

var   str= newString("hello world !");

String()将数字转换为字符串

var    str=String(10);

toString()将数字转换为字符串

var   a=20;

var    str1=a.toString();

2.字符串的操作

charAt():返回字符串的某一位;参数传的值是单个值,数字和字符串都可以

var  str="hello world";

console.log(str.charAt(6));//w

console.log(str.charAt('6'));//w

search: 查找,返回的是位置,如果找不到返回的是-1。得到的是传入的字符串 在原来的字符串的位置,search传入的都是符合正则验证的字符串

indexOf也是查找,可以传入任何类型的字符串

var   str="松江区.泗泾镇.九干路丽德创业园";

console.log(str.search("泗泾镇"));        //4

console.log(str.indexOf("泗泾镇"));       //4

console.log(str.search("."));                  //0

console.log(str.indexOf("."));                //3

字符串的截取:slice方法,传入两个参数,一个代表start,一个代表end。从start位置开始截取,截取到end位置之前的最后一个字符。截取出来的字符串长度为end-start。如果参数为负数,则将负数加上字符串长度,转换成整数之后再进行截取。如果负数的绝对值大于字符串的长度,start按照0算。如果start大于end将返回空字符串。

var   str="hello world";

console.log(str.slice(1,7));

console.log(str.slice(-7,7));

substring和slice的区别,substring参数如果为负数,直接变为0,然后运算。substring两个参数不需要保证前面的一定小于后面的,取两者中小的作为start。

console.log(str.substring(-7,7));

console.log(str.substring(7,4));

substr第一个参数代表起始位置,第二个参数代表截取长度。

console.log(str.substr(3,7));

substring 和 slice如果给定一个参数,将从这个参数开始截取到最后

console.log(str.substring(3));

console.log(str.slice(3));

replace 用第二个参数将第一个参数替换掉

var   str="hello world";

console.log(str.replace("hello","hi"))

split() 方法用于把一个字符串分割成字符串数组,一般和正则一起用。将字符串按照给定的内容精选分割,得到一个数组

console.log(str.split(" "));

空字符串全部分割

console.log(str.split(""));

concat()将一个字符串或多个字符串拼接起来,获得一个新的字符串

+号可以直接拼接,运算符重载

console.log(str.concat("hahaha"));

lastIndexOf()返回最后一个满足条件的下标

indexOf()返回的是第一个满足条件的下标

var     str="hello world hello hello world";

console.log(str.indexOf("hello"));//0

console.log(str.lastIndexOf("hello"));//18


三、Date()日期对象

1.构建日期对象

var    nowDate= new    Date();

console.log(nowDate);          //获取的的是当前时间

console.log(typeof(nowDate));     //object

2.将日期字符串转换为日期对象

日期对象有两种:

yyy/MM/dd hh:mm:ss

yyy-MM-dd hh:mm:ss,在IE下转换失败

如果字符串yyy/MM/dd里面不给定时间,默认时间00:00:00

如果字符串yyy-MM-dd里面不给定时间,默认时间为当前时区时间

var       d= new     Date("2016/11/22 11:52:30");

console.log(d);

var       d= new     Date("2016-11-22 11:52:30");

console.log(d);

var       d= new        Date("2016/11/22");

console.log(d);

var       d= new        Date("2016-11-22");

console.log(d);

3.可以直接给定值

可以单独给的年月日 时分秒 毫秒,

月份给值是0~11的,0代表1月,11代表12月

小时 0~23

分钟,秒0~59

毫秒0~999

var      d= new      Date(1993,0,30);

console.log(d);

var      newD= new       Date(2017,0,1);

console.log(newD);

4.get方法

var     d= newDate();

year=d.getFullYear();//获取4位数的年份

month=d.getMonth();//获取月份,从0开始,0表示1月

Date=d.getDate();//获取月份中的天数,日期

Day=d.getDay();//获取是周几,从0开始,0是周天

hour=d.getHours();//获取小时

Minutes=d.getMinutes();//获取分钟

second=d.getSeconds();//获取秒

m=d.getMilliseconds();//获取毫秒

time=d.getTime();//获取从1970年1月1日到现在的毫秒数

console.log(year);

console.log(month);

console.log(Date);

console.log(Day);

console.log(hour);

console.log(Minutes);

console.log(second);

console.log(m);

console.log(time);

5.日期对象的设置方法

通过set方法可以将日期对象中的某一个值改掉

var   myDate= new      Date();

myDate.setFullYear(2017);

console.log(myDate);

myDate.setMonth(1);

console.log(myDate);

6.日期对象转换为字符串对象的方法

var   myDate= new    Date();

console.log(myDate.toString());

console.log(myDate.toLocaleString())

7.日期对象的两个静态方法

快捷获取当前日期和1970.1.1之间 的毫秒数

console.log(Date.now());

快捷获取某一个日期与1970.1.1之间 的毫秒数

console.log(Date.parse("2016/11/22 15:23:00"));


四、函数

定义:函数就是有特定功能的代码段

分类:函数从定义的角度分,分为库函数和自定义函数

库函数:Math.random()   Array slice()     string substring()   Date    getTime()......

系统提供的函数远远满足不了我们的需求,所以我们需要自定义函数

函数的结构:定义函数的关键字 function,函数名,参数部分(),没有参数()也不能省略,函数主体部分,大括号内部的内容

function    alertHello() {

alert("hello");

}

在函数中,想要定义一个函数,如果什么是未知的,就将什么声明为参数

使用函数,函数的调用,

1.自定义函数的分类

自定义函数的分类 从两方面考虑:返回值(就是函数的内部返回到外界的结果)和 参数

有参有返,参数与参数之间使用逗号隔开

function    sum(num1,num2) {

//返回外界值,使用关键字return

return     num1+num2;

//return之后的语句都不会执行

num1++;

num2++;

}

//声明一个变量接收返回值

var   result=sum(10,20);

console.log(result);

function   sum(num1,num2) {

num1++;

num2++;

return    num1+num2;

}

var   n1=10,n2=20;

var      result=sum(n1, n2);

console.log(result);//32

console.log(n1, n2);//10      20 //函数调用过程中,只会发生单纯的值传递,形参会拷贝实参的值

有参数无返回值

function   printNumber(num) {//定义函数

console.log(num);

}

printNumber(1);//函数调用

无参数有返回值

function    getStuCount() {

return   28;

}

var   stuCount=getStuCount();

console.log(stuCount);

无参数无返回值

function     helloWorld(){

alert("hello world");

}

helloWorld();

调用函数中,为了让函数正确执行,就算没有参数,()也不能省略

2.函数的作用域

var       a=10;//全局变量

//函数的作用域

function      test() {

var       b=10;//局部变量

alert(a++);

}

test();//10

全局变量必须在调用函数的位置之前,才能被使用。定义在函数内部的变量叫局部变量,生命周期为函数的生命周期,当函数执行完之后就会被回收,所以函数外界不能使用函数内部的变量。

独立于函数存在的变量叫做全局变量,当页面关闭时才会被回收。所以说函数内部可以访问外界全局变量,但是必须保证声明必须在使用之前。当出现全局变量与局部变量重名时,就近原则。

全局变量和局部变量只针对于函数,对于for循环不适用。

3.匿名函数

匿名函数就是没有名的函数,可以直接执行,不需要调用

如果想要匿名函数产生函数名,就要定义一个变量来接收,这个变量就是函数名,调用这个变量就可以执行函数。

btn.onclick=function() {

alert("哈哈哈");

}

var      fn=function() {//如果匿名函数想要名,

alert("呵呵");

}

fn();

4、函数递归

递归一定要有出口,否则将无限执行 内存崩溃

求5的阶乘

function     fact(num){

if(num==1) {

return    1;

}else{

return    num*fact(num-1);

}

}

var    result=fact(5);

console.log(result);

相关文章

  • JS基础第二节

    一、数组 数组是一个有序列表,所以有下标. 并且数组在js中可以存在任意类型的数据.并且同一个数组中可以存放不同的...

  • React-Native 随笔

    学习基础: js的基础知识, rect.js基础 JSX语法基础 FlexBox布局 安装 安装node.js下载...

  • 最新web前端相关课程学习链接

    js基础篇 js进阶篇 js高级篇 vue基础篇 vue高级篇 react基础 react高级 Nodejs基础 ...

  • web前端 -- Day23 js高级

    js基础 JavaScript简称:JS JS分三个部分: ECMAScript标准---基础的语法 DOM D...

  • 前端JavaScript面试技巧

    1-1 课程概述 要做什么?——讲解前端 JS 基础面试题 哪些部分?——JS 基础,JS-WEB-API,JS ...

  • 4/07day28_js基础

    day28_js基础 回顾 JS基础语法 JS运算符 JS流程控制语句 条件语句 JS的条件语句和Java语法基本...

  • 2018-12-20

    1.01.尚硅谷_JS基础_JS简介(1) 10.10.尚硅谷_JS基础_Null和Undefined(10) 1...

  • JS基础和WebAPIs的关联性

    学习ECMAscript标准规定的基本语法掌握JS基础语法只学习JS基础做不了网页交互效果学习JS基础语法是为了后...

  • 2019-07-27 前端面试题

    1.js的基础类型 js的基础类型包括 Undefined , Null , String ,Number ,...

  • 网络编程(十九) JavaScript(9)

    一、 JS的组成 1.1 JS基础阶段以及Web APIs阶段 【1】JS基础阶段 我们学习的生死ECMAScri...

网友评论

    本文标题:JS基础第二节

    本文链接:https://www.haomeiwen.com/subject/yetdbttx.html