1 变量

  1.1 变量的声明

    利用var关键字来声明变量,例如:

    var a = 100;
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>JavaScriptTest</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="" rel="stylesheet"> <!-- <script src="/js/jquery.js"></script> -->
<script src="http://cdn.static.runoob.com/libs/jquery/2.0.0/jquery.min.js"></script>
<script>
var a = 100;
function test01() {
alert("变量a的值为:" + a);
}
</script> </head>
<body>
<p id="testP">Hello Boy</p> <button id="test" onClick="test01()">测试按钮</button><br /> <script> </script> </body>
</html>

  1.2 变量的作用域

    1.2.1 局部作用域

      在函数中声明的作用域叫做局部作用域

    1.2.2 全局作用域

      在函数之外声明的作用与叫做全局作用域

    1.2.3 区别

      局部作用域中可以获取全局变量,但是局部变量只能在局部作用域中使用,即:局部变量只能在声明它的方法中使用

      

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>JavaScriptTest</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="" rel="stylesheet"> <!-- <script src="/js/jquery.js"></script> -->
<script src="http://cdn.static.runoob.com/libs/jquery/2.0.0/jquery.min.js"></script>
<script>
var a = "全局变量a";
function test01() {
var b = "局部变量b";
alert("test01方法 -> " + a);
alert("test01方法 -> " + b);
}
function test02() {
alert("test02方法 -> " + a);
alert("test02方法 -> " + b);
}
</script> </head>
<body>
<p id="testP">Hello Boy</p> <button id="test01" onClick="test01()">测试按钮01</button><br />
<button id="test02" onClick="test02()">测试按钮02</button> <script> </script> </body>
</html>

      坑01:在局部作用域中如果使用的变量未i进行声明操作就会到全局中去寻找对应的全局变量,如果没找到就会创建一个全局变量

      

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>JavaScriptTest</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="" rel="stylesheet"> <!-- <script src="/js/jquery.js"></script> -->
<script src="http://cdn.static.runoob.com/libs/jquery/2.0.0/jquery.min.js"></script>
<script>
var a = "全局变量a";
function test01() {
b = "Hello Boy"
alert("test01方法 -> " + a);
alert("test01方法 -> " + b);
}
function test02() {
alert("test02方法 -> " + a);
alert("test02方法 -> " + b);
}
</script> </head>
<body>
<p id="testP">Hello Boy</p> <button id="test01" onClick="test01()">测试按钮01</button><br />
<button id="test02" onClick="test02()">测试按钮02</button> <script> </script> </body>
</html>

2 数组

  2.1 数组的声明

    2.1.1 利用 Array 对象进行声明

var list01 = new Array();

    2.1.2 利用 [ ] 进行声明

var list01 = [];

  2.2 数组的赋值

    数组名[数组元素索引]

list01[0] = "warrior";
list01[4] = "fury";

    坑01:中间为进行初始化的数组元素自动赋值为 undefined

  2.3 数组的声明和赋值

    2.3.1 利用 Array 对象实现

var list01 = new Array("warrior", "fury", "重庆火锅");

    2.3.2 利用 [ ] 实现

var list01 = ["warrior", "fury", "重庆火锅", "小面"];
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>JavaScriptTest</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="" rel="stylesheet"> <!-- <script src="/js/jquery.js"></script> -->
<script src="http://cdn.static.runoob.com/libs/jquery/2.0.0/jquery.min.js"></script>
<script>
var list01 = ["warrior", "fury", "重庆火锅", "小面"];
function test01() {
for (var i = list01.length - 1; i >= 0; i--) {
console.log(list01[i]);
}
}
function test02() { }
</script> </head>
<body>
<p id="testP">Hello Boy</p> <button id="test01" onClick="test01()">测试按钮01</button><br />
<button id="test02" onClick="test02()">测试按钮02</button> <script> </script> </body>
</html>

3 对象

  3.1 对象的声明

    3.1.1 利用 Object

var obj = new Object()

    3.1.2 利用 { }

