0530JavaScript基础2

常用内置对象

所谓内置对象就是ECMAScript提供出来的一些对象,我们知道对象都是有相应的属性和方法

数组Array(部分相当于列表)

1.数组的创建方式

var colors = ['red','color','yellow'];

使用构造函数(后面会讲)的方式创建 使用new关键词对构造函数进行创建对象

 var colors2 = new Array();

2.数组的赋值

var arr = [];
//通过下标进行一一赋值
arr[0] = 123;
arr[1] = '哈哈哈'; arr[2] = '嘿嘿嘿'

3.数组的常用方法

3.1 数组的合并 concat()
var north = ['北京','山东','天津']; var south = ['东莞','深圳','上海']; var newCity = north.concat(south); console.log(newCity)
3.2 join() 将数组中的元素使用指定的字符串连接起来,它会形成一个新的字符串
var score = [98,78,76,100,0]; var str = score.join('|'); console.log(str);//98|78|76|100|0
3.3 将数组转换成字符串 toString()
var score = [98,78,76,100,0]; //toString() 直接转换为字符串 每个元素之间使用逗号隔开 var str = score.toString(); console.log(str);//98,78,76,100,0
3.4 slice(start,end); 返回数组的一段,左闭右开
var arr = ['张三','李四','王文','赵六']; var newArr = arr.slice(1,3); console.log(newArr);//["李四", "王文"]
3.5 pop 移除数组的最后一个元素
var arr = ['张三','李四','王文','赵六']; var newArr = arr.pop(); console.log(newArr);//["张三", "李四","王文"]
3.6 push() 向数组最后添加一个元素
var arr = ['张三','李四','王文','赵六']; var newArr = arr.push('小马哥'); console.log(newArr);//["张三", "李四","王文","赵六","小马哥"]
3.7 reverse() 翻转数组
var names = ['alex','xiaoma','tanhuang','angle']; //4.反转数组 names.reverse(); console.log(names);
3.8 sort对数组排序
var names = ['alex','xiaoma','tanhuang','abngel']; names.sort(); console.log(names);// ["alex", "angle", "tanhuang", "xiaoma"]

 3.9 判断是否为数组:isArray()

布尔类型值 = Array.isArray(被检测的值) ;

字符串String

4.1 chartAt() 返回指定索引的位置的字符

var str = 'alex';
var charset = str.charAt(1);
console.log(charset);//l

4.2 concat 返回字符串值,表示两个或多个字符串的拼接

var str1 = 'al';
var str2  = 'ex';
console.log(str1.concat(str2,str2));//alexex

4.3 replace(a,b) 将字符串a替换成字符串b

var a = '1234567755';
var newStr = a.replace("4567","****");
console.log(newStr);//123****755

4.4 indexof() 查找字符的下标,如果找到返回字符串的下标,找不到则返回-1 。跟seach()方法用法一样

var str = 'alex';
console.log(str.indexOf('e'));//2
console.log(str.indexOf('p'));//-1

4.5 slice(start,end) 左闭右开 分割字符串

var str = '小马哥';
console.log(str.slice(1,2));//

4.6 split('a',1) 以字符串a分割字符串,并返回新的数组。如果第二个参数没写,表示返回整个数组,如果定义了个数,则返回数组的最大长度

var  str =  '我的天呢,a是嘛,你在说什么呢?a哈哈哈';
console.log(str.split('a'));//["我的天呢,", "是嘛,你在说什么呢?", "哈哈哈"]

4.7 substr(statr,end) 左闭右开

var  str =  '我的天呢,a是嘛,你在说什么呢?a哈哈哈';
console.log(str.substr(0,4));//我的天呢

4.8 toLowerCase()转小写

var str = 'XIAOMAGE';
console.log(str.toLowerCase());//xiaomage

4.9 toUpperCase()转大写

var str = 'xiaomage';
console.log(str.toUpperCase());

特别:

