1.数组Array
数组的含义
数组对象是使用单独的变量名来存储一系列的值。
如果你有一组数据(例如:车名字),存在单独变量如下所示:
var car1="Saab";
var car2="Volvo";
var car3="BMW";
然而,如果你想从中找出某一辆车?并且不是3辆,而是300辆呢?这将不是一件容易的事!
最好的方法就是用数组。
数组可以用一个变量名存储所有的值,并且可以用变量名访问任何一个值。
数组中的每个元素都有自己的的ID,以便它可以很容易地被访问到。
创建数组
创建一个数组,有三种方法。
下面的代码定义了一个名为 myCars的数组对象:
1: 常规方式:
var myCars=new Array();
myCars[0]="Saab";
myCars[1]="Volvo";
myCars[2]="BMW";
2: 简洁方式:
var myCars=new Array("Saab","Volvo","BMW");
3: 字面:
var myCars=["Saab","Volvo","BMW"];
访问数组
通过指定数组名以及索引号码,你可以访问某个特定的元素。
以下实例可以访问myCars数组的第一个值:
var name=myCars[0];
以下实例修改了数组 myCars 的第一个元素:
myCars[0]="Opel";
注意:
[0] 是数组的第一个元素。[1] 是数组的第二个元素。
在一个数组中你可以有不同的对象
所有的JavaScript变量都是对象。数组元素是对象。函数是对象。
因此,你可以在数组中有不同的变量类型。
你可以在一个数组中包含对象元素、函数、数组:
myArray[0]=Date.now;
myArray[1]=myFunction;
myArray[2]=myCars;
简单的数组方法和属性的使用方法
使用数组对象预定义属性和方法:
var x=myCars.length // myCars 中元素的数量
var y=myCars.indexOf("Volvo") // "Volvo" 值的索引值
数组属性
Array 对象方法
2.JavaScript for循环
遍历数组的方式
一般写法:
document.write(cars[0] + "<br>");
document.write(cars[1] + "<br>");
document.write(cars[2] + "<br>");
document.write(cars[3] + "<br>");
document.write(cars[4] + "<br>");
document.write(cars[5] + "<br>");
for循环:
for (var i=0;i<cars.length;i++)
{
document.write(cars[i] + "<br>");
}
``
### 不同类型的循环
JavaScript 支持不同类型的循环:
1. for - 循环代码块一定的次数
2. for/in - 循环遍历对象的属性
3. while - 当指定的条件为 true 时循环指定的代码块
4. do/while - 同样当指定的条件为 true 时循环指定的代码块
### For 循环基本语法
for 循环是您在希望创建循环时常会用到的工具。
下面是 for 循环的语法:
```javascript
for (语句 1; 语句 2; 语句 3)
{
被执行的代码块
}
语句 1 (代码块)开始前执行
语句 2 定义运行循环(代码块)的条件
语句 3 在循环(代码块)已被执行之后执行
实例:
for (var i=0; i<5; i++)
{
x=x + "该数字为 " + i + "<br>";
}
For/In 循环
JavaScript for/in 语句循环遍历对象的属性:
var person={fname:"John",lname:"Doe",age:25};
for (x in person) // x 为属性名
{
txt=txt + person[x];
}
for-of的语法:
for…of 是 ES6 新引入的特性。它既比传统的for循环简洁,同时弥补了forEach和for-in循环的短板。
for-of的语法:
for (var value of myArray) {
console.log(value);
}
for-of 的语法看起来跟 for-in 很相似,但它的功能却丰富的多,它能循环很多东西。
for-of 循环使用例子:
循环一个数组(Array):
let iterable = [10, 20, 30];
for (let value of iterable) {
console.log(value);
}
// 10
// 20
// 30
我们可以使用const来替代let,这样它就变成了在循环里的不可修改的静态变量。
let iterable = [10, 20, 30];
for (const value of iterable) {
console.log(value);
}
// 10
// 20
// 30
循环一个字符串:
let iterable = "boo";
for (let value of iterable) {
console.log(value);
}
// "b"
// "o"
// "o"
循环一个类型化的数组(TypedArray):
let iterable = new Uint8Array([0x00, 0xff]);
for (let value of iterable) {
console.log(value);
}
// 0
// 255
循环一个Map:
let iterable = new Map([["a", 1], ["b", 2], ["c", 3]]);
for (let [key, value] of iterable) {
console.log(value);
}
// 1
// 2
// 3
for (let entry of iterable) {
console.log(entry);
}
// [a, 1]
// [b, 2]
// [c, 3]
循环一个 Set:
let iterable = new Set([1, 1, 2, 2, 3, 3]);
for (let value of iterable) {
console.log(value);
}
// 1
// 2
// 3
循环一个 DOM collection
循环一个DOM collections,比如NodeList,之前我们讨论过如何循环一个NodeList,现在方便了,可以直接使用for-of循环:
// Note: This will only work in platforms that have
// implemented NodeList.prototype[Symbol.iterator]
let articleParagraphs = document.querySelectorAll("article > p");
for (let paragraph of articleParagraphs) {
paragraph.classList.add("read");
}
循环一个拥有enumerable属性的对象
for–of循环并不能直接使用在普通的对象上,但如果我们按对象所拥有的属性进行循环,可使用内置的Object.keys()方法:
for (var key of Object.keys(someObject)) {
console.log(key + ": " + someObject[key]);
}
循环一个生成器(generators)
我们可循环一个生成器(generators):
function* fibonacci() { // a generator function
let [prev, curr] = [0, 1];
while (true) {
[prev, curr] = [curr, prev + curr];
yield curr;
}
}
for (let n of fibonacci()) {
console.log(n);
// truncate the sequence at 1000
if (n >= 1000) {
break;
}
}
3.Math(算数)对象
简单用法:
Math(算数)对象的作用是:执行普通的算数任务。
Math 对象提供多种算数值类型和函数。无需在使用这个对象之前对它进行定义。
使用Math的属性/方法的语法:
var x=Math.PI;
var y=Math.sqrt(16);
注意: Math对象无需在使用这个对象之前对它进行定义。
算数值
JavaScript 提供 8 种可被 Math 对象访问的算数值:
你可以参考如下Javascript常量使用方法:
Math.E
Math.PI
Math.SQRT2
Math.SQRT1_2
Math.LN2
Math.LN10
Math.LOG2E
Math.LOG10E
算数方法
除了可被 Math 对象访问的算数值以外,还有几个函数(方法)可以使用。
下面的例子使用了 Math 对象的 round 方法对一个数进行四舍五入。
document.write(Math.round(4.7));
上面的代码输出为:
5
下面的例子使用了 Math 对象的 random() 方法来返回一个介于 0 和 1 之间的随机数:
document.write(Math.random());
上面的代码输出为:
0.15625646233229462
下面的例子使用了 Math 对象的 floor() 方法和 random() 来返回一个介于 0 和 11 之间的随机数:
document.write(Math.floor(Math.random()*11));
上面的代码输出为:
0
对于伪随机数,JS 有很多种玩法来生成我们所需要的伪随机数。
根据上下限生成随机数:
var rand = (min,max) => Math.round(Math.random()*(max-min))+min;
//Max为最大值,Min为最小值
根据概率随机生成 bool 值:
function randBool(percent=0.5){
//percent为概率,默认0.5(50%)。
if(Math.random()<percent)//如果随机数小于概率值,返回true,否则返回false。
return true;
else
return false;
}
随机生成指定字符:
function randChar(length,characters="abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789"){
//length为所需长度,characters为所包含的所有字符,默认为字母+数字。
characters=characters.split("");//分割字符。
result="";//返回的结果。
while(result.length<length) result+=characters[Math.round(Math.random()*characters.length) - 1];
return result;
}
随机生成字符的另一种玩法:
function randCharAnother(length,rangeMin=0x80,rangeMax=0x7FF){
//length长度,rangeMin为最小Unicode码,rangeMax为最大Unicode码。
result="";
while(result.length<length) result+=String.fromCharCode(Math.round(Math.random()*(rangeMax-rangeMin))-rangeMin);
return result;
}
随机从数组中取出一个东东:
Array.prototype.pick = function(){
//不能为 ()=>{/*函数*/},否则this会指向Window。
return this.length?Math.round(Math.random()*(this.length-1)):undefined;//如果长度为0,返回undefined。
}
4.Date对象
创建Date对象
Date 对象用于处理日期与时间。
创建 Date 对象: new Date()
以下四种方法同样可以创建 Date 对象:
var d = new Date();
var d = new Date(milliseconds);
var d = new Date(dateString);
var d = new Date(year, month, day, hours, minutes, seconds, milliseconds);
Date 对象属性
Date 对象方法
5.几个Date对象的常用方法
getFullYear()
实例
返回一个年份
var d = new Date();
var n = d.getFullYear();
输出结果:
2019
getMonth() 方法
实例
返回月份:
var d = new Date();
var n = d.getMonth();
n 输出结果:
11
getDate()
实例
返回月份的某一天:
var d = new Date();
var n = d.getDate();
n输出结果:
var d = new Date() document.write(d.getDate())
getDay()
实例
返回一周的某一天数字。
var d = new Date();
var n = d.getDay();
n 输出结果
var d=new Date() document.write(d.getDay())
6.String 对象
创建String对象的语法
new String(s);
String(s);
参数
参数 s 是要存储在 String 对象中或转换成原始字符串的值。
返回值
当 String() 和运算符 new 一起作为构造函数使用时,它返回一个新创建的 String 对象,存放的是字符串 s 或 s 的字符串表示。
当不用 new 运算符调用 String() 时,它只把 s 转换成原始的字符串,并返回转换后的值。
String 对象属性
String 对象方法
String对象的描述,有一些注意点
字符串是 JavaScript 的一种基本的数据类型。
String 对象的 length 属性声明了该字符串中的字符数。
String 类定义了大量操作字符串的方法,例如从字符串中提取字符或子串,或者检索字符或子串。
需要注意的是,JavaScript 的字符串是不可变的(immutable),String 类定义的方法都不能改变字符串的内容。像 String.toUpperCase() 这样的方法,返回的是全新的字符串,而不是修改原始字符串。
在较早的 Netscape 代码基的 JavaScript 实现中(例如 Firefox 实现中),字符串的行为就像只读的字符数组。例如,从字符串 s 中提取第三个字符,可以用 s[2] 代替更加标准的 s.charAt(2)。此外,对字符串应用 for/in 循环时,它将枚举字符串中每个字符的数组下标(但要注意,ECMAScript 标准规定,不能枚举 length 属性)。因为字符串的数组行为不标准,所以应该避免使用它。