web学习 -- JavaScript 数字和数组_document.getelementbyid("demo").innerhtml = cars[0-CSDN博客

本文链接：https://blog.csdn.net/qq_39273039/article/details/107606223

数字

JavaScript 只有一种数值类型
书写数值的时候小树点可选

var x = 3.14;    // 带小数点的数值
var y = 3;       // 不带小数点的数值

超大或超小的书可以用科学计数法来写

var x = 123e5;    // 12300000
var y = 123e-5;   // 0.00123

64 位浮点数

JavaScript 数值始终以双精度浮点数来存储，根据国际 IEEE 754 标准。

此格式用 64 位存储数值，其中 0 到 51 存储数字（片段），52 到 62 存储指数，63 位存储符号
在这里插入图片描述
精度：
整数（不使用指数或科学计数法）会被精确到 15 位。

var x = 999999999999999;   // x 将是 999999999999999
var y = 9999999999999999;  // y 将是 10000000000000000

小数的最大数是 17 位，但是浮点的算数并不总是 100% 精准

var x = 0.2 + 0.1;         // x 将是 0.30000000000000004
var x = (0.2 * 10 + 0.1 * 10) / 10;       // 使用乘除法有助于解决 x 将是 0.3

字符串与数字运算

两数相加

var x = 10;
var y = 20;
var z = x + y;           // z 将是 30（一个数）

两字符串相加

var x = "10";
var y = "20";
var z = x + y;           // z 将是 1020（字符串）

数与字符串相加

var x = 10;
var y = "20";
var z = x + y;           // z 将是 1020（一个字符串）

字符串与数字相加

var x = "10";
var y = 20;
var z = x + y;           // z 将是 1020（字符串）

数字字符串运算

var x = "100";
var y = "10";
var z = x / y;       // z 将是 10

NAN 非数值

NaN 属于 JavaScript 保留词，指示某个数不是合法数。

尝试用一个非数字字符串进行除法会得到 NaN（Not a Number）

var x = 100 / "Apple";  // x 将是 NaN（Not a Number）
var x = 100 / "10";     // x 将是 10

var x = NaN;
var y = 5;
var z = x + y;         // z 将是 NaN

typeof NaN;             // 返回 "number"

注：全局JavaScript函数 IsNaN() ，NaN 是数，typeof NaN 返回 number

Infinity

Infinity （或 -Infinity）是 JavaScript 在计算数时超出最大可能数范围时返回的值。

var myNumber = 2;

while (myNumber != Infinity) {          // 执行直到 Infinity
    myNumber = myNumber * myNumber;
}

var x =  2 / 0;          // x 将是 Infinity
var y = -2 / 0;          // y 将是 -Infinity

typeof Infinity;        // 返回 "number"

注：除以 0（零）也会生成 Infinity；Infinity 是数，typeOf Infinity 返回 number

十六进制

JavaScript 会把前缀为 0x 的数值常量解释为十六进制。

var x = 0xFF;             // x 将是 255

前导零和 tostring进制转化

绝不要用前导零写数字（比如 07）。

一些 JavaScript 版本会把带有前导零的数解释为八进制。

默认地，Javascript 把数显示为十进制小数。

能够使用 toString() 方法把数输出为十六进制、八进制或二进制。

var myNumber = 128;
myNumber.toString(16);     // 返回 80
myNumber.toString(8);      // 返回 200
myNumber.toString(2);      // 返回 10000000

数值方法

Number 方法和属性
原始值（比如 3.14 或 2016），无法拥有属性和方法（因为它们不是对象）。

但是通过 JavaScript，方法和属性也可用于原始值，因为 JavaScript 在执行方法和属性时将原始值视作对象。

toString()

toString() 以字符串返回数值。

所有数字方法可用于任意类型的数字（字面量、变量或表达式）

var x = 123;
x.toString();            // 从变量 x 返回 123
(123).toString();        // 从文本 123 返回 123
(100 + 23).toString();   // 从表达式 100 + 23 返回 123

toExponential() 方法

toExponential() 返回字符串值，它包含已被四舍五入并使用指数计数法的数字。

参数定义小数点后的字符数

var x = 9.656;
x.toExponential(2);     // 返回 9.66e+0
x.toExponential(4);     // 返回 9.6560e+0
x.toExponential(6);     // 返回 9.656000e+0

toFixed() 方法

toFixed() 返回字符串值，它包含了指定位数小数的数字

var x = 9.656;
x.toFixed(0);           // 返回 10
x.toFixed(2);           // 返回 9.66
x.toFixed(4);           // 返回 9.6560
x.toFixed(6);           // 返回 9.656000

toPrecision() 方法

toPrecision() 返回字符串值，它包含了指定长度的数字

var x = 9.656;
x.toPrecision();        // 返回 9.656
x.toPrecision(2);       // 返回 9.7
x.toPrecision(4);       // 返回 9.656
x.toPrecision(6);       // 返回 9.65600

valueOf() 方法

valueOf() 以数值返回数值

var x = 123;
x.valueOf();            // 从变量 x 返回 123
(123).valueOf();        // 从文本 123 返回 123
(100 + 23).valueOf();   // 从表达式 100 + 23 返回 123

Number() 方法

Number() 可用于把 JavaScript 变量转换为数值

x = true;
Number(x);        // 返回 1
x = false;     
Number(x);        // 返回 0
x = new Date();
Number(x);        // 返回 1404568027739
x = "10"
Number(x);        // 返回 10
x = "10 20"
Number(x);        // 返回 NaN
Number(new Date("2019-04-15"));    // 返回 1506729600000  返回 1970 年 1 月 1 日至今的毫秒数

注：如果无法转换数字，则返回NaN

parseInt() 方法

parseInt() 解析一段字符串并返回数值。允许空格。只返回首个数字

parseInt("10");         // 返回 10
parseInt("10.33");      // 返回 10
parseInt("10 20 30");   // 返回 10
parseInt("10 years");   // 返回 10
parseInt("years 10");   // 返回 NaN

注：如果无法转换为数值，则返回 NaN (Not a Number)。

parseFloat() 方法

parseFloat() 解析一段字符串并返回数值。允许空格。只返回首个数字

parseFloat("10");        // 返回 10
parseFloat("10.33");     // 返回 10.33
parseFloat("10 20 30");  // 返回 10
parseFloat("10 years");  // 返回 10
parseFloat("years 10");  // 返回 NaN

注：如果无法转换为数值，则返回 NaN (Not a Number)。

数值属性

在这里插入图片描述
注：数字属性不可用于变量
数字属性属于名为 number 的 JavaScript 数字对象包装器。

这些属性只能作为 Number.MAX_VALUE 访问。

使用 myNumber.MAX_VALUE，其中 myNumber 是变量、表达式或值，将返回 undefined

var x = 6;
var y = x.MAX_VALUE;    // y 成为 undefined

数组

数组是一种特殊的变量，它能够一次存放一个以上的值。
数组可以用一个单一的名称存放很多值，并且还可以通过引用索引号来访问这些值。

创建数组

//语法：
var array-name = [item1, item2, ...];
//实例
var cars = ["Saab", "Volvo", "BMW"];
var cars = [
    "Saab",
    "Volvo",
    "BMW"
];

注：空格和折行并不重要。声明可横跨多行

new 创建

var cars = new Array("Saab", "Volvo", "BMW");

注：出于简洁、可读性和执行速度的考虑，请使用第一种方法（数组文本方法）。

访问

通过引用索引号（下标号）来引用某个数组元素

var cars = ["Saab", "Volvo", "BMW"];
document.getElementById("demo").innerHTML = cars[0];

注：[0] 是数组中的第一个元素。[1] 是第二个。数组索引从 0 开始。

通过 JavaScript，可通过引用数组名来访问完整数组

var cars = ["Saab", "Volvo", "BMW"];
document.getElementById("demo").innerHTML = cars;

遍历

最安全方法是使用 “for” 循环

var fruits, text, fLen, i;

fruits = ["Banana", "Orange", "Apple", "Mango"];
fLen = fruits.length;
text = "<ul>";
for (i = 0; i < fLen; i++) {
     text += "<li>" + fruits[i] + "</li>";
}

Array.foreach() 函数

var fruits, text;
fruits = ["Banana", "Orange", "Apple", "Mango"];

text = "<ul>";
fruits.forEach(myFunction);
text += "</ul>";

function myFunction(value) {
  text += "<li>" + value + "</li>";
}

属性和方法

length 属性

length 属性返回数组的长度（数组元素的数目）

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.length;                       // fruits 的长度是 4

isArray（）

判断是否为数组

Array.isArray(fruits);     // 返回 true

toString（）

toString() 把数组转换为数组值（逗号分隔）的字符串

join()

join() 方法也可将所有数组元素结合为一个字符串。

它的行为类似 toString()，但是可以自定义分隔符

var fruits = ["Banana", "Orange","Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.join(" * ");

Popping 和 Pushing

pop()

pop() 方法从数组中删除最后一个元素

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.pop();              // 从 fruits 删除最后一个元素（"Mango"）

push（）

向数组添加新元素的最佳方法是使用 push() 方法

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Lemon");                // 向 fruits 添加一个新元素 (Lemon)

注：push方法返回值为新数组的长度

shift()

shift() 方法会删除首个数组元素，并把所有其他元素“位移”到更低的索引

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.shift();            // 从 fruits 删除第一个元素 "Banana"

注：shift() 方法返回被“位移出”的字符串

unshift()

方法（在开头）向数组添加新元素，并“反向位移”旧元素

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon");    // 向 fruits 添加新元素 "Lemon"

注：unshift() 方法返回新数组的长度

delete

JavaScript 数组属于对象，其中的元素就可以使用 JavaScript delete 运算符来删除

var fruits = ["Banana", "Orange", "Apple", "Mango"];
delete fruits[0];           // 把 fruits 中的首个元素改为 undefined

注：使用 delete 会在数组留下未定义的空洞。请使用 pop() 或 shift()

splice

splice() 方法可用于向数组添加新项

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 0, "Lemon", "Kiwi");

注：
第一个参数（2）定义了应添加新元素的位置（拼接）。

第二个参数（0）定义应删除多少元素。

其余参数（“Lemon”，“Kiwi”）定义要添加的新元素。

splice() 方法返回一个包含已删除项的数组

使用splice删除元素

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(0, 1);        // 删除 fruits 中的第一个元素

注：
第一个参数（0）定义新元素应该被添加（接入）的位置。

第二个参数（1）定义应该删除多个元素。

其余参数被省略。没有新元素将被添加。

concat()

concat() 方法通过合并（连接）现有数组来创建一个新数组

var myGirls = ["Cecilie", "Lone"];
var myBoys = ["Emil", "Tobias", "Linus"];
var myChildren = myGirls.concat(myBoys);   // 连接 myGirls 和 myBoys

注：
concat() 方法不会更改现有数组。它总是返回一个新数组。

concat() 方法可以使用任意数量的数组参数

slice（）

slice() 方法用数组的某个片段切出新数组。

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1);