//1.将number类型转换成字符串类型
var num = 132.32522;
var numStr = num.toString() console.log(typeof numStr)
//四舍五入
var newNum = num.toFixed(2)
console.log(newNum)

 Date日期对象

创建日期对象只有构造函数一种方式,使用new关键字

//创建了一个date对象
var myDate = new Date();

 //创建日期对象
var myDate=new Date();
        
//获取一个月中的某一天
console.log(myDate.getDate());

//返回本地时间
console.log(myDate().toLocalString());//2018/5/27 下午10:36:23

 Math 内置对象

6.1 Math.ceil() 向上取整,'天花板函数'

var x = 1.234;
//天花板函数  表示大于等于 x,并且与它最接近的整数是2
var a = Math.ceil(x); console.log(a);//2

6.2 Math.floor 向下取整,'地板函数'

var x = 1.234;
// 小于等于 x,并且与它最接近的整数 1
var b = Math.floor(x); console.log(b);//1

6.3 求两个数的最大值和最小值

//求 两个数的最大值 最小值
console.log(Math.max(2,5));//5
console.log(Math.min(2,5));//2

6.4 随机数 Math.random()

var ran = Math.random();
console.log(ran);[0,1)

如果让你取100-200之间的随机数,怎么做?

背过公式:min - max之间的随机数: min+Math.random()*(max-min)

 函数

函数:就是将一些语句进行封装,然后通过调用的形式,执行这些语句。

函数的作用:

  • 将大量重复的语句写在函数里,以后需要这些语句的时候,可以直接调用函数,避免重复劳动。

  • 简化编程,让编程模块化。

console.log("hello world");sayHello();     //调用函数//定义函数:function sayHello(){console.log("hello");console.log("hello world");}

第一步:函数的定义

函数定义的语法:

 function 函数名字(){}

解释如下:

  • function:是一个关键字。中文是“函数”、“功能”。

  • 函数名字:命名规定和变量的命名规定一样。只能是字母、数字、下划线、美元符号,不能以数字开头。

  • 参数:后面有一对小括号,里面是放参数用的。

  • 大括号里面,是这个函数的语句。

第二步:函数的调用

函数调用的语法:

 函数名字();

函数的参数:形参和实参

函数的参数包括形参和实参

注意:实际参数和形式参数的个数,要相同。

sum(3,4);sum("3",4);sum("Hello","World");//函数:求和function sum(a, b) {console.log(a + b);}

函数的返回值

console.log(sum(3, 4));//函数:求和function sum(a, b) {return a + b;}

伪数组 arguments

arguments代表的是实参。有个讲究的地方是:arguments只在函数中使用

(1)返回函数实参的个数:arguments.length