var obj = {};

  3.2 对象的赋值

    obj.name = "warrior";
obj.address = "重庆市";

  3.3 对象的声明和赋值

    3.3.1 利用Object

    var obj = new Object({
name: "warrior",
address: "重庆",
age: 123
});

    3.3.2 利用 { }

    var obj = {
name: "warrior",
address: "重庆"
};

4 方法

    function onCompute() {
alert("hello boy");
var a = document.getElementById("a");
var b = document.getElementById("b");
document.getElementById("result").value = Number(a.value) + Number(b.value);
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>JavaScriptTest</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="" rel="stylesheet"> <!-- <script src="/js/jquery.js"></script> -->
<script src="http://cdn.static.runoob.com/libs/jquery/2.0.0/jquery.min.js"></script>
<script> function onCompute() {
alert("hello boy");
var a = document.getElementById("a");
var b = document.getElementById("b");
document.getElementById("result").value = Number(a.value) + Number(b.value);
} function test01() {
}
function test02() { }
</script> </head>
<body>
<input type="number" id="a" placeholder="加数01" />
&nbsp;
<span> + </span>
&nbsp;
<input type="number" id="b" placeholder="加数02" />
&nbsp;
<span> = </span>
&nbsp;
<input type="number" id="result" placeholder="结果" />
&nbsp;
<button id="compute" onclick="onCompute()">计算</button>
<hr /> <button id="test01" onClick="test01()">测试按钮01</button><br />
<button id="test02" onClick="test02()">测试按钮02</button> <script> </script> </body>
</html>

  4.1 有参方法

    坑01:由于JavaScript是动态类型语言,所以在定义方法时的形参不用指定类型,用合法的变量名指明就行啦

    function test01(a, b) {
alert(a);
alert(b);
}

  4.2 带返回值的方法

    function test02(a, b) {
alert(test03(a, b));
}
function test03(a, b) {
return a + b;
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>JavaScriptTest</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="" rel="stylesheet"> <!-- <script src="/js/jquery.js"></script> -->
<script src="http://cdn.static.runoob.com/libs/jquery/2.0.0/jquery.min.js"></script>
<script> function onCompute() {
alert("hello boy");
var a = document.getElementById("a");
var b = document.getElementById("b");
document.getElementById("result").value = Number(a.value) + Number(b.value);
} function test01(a, b) {
alert(a);
alert(b);
}
function test02(a, b) {
alert(test03(a, b));
}
function test03(a, b) {
return a + b;
}
</script> </head>
<body>
<input type="number" id="a" placeholder="加数01" />
&nbsp;
<span> + </span>
&nbsp;
<input type="number" id="b" placeholder="加数02" />
&nbsp;
<span> = </span>
&nbsp;
<input type="number" id="result" placeholder="结果" />
&nbsp;
<button id="compute" onclick="onCompute()">计算</button>
<hr /> <button id="test01" onClick="test01('warrior', '重庆')">测试按钮01</button><br />
<button id="test02" onClick="test02(1, 2)">测试按钮02</button> <script> </script> </body>
</html>

  4.3 实例效果

    

ES02 变量、数组、对象、方法的更多相关文章

  1. Objective-C 类,实例成员,静态变量,对象方法,类方法(静态方法),对象,

    Objective-C 类,实例成员,静态变量,对象方法,类方法(静态方法),对象, 一.类 在ios中,类的声明和实现时分离的,也就是说不能写在同一个文件中,声明放在 .h文件中,实现放在 .m 文 ...

  2. javascript变量 数组 对象

    一 变量 1.全局变量和局部变量 在JavaScript中同一个变量可以反复赋值,而且可以是不同类型的变量,但是要注意只能用var声明一次.这种变量类型不固定的语言称为动态语言,与之对应的静态语言,如 ...

  3. JavaScript数组对象方法

    数组的方法:首先,数组的方法有数组原型方法,也有从object对象继承来的方法.这里只详细说明一下数组的原型方法. (1)join:把数组中的所有元素放入一个字符串.元素通过指定的分隔符进行分隔. 例 ...

  4. jQuery根据元素值或元素下标来删除一个数组元素及数组对象方法列表

    在前提不知道b在这个数组的下标,删除b这个元素  var arrList = ['a','b','c','d'];         arrList.splice(jQuery.inArray('b', ...

  5. Array数组对象方法

    Array 对象方法 方法 描述 concat() 连接两个或更多的数组,并返回结果. copyWithin() 从数组的指定位置拷贝元素到数组的另一个指定位置中. entries() 返回数组的可迭 ...

  6. foreach-- for循环的增强型:for(类型 变量 : 数组对象) { 使用变量 }

    /* * foreach:增强for循环,一般用于遍历集合或者数组 * 格式: * for(元素的类型 变量 : 集合或者数组对象) { * 可以直接使用变量; * } 注意:在增强for循环中不能修 ...

  7. js数组对象方法

  8. js对数组对象的操作以及方法的使用

    js对数组对象的操作以及方法的使用 如何声明创建一个数组对象: var arr = new Array(); 或者 var arr = []; 如何移除所有数组中数据? arrayJson.dataL ...

  9. java基础(6)--数组和方法

    数组 1. 什么是数组? 数组是相同数据类型的元素组成的集合.这些元素按线性顺序排列.所谓线性顺序是指除第一个元素外,每一个元素都有唯一的前驱元素:除最后一个元素外,每一个元素都有唯一的后继元素.(“ ...

  10. js遍历数组对象和非数组对象

    //---------for用来遍历数组对象 var i,myArr = ["a","b","c"]; ; i < myArr.len ...

随机推荐

  1. 分布式_事务_01_2PC框架raincat快速体验1

    一.前言 关于2PC的理论知识请见:分布式_理论_03_2PC 这一节我们来看下github上一个优秀的2PC分布式事务开源框架的快速体验. 二.源码 源码请见: https://github.com ...

  2. 条款52:谢了placement new 也就同时应该写一个placement delete

    如果operator new接收到的参数除了size_t之外还有其他的话,那么这个operator new实际上就是一个placement new,所以考虑下下面这样的情况: 一个可以用来记录信息的p ...

  3. skynet源码阅读<5>--协程调度模型

    注:为方便理解,本文贴出的代码部分经过了缩减或展开,与实际skynet代码可能会有所出入.    作为一个skynet actor,在启动脚本被加载的过程中,总是要调用skynet.start和sky ...

  4. mysql出现mysql server has gone away错误的解决办法

    应用程序(比如PHP)长时间的执行批量的MYSQL语句.执行一个SQL,但SQL语句过大或者语句中含有BLOB或者longblob字段.比如,图片数据的处理.都容易引起MySQLserver has ...

  5. Smarty的模板中不允许PHP的代码?

    /****************************************************************************** * Smarty的模板中不允许PHP的代 ...

  6. java web service 上传下载文件

    1.新建动态web工程youmeFileServer,新建包com,里面新建类FileProgress package com; import java.io.FileInputStream; imp ...

  7. Unity3D for Android 纹理压缩支持

    http://blog.csdn.net/asd237241291/article/details/48548557 首先附图:Unity3D for Android支持的纹理压缩格式 纹理压缩可以通 ...

  8. NSString *const 和 const NSString * 的区别

    1.变量存储的指针可变,变量存储的值不可变 //A modifiable pointer to a constant NSString (its value can't be modified) &q ...

  9. [转]浅谈Web缓存

    在前端开发中,性能一直都是被大家所重视的一点,然而判断一个网站的性能最直观的就是看网页打开的速度.其中提高网页反应速度的一个方式就是使用缓存.一个优秀的缓存策略可以缩短网页请求资源的距离,减少延迟,并 ...

  10. python3入门

    简介 计算机基本概念与程序设计语言分类 python风格指南 基础语法 python3 基础语法:基本输入输出 python3 基础语法:标识符和保留字 python3 基础语法:注释 python3 ...