JavaScript函数、对象和数组
一、JavaScript函数
1.定义函数:函数的通用语法如下
function function_name([parameter [, ...]])
{
statements;
}
- 由关键字function开始函数的定义
- 接着是函数名,它必须由字母或下划线开始,后面可以是一串字母、数字、$符号或下划线
- 必须带有括号,括号里的参数是可选的,多个参数用逗号(,)隔开
- 封闭的大括号中书写函数代码
2.参数数组(arguments):参数数组可以使得在处理多个参数的变量时更灵活。
function displayItems()
{
for(j = 0; j < displayItems.arguments.length; ++j)
document.write(displayItems.arguments[j] + "<br />")
}
3.函数返回值:使用return语句返回函数结果。
document.write(fixNames("the","DALLAS","CowBoys"))
function fixNames()
{
var s = ""
for (var i = 0; i < fixNames.arguments.length; ++i)
{
s += fixNames.arguments[i].charAt(0).toUpperCase() +
fixNames.arguments[i].substr(1).toLowerCase() + " " }
return s.substr(0,s.length-1)
}
上面的代码将输入的字符的首字变为大写,其余字母为小写,并将字符拼接后返回。
如果我们并不想将字符拼接起来,而是返回分离的单个字符,可以使函数返回一个数组:
words = fixNames("the","DALLAS","CowBoys") for(j = 0; j < words.length; ++j)
document.write(words[j] + "<br />") function fixNames()
{
var s = new Array()
for(j = 0; j < fixNames.arguments.length; ++j)
s[j] = fixNames.arguments[j].charAt(0).toUpperCase() +
fixNames.arguments[j].substr(1).toLowerCase()
return s
}
二、JavaScript对象
1.与其他面向对象的编程语言有一点不一样,JavaScript是基于原型的面向对象的语言,不是严格的面向对象的语言。JavaScript中没有传统意义上的类去实例化对象 ,但是为了理解方便,我们可以引入概念上的类。对象可以通过一个叫做构造函数的特殊函数来生成的,我们也可以把这个过程看成是类的声明。下面我们来看看一个具体实例:User类的构造方法。
function User(forename,username,password)
{
this.forename = forename
this.username = username
this.password = password this.showUser = function()
{
document.write("ForeName: " + this.forename + "<br />")
document.write("UserName: " + this.Username + "<br />")
document.write("Password: " + this.password + "<br />")
}
}
该函数与一般的函数有两点不同:
- 它引用一个名为this的对象,当程序通过运行这个函数创建一个User实例时,this引用被创建的实例。
- 在函数内创建一个名为showUser的新函数
我们可以把这个函数看成一个类:USer类
2.创建对象:使用new关键字创建对象
//直接使用new关键字创建对象
detail = new User("Wolfgang","w.a.mozart","composer") //或者创建空的对象,然后再赋值
detail = new User()
detail.forename = "Wolfgang"
detail.username = "w.a.mozart"
detail.password = "composer" //此外,可以为创建好的对象添加新的属性
detail.greeting = "Hello"
3.访问对象:JavaScript也使用句号(.)来访问一个对象的属性和方法,
4.prototype(原型)关键字:使用prototype定义的属性和方法,类似C++中的静态属性和静态方法。所有由这个类实例化的对象共享这个prototype属性或方法,而不会为每个对象都创建一个单独的。可以说,prototype的属性和方法是类所拥有的,类实例化出来的对象拥有的不过是它的一个引用。
function User(forename,username,password)
{
this.forename = forename
this.username = username
this.password = password User.prototype.showUser = function()
{
document.write("ForeName: " + this.forename + "<br />")
document.write("UserName: " + this.Username + "<br />")
document.write("Password: " + this.password + "<br />")
}
}
三、JavaScript数组
1.数组的创建:可以使用new关键字也可以使用缩略形式声明数组,然后使用push方法往数组中添加新的元素;也可以声明有初始化值的数组。
//声明一个空的数组
myarray = new Array()
//或者用缩略形式:myarray = [] //使用push方法往数组中添加新的元素
myarray.push("One")
myarray.push("Two")
myarray.push("Three") //创建由初始化元素的数组
myarray2 = Array("One","Two","Three") //使用length方法获取数组的长度
document.write(myarray.length)
2.关联数组:JavaScript的关联数组和python的字典很像。在JavaScript中创建关联数组需要在一对大括号"{ }"中定义一组元素"key:value",冒号左边的是索引,右边是数组元素对应索引的值。
myarray = {"One":"1",
"Two":"2",
"Three":"3"} for(key in myarray)
document.write(key + " = " +myarray[key] + "<br />")
3.使用数组方法:由于数组的强大作用,JavaScript提供了许多现成的方法来操作数组。
(1).concat方法:可以将两个数组或一个数组中的一系列值连接起来,比如下面的代码会输出"Banana,Grape,Carrot":
fruit = ['Banana','Grape']
document.write(fruit.concat("Carrot"))
(2).forEach方法:用于遍历数组,对数组的每个元素进行操作,使用语法如下
myarray.forEach(function(currentValue, index, arr), thisValue)
参数说明如下:
- function(currentValue, index, arr):必须,数组中每个元素需要调用的函数。
- currentValue:必须,当前元素
- index:可选,当前元素的索引
- arr:可选,当前元素所属的数组对象
- thisValue:可选,传递给函数的值一般用 "this" 值。如果这个参数为空, "undefined" 会传递给 "this" 值
pets = ["Cat","Dog","Rabbit","Hamster"]
pets.forEach(dispaly) function dispaly(element,index,array)
{
document.write("Element at index " + index + "has the value is " + element + "<br />")
}
注意:IE浏览器并不支持forEach方法。
(3).join方法:将数组内所有值转化为字符串,并将它们组合成一个更大的字符串,你可以选择连接的字符,默认是逗号","
pets = ["Cat","Dog","Rabbit","Hamster"]
document.write(pets.join(' '))
//输出结果为:Cat Dog Rabbit Hamster
(4).push和pop方法:push方法用于向数组中添加新的元素,pop方法用于删除数组中最新插入到数组中的元素并将其返回。
(5).reverse方法:将一个数组中的元素颠倒顺序
pets = ["Cat","Dog","Rabbit","Hamster"]
pets.reverse()
更多数组对象的属性和方法,可以参看菜鸟教程的JavaScript手册:JavaScript Array 对象
JavaScript函数、对象和数组的更多相关文章
- javaScript(8)---对象和数组
javaScript(8)---对象和数组 学习要点: 1.Object类型 2.Array类型 3.对象中的方法 什么是对象,其实就是一种类型,即引用类型.而对象的值就是引用类型的实例.在ECMAS ...
- JSON.stringify()方法是将一个javascript值(对象或者数组)转换成为一个JSON字符串;JSON.parse()解析JSON字符串,构造由字符串描述的javascript值或对象
JSON.stringify()方法是将一个javascript值(对象或者数组)转换成为一个JSON字符串:JSON.parse()解析JSON字符串,构造由字符串描述的javascript值或对象
- javaScript遍历对象、数组总结(转载)
javaScript遍历对象.数组总结 转载来源 https://www.cnblogs.com/chenyablog/p/6477866.html 在日常工作过程中,我们对于javaScript遍 ...
- JavaScript 遍历对象、数组总结
在日常工作过程中,我们对于javaScript遍历对象.数组的操作是十分的频繁的,今天抽空把经常用到的方法小结一下,方便今后参考使用! javaScript遍历对象总结 1.使用Objec ...
- javascript 函数对象
http://hi.baidu.com/gdancer/blog/item/a59e2c12479b4e54f919b814.html jQuery的一些写法就是基于这篇文章的原理的.. 函数 ...
- JavaScript 之 对象/JSON/数组
对象 简单说,所谓对象,就是一种无序的数据集合,由若干个“键值对”(key-value)构成. var obj = { p: 'Hello World' }; 上面代码中,大括号就定义了一个对象,它被 ...
- javascript中对象和数组的异同点
一.JS声明对象或数组 JS对象:{ } JS数组:[ ] 对象 var b={m:'123',n:'abc'};alert(b.m);alert(b.n); 一维数组 var a=[1,2,3];a ...
- JavaScript 函数对象(Function 对象)
函数对象 当我们对函数使用 typeof 操作符会返回什么? function f() { console.log('hello') } console.dir(typeof f) // functi ...
- JavaScript判断对象和数组
在调用后端接口时,由于后端接口的不规范统一,接口最外层在没有数据时返回的是空数组(其实更想要的是空json对象,接口返回的data数据应该统一返回json对象,便于扩展),而在有数据时返回的是json ...
- JavaScript笔记:对象及数组
一.对象 在javascript中,对象是拥有属性和方法的一种基本数据类型 1.创建object 创建object实例有如下两种方式: 使用new操作符后跟object构造函数创建,如下代码: var ...
随机推荐
- Android中通过Fragment进行简单的页面切换
首先是activity中的布局 <?xml version="1.0" encoding="utf-8"?> <androidx.constr ...
- 异步处理MultipartFile No such file or directory的分析
背景 项目中开发导入功能,因为数据量比较大,所以要求后端异步操作(个人觉得前端ajax处理最好,有空再试一下).但是操作中发现改为异步之后,相同代码的情况下会报(No such file or dir ...
- Java源码系列2——HashMap
HashMap 的源码很多也很复杂,本文只是摘取简单常用的部分代码进行分析.能力有限,欢迎指正. HASH 值的计算 前置知识--位运算 按位异或操作符^:1^1=0, 0^0=0, 1^0=0, 值 ...
- .net core 3.0+unit of work (一)
1.先将unit of work源码下载 2.引入自己的项目 3.根据原始项目示意在自己项目的startup里注册仓储 由于我不想对每个实体都注册一遍,我使用了泛型仓储(core 2.0好像不支持) ...
- C# 数组冒泡排序复习
using System; namespace runoob { class MyClass { static void Main(string[] args) { MyClass1 myClass ...
- gulp常用插件之gulp-eslint使用
更多gulp常用插件使用请访问:gulp常用插件汇总 ** gulp-eslint**这是一个用于识别和报告在ECMAScript/JavaScript代码中找到的模式的Gulp插件.. 更多使用文档 ...
- Anroid Studio 教程干货
常见设置 a)在Setting中,修改主题.修改工程目录的字体大小. b)在Setting中,显示行号: c)设置注释模板,File–>Other Setting –> Default ...
- 【database】oracle触发器基础
一.oracle触发器基本语法 CREATE [OR REPLACE] TRIGGER trigger_name {BEFORE | AFTER } {INSERT | DELETE | UPDATE ...
- 剑指offer-面试题16-数值的整数次方-数字
/* 题目: 实现函数double Power(double base,int exponent), 求base的exponent次方. */ /* 思路: 本题需要考虑的情况较多: 1.0的负数次方 ...
- javascript 权威指南一
1. JavaScript是面向web(网页)的编程语言. 2.html: 描述网页内容,css:描述网页样式,JavaScript:描述网页行为 3.JavaScript非常适合面向对象和函数式的编 ...