例子:

    fn(2,4);fn(2,4,6);fn(2,4,6,8);function fn(a,b,c) {console.log(arguments);console.log(fn.length);         //获取形参的个数 console.log(arguments.length); //获取实参的个数  console.log("----------------"); }

结果:

(2)之所以说arguments是伪数组,是因为:arguments可以修改元素,但不能改变数组的长短。举例:

    fn(2,4);fn(2,4,6);fn(2,4,6,8);function fn(a,b) {arguments[0] = 99;  //将实参的第一个数改为99 arguments.push(8); //此方法不通过,因为无法增加元素 }

清空数组的几种方式:

   var array = [1,2,3,4,5,6];array.splice(0);      //方式1:删除数组中所有项目array.length = 0;     //方式1:length属性可以赋值,在其它语言中length是只读 array = []; //方式3:推荐

关于DOM的事件操作 

一、JavaScript的组成

JavaScript基础分为三个部分:

  • ECMAScript:JavaScript的语法标准。包括变量、表达式、运算符、函数、if语句、for语句等。

  • DOM:文档对象模型,操作网页上的元素的API。比如让盒子移动、变色、轮播图等。

  • BOM:浏览器对象模型,操作浏览器部分功能的API。比如让浏览器自动滚动。

二、事件

JS是以事件驱动为核心的一门语言。

事件的三要素

事件的三要素:事件源、事件、事件驱动程序

比如,我用手去按开关,灯亮了。这件事情里,事件源是:手。事件是:按开关。事件驱动程序是:灯的开和关。

再比如,网页上弹出一个广告,我点击右上角的X,广告就关闭了。这件事情里,事件源是:X。事件是:onclick。事件驱动程序是:广告关闭了。

于是我们可以总结出:谁引发的后续事件,谁就是事件源。

总结如下:

  • 事件源:引发后续事件的html标签。

  • 事件:js已经定义好了(见下图)。

  • 事件驱动程序:对样式和html的操作。也就是DOM。

代码书写步骤如下:(重要)

  • (1)获取事件源:document.getElementById(“box”); //类似与ios语言的 UIButton *adBtn = [UIButton buttonWithType:UIButtonTypeCustom];

  • (2)绑定事件: 事件源box.事件onclick = function(){ 事件驱动程序 };

  • (3)书写事件驱动程序:关于DOM的操作

 

转载于:https://www.cnblogs.com/Mr-Murray/p/9113938.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/266967.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

.net mvc 超过了最大请求长度 限制文件上传大小

在我们的项目中遇到"超过了最大请求长度"如下图所示,是因为IIS默认请求长度4M,当请求长度大于这个值的时候报错,下面是解决方案. 解决方案:修改web.config文件 1、注意在mvc中有两个web.config文件,如下图,一个位于Views下,是用来控…

分布式之缓存击穿

什么是缓存击穿 在谈论缓存击穿之前,我们先来回忆下从缓存中加载数据的逻辑,如下图所示 因此,如果黑客每次故意查询一个在缓存内必然不存在的数据,导致每次请求都要去存储层去查询,这样缓存就失去了意义。如果在大流量…

(转)VS2010 快捷键

之前写代码很少用到快捷键,感觉用鼠标也一样,但是还是觉得能熟练用快捷键的人很牛一样的,相信很多人也有我一样的想法的,现在我还是觉得记些快捷键还是很有必要的(或者是为了看起来更牛点吧 ), 所以这样转载下VS2010快…

arcgis建立拓扑分析(检验矢量图)

目的:矢量图画好后,检查是否有伪节点,悬挂节点等,线要素和面要素都可以检查。伪节点,两条线应该相交但是画的没相交;悬挂节点,两条线看似相交了但是没有节点,因此路径不同&#xff0…

oracle11g导出dmp文件 少表,Oracle11g导出dmp并导入Oracle10g的操作记录

Oracle11g导出dmp并导入Oracle10g的操作记录。操作环境说明:Oracle11g环境:Windows7,Oracle Database 11g Enterprise Edition Release 11.2.0.1.0,ZHS16GBK。Oracle10g环境:中标麒麟,Oracle Database 10g …

完整国内城市js级联选择

js代码: View Code var china [//直辖市[北京市],[上海市],[天津市],[重庆市],//华北地区[河北省,石家庄,唐山,秦皇岛,邯郸,邢台,保定,张家口,承德,沧州,廊坊,衡水],[山西省,太原,大同,阳泉,长治,晋城,朔州,晋中,运城,忻州,临汾,吕梁],[内蒙古自治区,呼和浩特,包头,乌海,赤峰…

302重定向问题

在把原有的项目迭代以后出现了访问原有域名: abc.dex 不能访问的情况(注意:这种情况时而能访问,时而不能访问) 必须访问:abc.dex /login.index才能登陆 下面是抓取网络状态的截图: SLB在做…

2017级面向对象程序设计——团队作业1

这是一股来自青青草原的神秘力量 团队信息 团队名称 青青草原战队队伍成员 阮君曦 031702116(队长)史恩泽 031702122蓝飞鹏 031702112张凌昕 031702105林鑫 031702138团队合照人物属性 阮君曦(懒羊羊) 风格: 一旦进入学习状态便一发不可收拾。…

雅礼集训 2017 Day1

T1:loj 6029 市场 题目大意: 维护一个数据结构支持区间加 区间除法 区间求最小值 区间求和 思路: 用线段树维护区间加 区间求最小值 区间和 对于区间除法 注意到除数d很大而加法的w很小 尝试将区间除法变成区间减法 可以转化成减法的情况就是…

多行文本框

2019独角兽企业重金招聘Python工程师标准>>> #-*- coding: UTF-8 -*- import wxclass TextFrame(wx.Frame):def __init__(self):wx.Frame.__init__(self,None,-1,u多行文本框,size(250,150))panelwx.Panel(self,-1)multiTextwx.TextCtrl(panel,-1,"Python is a…

Directx11教程(55) 建立球形和锥形物体

本教程中,我们新建2个model class,SphereModelClass以及CylinderModelClass,分别用来表示球形和锥形物体。 程序执行后的界面如下: 线框模式界面如下: 从线框模式可以看出,球形是由三个因素决定:半径、经度…

JAVA基础学习之路(十一)引用传递

引用传递: 不同栈内存可以指向同一块堆内存,不同栈内存可以对一块堆内存进行修改 范例一: class Message {private int num 10;public Message(int num) {this.num num;}public void setNum(int num) {this.num num;}public int getNum() …

php常见数据类型转换与判断

2019独角兽企业重金招聘Python工程师标准>>> 强制类型转换问题: (array) false > array(0>) (array) true > array(0>1) (array) null >array( ) 进行类型转…

Maven deploy部署jar到远程私服仓库

一、配置私服账号密码 修改maven配置文件,在$MAVEN_HOME/conf/setting.xml中增加如下配置: 注意,这里配置的id为releases何snapshots,当然可以改为其他,先记得这里有过id的配置,后面有用 二、配置远程发布到…

linux系统etc什么意思,etc.是什么意思 linux下的etc是什么意思

Etc是Electronic the collection的缩写,指电子不停车收费系统,是指车辆在通过收费站时通过车上安装的Etc车载系统与收费站之间微波通讯,进行车辆识别,再联合网络和银行进行自动扣费的一种新型收费模式。电子不停车收费系统(英语&a…

万里长征,始于足下——菜鸟程序员的学习总结

最近一直的谈论如何学习,如何做笔记,学习方法是否正确?(发现问题——创新的原动力)为什么开始系统化学习了,反而暴露许许多多的问题?细想也并不是很多,这都是过去的遗留问题&#xf…

SSM整合笔记

SSM整合笔记 1&#xff0c;创建maven项目 创建maven项目过程省略 ps&#xff1a;如果创建完maven项目之后项目报错&#xff0c;可能是没有配置Tomcat 2&#xff0c;在pom.xml里面导入相应的jar的依赖 <project xmlns"http://maven.apache.org/POM/4.0.0"xmlns:xsi…

linux jetty 安装目录结构,Linux下Jetty 9安装部署

Jetty简介Jetty是一个开源的servlet容器&#xff0c;它为基于Java的web内容&#xff0c;例如JSP和servlet提供运行环境。Jetty是使用Java语言编写的&#xff0c;它的API以一组JAR包的形式发布。开发人员可以将Jetty容器实例化成一个对象&#xff0c;可以迅速为一些独立运行(sta…

Bootstrap 学习笔记8 下拉菜单滚动监听

代码部分&#xff1a; <nav class"navbar navbar-default"><a href"#" class"navbar-brand">web开发</a><ul class"nav navbar-nav"><li><a href"#html5">HTML5</a></li>&…

怎么在linux的cmd中运行c项目,如何在cmd窗口编译运行c语言程序?

/这个很简单&#xff0c;只需要下载一个C/C编译器&#xff0c;添加一下环境变量&#xff0c;之后就能在cmd窗口中编译运行C语言程序了&#xff0c;下面我简单介绍一下实现过程&#xff0c;主要内容如下&#xff1a;1.下载C/C编译器&#xff0c;这里可以下载MinGW&#xff0c;包…