注：从数组元素 1 （索引序号）（“Orange”）开始切出一段数组

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1, 3);

注：
slice() 可接受两个参数，比如 (1, 3)。

该方法会从开始参数选取元素，直到结束参数（不包括）为止

sort（）

sort() 方法以字母顺序对数组进行排序

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();            // 对 fruits 中的元素进行排序

注：该函数按照字符串顺序对值进行排序，但对数字转为字符串排序时，会产生错误结果，因此sort方法对数值培训会产生不正确结果

var points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return a - b});

reverse()

反转数组中的元素。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();            // 对 fruits 中的元素进行排序
fruits.reverse();         // 反转元素顺序

Math.max()

Math.max.apply 来查找数组中的最高值

function myArrayMax(arr) {
    return Math.max.apply(null, arr);
}

注：Math.max.apply([1, 2, 3]) 等于 Math.max(1, 2, 3)。

Math.min.apply 来查找数组中的最低值

function myArrayMin(arr) {
    return Math.min.apply(null, arr);
}

注：Math.min.apply([1, 2, 3]) 等于 Math.min(1, 2, 3)。

Array.forEach()

forEach() 方法为每个数组元素调用一次函数（回调函数）。

var txt = "";
var numbers = [45, 4, 9, 16, 25];
numbers.forEach(myFunction);

function myFunction(value, index, array) {
  txt = txt + value + "<br>"; 
}

Array.map()

map() 方法通过对每个数组元素执行函数来创建新数组。

map() 方法不会对没有值的数组元素执行函数。

map() 方法不会更改原始数组。

var numbers1 = [45, 4, 9, 16, 25];
var numbers2 = numbers1.map(myFunction);

function myFunction(value, index, array) {
  return value * 2;
}

Array.filter()

filter() 方法创建一个包含通过测试的数组元素的新数组。

var numbers = [45, 4, 9, 16, 25];
var over18 = numbers.filter(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

Array.reduce()

reduce() 方法在每个数组元素上运行函数，以生成（减少它）单个值。

reduce() 方法在数组中从左到右工作。另请参见 reduceRight（）。

reduce() 方法不会减少原始数组。

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction);

function myFunction(total, value, index, array) {
  return total + value;
}

注：reduce方法能接受一个初始值

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction, 100);

function myFunction(total, value) {
  return total + value;
}

Array.reduceRight()

reduceRight() 方法在每个数组元素上运行函数，以生成（减少它）单个值。

reduceRight() 方法在数组中从左到右工作。另请参见 reduce（）。

reduceRight() 方法不会减少原始数组

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduceRight(myFunction);

function myFunction(total, value) {
  return total + value;
}

Array.every()

every() 方法检查所有数组值是否通过测试

var numbers = [45, 4, 9, 16, 25];
var allOver18 = numbers.every(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

Array.some()

some() 方法检查某些数组值是否通过了测试

var numbers = [45, 4, 9, 16, 25];
var someOver18 = numbers.some(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

Array.indexOf()

indexOf() 方法在数组中搜索元素值并返回其位置
未找到项目，返回-1 ，项目多次出现返回第一次出现的位置

var fruits = ["Apple", "Orange", "Apple", "Mango"];
var a = fruits.indexOf("Apple");

注：
语法 array.indexOf(item, start) item（必选）要检索的项目 start（可选）从哪里开始搜索。负值将从结尾开始的给定位置开始并搜索到结尾

Array.lastIndexOf()

Array.find()

find() 方法返回通过测试函数的第一个数组元素的值

var numbers = [4, 9, 16, 25, 29];
var first = numbers.find(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

Array.findIndex()

findIndex() 方法返回通过测试函数的第一个数组元素的索引

var numbers = [4, 9, 16, 25, 29];
var first = numbers.findIndex(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}