ECMA

2021-03-15 22:06:04 浏览数 (1)

QML语法有三个核心:

  • ECMAScript
  • Qt对象系统
  • Qt Quick标准库

所以ECMAScript非常重要,本章主要总结ECMAScript用法

ECMAScript语法参考链接:https://www.w3school.com.cn/js/pro_js_syntax.asp

ECMAScript内置对象参考链接:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects

  1. 语法

区分大小写

比如:变量 test 与变量 TEST 是不同的。

变量是弱类型的

定义变量时只能用 var 运算符,而不是String、int、bool之类的.初始化的时候可以赋为任意值,也可以随意改变变量所存储的数据类型(尽量避免这样做).比如:

var color = "red";

var num = 25;

var visible = true;

console.log(num)

num = "123" // 将int类型转为bool类型,不建议这样更改, 好的编码习惯是始终存放相同类型的值

console.log(num)

每行结尾的分号可有可无

最好还是加上分号,与C 代码保持一致,保持良好编码习惯

注释与 Java、C 和 PHP 语言的注释相同

比如:

// this is a single-line comment

/*

* this is a multi-line comment

*/

括号表示代码块

在左括号({)和右括号(})之间被称为代码块.

声明变量

可以用var 语句来定义多个变量:

var test1 = "hi", test2 = "hello", age = 25;

命名变量

变量名需要遵守两条简单的规则:

  • 第一个字符必须是字母、下划线(_)或美元符号($)
  • 余下的字符可以是下划线、美元符号或任何字母或数字字符

下面的变量都是合法的:

var test;

var $test;

var $1;

var _$te$t2;

最好的命名方式是:

方法和变量都以小驼峰方式命名

类都以大驼峰方式命名

枚举值之类的以全大写,下划线分割

ECMAScript 关键字

下面是 ECMAScript 关键字的完整列表:

break

case

catch

continue

default

delete : 用来删除对象中开发者定义的属性和方法

do

else

finally

for

function

if

in

instanceof

new : 创建一个引用对象变量

return

switch

this

throw

try

typeof

var

void

while

with

ECMAScript 保留字

保留字在某种意思上是为将来的关键字而保留的单词。因此保留字不能被用作变量名或函数名

abstract

boolean

byte

char

class

const

debugger

double

enum

export

extends

final

float

goto

implements

import

int

interface

long

native

package

private

protected

public

short

static

super

synchronized

throws

transient

volatile

和--运算符

和C/C 一样,前置 和前置--,都是发生在计算表达式之前.

而后置 和后置--,都是发生在计算表达式之后.

代码语言:javascript复制
var iNum1 = 2;
代码语言:javascript复制
        var iNum2 = 20;
代码语言:javascript复制
        var iNum3 = --iNum1   --iNum2; // 1   19  等于 20
代码语言:javascript复制
        var iNum4 = iNum1--   iNum2--; // 1   19  等于 20

var iNum5 = iNum1 iNum2; // 0 18 等于 18

取反~、与&、或|、异或^运算、取模运算符

在ECMAScript中, 取反~、与&、或|、异或^、%的运算规则和C 一样.示例如下:

代码语言:javascript复制
var iNum1 = ~10;        // 10取反然后自减1,等于-11
代码语言:javascript复制
        var iNum2 = 10 & 7;     // 1010 & 0111 = 0010 = 2
代码语言:javascript复制
        var iNum3 = 10 | 7;     // 1010 | 0111 = 1111 = 15
代码语言:javascript复制
        var iNum4 = 10 ^ 7;     // 1010 ^ 0111 = 相同为0,相异则或 = 1101 =13

var iResult = 26%5; //等于 1

for-in 语句

for-in 语句,不仅可以打印出对象里的属性和方法,还可以打印数组的内容

示例如下:

for(var i in data) {

... ...

}

switch语句

在 ECMAScript 中,switch 语句可以用于字符串,而且case语句能用变量值.非常灵巧,示例如下所示:

var BLUE = "blue", RED = "red", GREEN = "green";

switch (sColor) {

case BLUE: console.log("Blue");

break;

case RED: console.log("Red");

break;

case GREEN: console.log("Green");

break;

default: console.log("Other");

}

原始值和引用值

在 ECMAScript 中,变量可以存在两种类型的值,即原始值和引用值(类似于指针)

原始值

存储在栈(stack)中的简单数据段,也就是说,它们的值直接存储在变量访问的位置。

引用值

存储在堆(heap)中的对象,也就是说,存储在变量处的值是一个指针(point),指向存储对象的内存处。

而原始值有5 种类型(可以通过typeof来判断变量的类型):

  • undefined - 如果变量是 Undefined 类型的(未赋初值的变量)
  • boolean - 如果变量是 Boolean 类型的
  • number - 如果变量是 Number 类型的(不管是整数还是浮点数)
  • string - 如果变量是 String 类型的
  • object - 如果变量是一种引用类型或 Null 类型的(用于表示尚未存在的对象)

typeof 运算符

用来判断变量的是什么类型的变量.示例:

代码语言:javascript复制
var color = "red";
代码语言:javascript复制
var visible = true;
代码语言:javascript复制
var num = 25;
代码语言:javascript复制
var num1 = 025;    // 0开头的数字表示是8进制
代码语言:javascript复制
var num2 = 0x25;   // 0x开头的表示是十六进制
代码语言:javascript复制
var oTemp;
代码语言:javascript复制
console.log(typeof color)   // 打印string
代码语言:javascript复制
console.log(typeof visible) //打印boolean
代码语言:javascript复制
console.log(typeof num)    //打印number
代码语言:javascript复制
console.log(typeof oTemp)  // 打印undefined,因为没初始值
代码语言:javascript复制
console.log(oTemp == null) // 打印为true
代码语言:javascript复制
代码语言:javascript复制
var arr = new Array;
代码语言:javascript复制
console.log(typeof arr)     // 打印object,如果是引用类型,查看对象类型的话,需要使用instanceof运算符
代码语言:javascript复制
console.log(arr instanceof Array)   // arr引用的类型是Array,所以打印true
代码语言:javascript复制
尽管null和undefined相等,但是意义不同,比如我们要清理一个对象,那么需要给对象赋值null,而不是undefined
代码语言:javascript复制
代码语言:javascript复制

typeof 运算符和instanceof 运算符

instanceof 运算符与 typeof 运算符相似,用于识别正在处理的对象的类型。与 typeof 方法不同的是:

l instanceof 方法要求开发者明确地确认对象为某特定类型。

l 而typeof则可以直接得出变量类型.

Number 类型

代码语言:javascript复制
要定义浮点值,必须包括小数点和小数点后的一位数字(例如1.0)。这被看作浮点数字面量。
代码语言:javascript复制
对于非常大或非常小的数,可以用科学计数法表示浮点数.例如:

var fNum1 = 5.618e7 // 5.618 x 107

var fNum2 = 8-e17 // 0.00000000000000008

Number提供的几个特殊值

Number.MAX_VALUE : 定义了数值最大值,值为1.7976931348623157e 308

Number. MIN_VALUE : 定义了数值最小值,值为5e-324

Number.POSITIVE_INFINITY: 无穷大,值为Infinity

Number.NEGATIVE_INFINITY: 无穷小,值为-Infinity

并且提供了2个方法判断Number是否有效

isFinite(number) : number如果是无穷的,则返回false,有穷则返回true

isNaN(val) : 判断val是否非数字,返回true,则表示非数字

示例如下:

代码语言:javascript复制
                var maxValue = Number.MAX_VALUE;
代码语言:javascript复制
                var minValue = Number.MIN_VALUE;
代码语言:javascript复制
                console.log(maxValue)   // 1.7976931348623157e 308
代码语言:javascript复制
                console.log(minValue)   // 5e-324
代码语言:javascript复制
                console.log(Number.POSITIVE_INFINITY) // Infinity
代码语言:javascript复制
                console.log(Number.NEGATIVE_INFINITY) // -Infinity
代码语言:javascript复制
代码语言:javascript复制
                if (isFinite(10000)) {
代码语言:javascript复制
                    console.log("10000 = 有穷数")  //  10000 = 有穷数
代码语言:javascript复制
                }
代码语言:javascript复制
                var value = maxValue * maxValue;
代码语言:javascript复制
                if (!isFinite(value)) {
代码语言:javascript复制
                    console.log("maxValue * maxValue = 无穷的数") // maxValue * maxValue = 无穷的数
代码语言:javascript复制
                }
代码语言:javascript复制
                var value2 = "0.0.1324";
代码语言:javascript复制
                console.log( isNaN("blue"))    // true
代码语言:javascript复制
                console.log( isNaN(value2))    // true
代码语言:javascript复制
                console.log( isNaN("666"))     // false
代码语言:javascript复制
                console.log( isNaN(1000))      // false

String 类型

在ECMAScript中,单引号和双引号一样,都可以用来字符串或者字符上,比如:

var sColor1 = "red";

var sColor2 = 'red';

n

换行

t

制表符

b

空格

r

回车

f

换页符

\

反斜杠

'

单引号

"

双引号

nnn

八进制代码 nnn 表示的字符(n 是 0 到 7 中的一个八进制数字)

xnn

十六进制代码 nn 表示的字符(n 是 0 到 F 中的一个十六进制数字)

unnnn

十六进制代码 nnnn 表示的 Unicode 字符(n 是 0 到 F 中的一个十六进制数字)

toString()转换成字符串

ECMAScript 对所有对象提供了 toString() 方法,对于Number类型,默认打印的是十进制,也可以通过传参的方式来改变进制,比如:

代码语言:javascript复制
              var color = "red";
代码语言:javascript复制
                var visible = true;
代码语言:javascript复制
                var value1 = 0.1324;
代码语言:javascript复制
                var value2 = 10;
代码语言:javascript复制
                console.log( color.toString())    // red
代码语言:javascript复制
                console.log( visible.toString())  // true
代码语言:javascript复制
                console.log( value1.toString())   // 0.1324
代码语言:javascript复制
                console.log( value2.toString(2))  // 打印二进制 1010
代码语言:javascript复制
                console.log( value2.toString(8))  // 打印八进制 12

console.log( value2.toString(16)) // 打印十六进制 a

解析字符串到数字

ECMAScript提供了 parseInt(var) 和 parseFloat(var)方法,用来解析字符串转换为数字,如果不能转换则返回NaN.

parseInt()解析时会去检查字符串是否有效,比如"1010",就会作为十进制进行解析.

"0xFF"作为十六进制解析.而"FF"则会返回NaN.如果要正确解析其它进制,可以通过第二个参数来改变,然后返回的是个十进制值.

示例如下:

代码语言:javascript复制
  console.log( parseInt("red"))    // NaN
代码语言:javascript复制
                    console.log( parseFloat("true"))  // NaN
代码语言:javascript复制
                    console.log( parseInt("11.1324"))     // 11
代码语言:javascript复制
                    console.log( parseFloat("11.1324"))   // 11.1324
代码语言:javascript复制
                    console.log( parseInt("0010"))     // 10
代码语言:javascript复制
                    console.log( parseInt("0xFF"))     // 255
代码语言:javascript复制
                    console.log( parseInt("FF"))       // 由于没有0x开头所以动态解析失败,打印"NaN"
代码语言:javascript复制
                    console.log( parseInt("1010",2))   // 由于都是数字,则解析十进制,打印"10"
代码语言:javascript复制
                    console.log( parseInt("10",8))     // 解析八进制,打印"8"
代码语言:javascript复制
                    console.log( parseInt("FF",16))    // 解析十六进制,打印"255"
代码语言:javascript复制
代码语言:javascript复制
                   console.log( parseInt("1AAA1.1324"))  // 遇到非数字停止解析,打印"1"
代码语言:javascript复制
                  console.log( parseFloat("11.13.AAA4"))   // 遇到非数字停止解析,打印"11.13"
代码语言:javascript复制

强制类型转换Boolean(var)

ECMAScript提供了Boolean(var)方法.把给定的值强制转换成 Boolean 型

当要转换的值是至少有一个字符的字符串、非 0 数字或对象时,Boolean() 函数将返回 true。

如果该值是空字符串、数字 0、undefined 或 null,它将返回 false。

示例如下所示:

代码语言:javascript复制
console.log(Boolean(""));                 //false - 空字符串
代码语言:javascript复制
                console.log(Boolean("hello"));               //true - 非空字符串
代码语言:javascript复制
                console.log(Boolean(50));                //true - 非零数字
代码语言:javascript复制
                console.log(Boolean(null));            //false - null
代码语言:javascript复制
                console.log(Boolean(0));                  //false - 零
代码语言:javascript复制
                var onj= new Object

console.log(Boolean(onj)); //true - 对象

强制类型转换Number(var)

ECMAScript提供了Number(var)方法. 把给定的值强制转换成数字(可以是整数或浮点数)

Number()转换的值如果是字符串,那么字符串必须得是完整值,和 parseInt() 和 parseFloat() 方法不一样,而不是部分值.

而对于其它类型转换也有所不同,示例如下:

代码语言:javascript复制
console.log(Number(false));      // 0
代码语言:javascript复制
                console.log(Number(true));      // 1
代码语言:javascript复制
                console.log(Number(undefined)); // NaN
代码语言:javascript复制
                console.log(Number(null));      // 0
代码语言:javascript复制
                console.log(Number("1.2"));    // 1.2
代码语言:javascript复制
                console.log(Number("12"));     // 12
代码语言:javascript复制
                console.log(Number("1.2.3")); // NaN
代码语言:javascript复制
                console.log(Number(50));      // 50
代码语言:javascript复制

强制类型转换String(var)

ECMAScript提供了String(var)方法. 把给定的值强制转换成字符串.

和toString()方法类似,但是对于 null 和 undefined 值强制类型转换可以生成字符串而不引发错误,示例如下:

代码语言:javascript复制
console.log(String(null));    // "null"
代码语言:javascript复制
                var oNull = null;

console.log(oNull.toString()); // 会引发错误,null没有toString()方法

对象创建与回收

对象是由 new 运算符加上要实例化的对象的名字创建的。

例如,下面的代码创建 Array对象的实例:

代码语言:javascript复制
var arr1 = new Array;
代码语言:javascript复制
var arr2 = new Array(5);
代码语言:javascript复制
console.log(arr1.length)   // 打印0
代码语言:javascript复制
console.log(arr2.length)   // 打印5
代码语言:javascript复制
arr1 = null;
代码语言:javascript复制
arr2 = null;
代码语言:javascript复制
如果类的构造函数不传入参数,括号可以省略。
代码语言:javascript复制
由于ECMAScript有垃圾收集器,所以当没有任何引用指向一个对象时,该对象会自动被垃圾收集器回收、释放。
代码语言:javascript复制
如果我们是在一个函数里new出来的对象,那么都不需要置null,函数执行完毕后也会自动释放.但是每次用完一个对象,还是应该置null取消引用,保持一个良好习惯.
代码语言:javascript复制
代码语言:javascript复制

Object对象

Object类是所有ECMAScript类的基类,Object类的所有属性和方法都会出现在其他类中.

Object 对象具有下列属性

constructor

指向创建对象函数的引用(指针)。对于 Object 对象,该指针指向Object() 函数。

prototype

指向该对象类的引用。对于所有的对象,它默认返回 Object 对象的一个实例。

Object 对象还具有几个方法:

hasOwnProperty(property)

判断对象是否有某个特定的属性。property是个字符串。(例如,o.hasOwnProperty("name"))

isPrototypeOf(object)

判断该对象是否为另一个对象的原型。

propertyIsEnumerable(property)

判断给定的属性是否可以用 for...in 语句进行枚举得出(只有自定义的对象属性和方法是可以枚举的)

toString()

返回对象的类型名字

valueOf()

返回最适合该对象的原始值。对于许多对象,该方法返回的值都与 ToString() 的返回值相同。

Object可以直接动态创建属性;也可以动态创建方法;也可以通过delete运算符删除开发者定义的属性和方法,也可以使用数组下标[]的方法获取属性的值。下面是一个简单的示例:

代码语言:javascript复制
Window{
代码语言:javascript复制
    visible: true
代码语言:javascript复制
    id: wind
代码语言:javascript复制
    Component.onCompleted: {
代码语言:javascript复制
        var object = new Object
代码语言:javascript复制
        object.name = "ZhangSan"           // 动态创建属性
代码语言:javascript复制
        object.year = "26"
代码语言:javascript复制
        object.printInfo = function printInfo() {    // 动态创建方法
代码语言:javascript复制
            console.log("name-" , this.name , "year-" , this.year);
代码语言:javascript复制
        }
代码语言:javascript复制
        object.printInfo();                        // 调用方法,打印 name- ZhangSan year- 26
代码语言:javascript复制
        console.log(object.name)                   // 打印 ZhangSan
代码语言:javascript复制
        console.log(object["year"])                // 通过[]数组方式访问属性.打印 26
代码语言:javascript复制
        console.log(object.hasOwnProperty("name")) // 检查是否有"name"属性,返回true
代码语言:javascript复制
代码语言:javascript复制
        delete object.name             // delete只能删除我们动态创建的name属性,不能删除object自带的属性和方法
代码语言:javascript复制
代码语言:javascript复制
        console.log(object.name)       // 打印 undefined,表示没有这个属性
代码语言:javascript复制
        for (var prop in object) {    // 循环打印自定义的属性和方法(name属性已经被delete,无法找到): "26","function printInfo() { [native code] }"
代码语言:javascript复制
             console.log("for:",object[prop])
代码语言:javascript复制
        }
代码语言:javascript复制
    }

}

除处之外,我们还可以这样通过初始化列表的形式来构造Object类:

代码语言:javascript复制
var object2 = {
代码语言:javascript复制
            "name" : "LiSi",
代码语言:javascript复制
            "year" : 26,
代码语言:javascript复制
        }
代码语言:javascript复制
        console.log(object2.name)      // LiSi
代码语言:javascript复制
        console.log(object2.year)      // 26
代码语言:javascript复制
        for (var prop in object2) {    // 循环打印自定义的属性和方法: "LiSi","26"
代码语言:javascript复制
             console.log(object2[prop])

}

String对象

String 对象是 String 原始类型的引用类型,它是以下方式创建的:

var oStringObject = new String("hello world");

String可以通过数组下标[]的方法获取单个字符,还可以通过赋值方式来添加成员.

比如:

var str = new String("2021");

str = " 11/11 " // str = "2021 11/11"

Object 对象具有下列属性:

length : 返回字符个数,对于中文,还是当成一个字符来看.

Object 对象具有下列方法:

toString() : 返回字符串原始值

valueOf() : 和toString()一样, 返回字符串原始值

charAt(num) :返回第num个位置处的单个字符,位置从0开始的

charCodeAt(num) : 返回第num个位置处的单个字符编码值

示例如下所示:

代码语言:javascript复制
var str1 = new String("hello world");
代码语言:javascript复制
        var str2 = new String("hello world");
代码语言:javascript复制
        console.log(str1 == str2);                  // 比较的是对象本身地址,由于str1和str2的地址不同,返回false
代码语言:javascript复制
        console.log(str1.toString() == str2.toString()); // 比较的是字符串原始值,由于str1和str2指向的原始值都在同一地址,返回true
代码语言:javascript复制
        console.log(str1[1]);               // 打印e
代码语言:javascript复制
        console.log(str1["1"]);             // 通过字符串数字访问,打印e
代码语言:javascript复制
        console.log(str1.charAt(1));        // 打印e
代码语言:javascript复制
        console.log(str1.charAt("1"));      // 通过字符串数字访问,打印e

console.log(str1.charCodeAt(1)); // 打印e的编码值,101

注意:

相同内容的String对象用"=="判断是返回false的.因为比较的是对象本身地址,而不是对象引用的值.

在ECMAScript中,数字和字符串数字的值其实是一样的意思,比如:

"5" == 5 // "5"会转换为5,来和5比较,所以为true

如果想除了判断值相等,还要判断类型的话,请使用全等号"==="或者非全等号"!==",比如:

"5" === 5 // 为false,因为类型不同

"5" !== 5 // 为true

str1.concat(str2): 连接字符串,返回str1 str2的内容

str1.indexOf(str2): 查找子串,从str1头部开始查找str2子串,找到则返回子串开头位置,否则返回-1

str1.lastIndexOf(str2): 反向查找子串,找到则则返回子串开头位置,否则返回-1

示例如下:

代码语言:javascript复制
var str1 = new String("hello ");
代码语言:javascript复制
        var str2 = new String("world");
代码语言:javascript复制
代码语言:javascript复制
        console.log(str1.concat(str2));      // 打印 "hello world"
代码语言:javascript复制
        console.log(str1.indexOf("ll"));     // 打印 2
代码语言:javascript复制
        console.log(str1.indexOf("hh"));     // 未找到,打印 -1

console.log(str1.concat(str2).lastIndexOf("l")); // 打印 9

str1.localeCompare(str2) : 比较字符串.

如果str1的内容大于str2,返回正数

如果str1的内容等于str2,返回0

如果str1的内容小于str2,返回负数

str.substring(num,num) : 获取子串,var1表示str中的起始位置,var2表示str2中的终止前位置(不包含在内),如果省略var2参数,则默认终止位置在str末尾.

str.slice(num,num) : 和substring()方法一样,唯一的区别在于slice支持负数.而substring不支持负数,统统当做0来处理.

示例如下:

代码语言:javascript复制
        var str = new String("hello world");
代码语言:javascript复制
代码语言:javascript复制
        console.log(str.slice(3));       // 从起始位3处获取子串,打印 "lo world"
代码语言:javascript复制
        console.log(str.substring("3")); // 从起始位3处获取子串,打印 "lo world"
代码语言:javascript复制
代码语言:javascript复制
        console.log(str.slice(3,7));         // 从[3,7]位处获取子串,所以子串长度为7-3-1=3, 打印 "lo w"
代码语言:javascript复制
        console.log(str.substring(3,7));    //  从[3,7]位处获取子串, 打印 "lo w"
代码语言:javascript复制
代码语言:javascript复制
代码语言:javascript复制
        console.log(str.slice(3,-2));       // 从起始位3到末尾-2之前位置获取子串,打印:"lo wor"

console.log(str.substring(3,-2)); // 由于substring() 总把较小值作为起始位,较大值作为结束位[-2,3],并且不支持负数,所以获取的位置是[0,3],打印:"hel"

str.toUpperCase() : 返回字符串大写

str.toLowerCase() : 返回字符串小写

代码语言:javascript复制
str.arg(var)   : 通过arg方式替换
代码语言:javascript复制
示例如下:
代码语言:javascript复制
var str = new String("%1,%2,%3");

console.log(str.arg("123").arg(133).arg(5.2)); // 打印"123,133,5.2"

str.replace(str1,str2) : 替换,将str中出现str1的地方,替换为str2,支持正则表达式替换

str.match(regx) : 通过正则表达式查找String内容

示例如下所示:

代码语言:javascript复制
var str = new String("时间:2020 11/12 20:35 ");
代码语言:javascript复制
        var result = str.match(/d /g);            // 匹配字符串中所有数字项
代码语言:javascript复制
        console.log(result.length);                // 共找到5组匹配项
代码语言:javascript复制
        for (var i in result) {
代码语言:javascript复制
            console.log("index",i,": ",result[i]);  // 循环打印 2020、11、12、20、35
代码语言:javascript复制
        }
代码语言:javascript复制

console.log(str.replace(/d /g,"?")); // 将数字项改为"?",打印: "时间:? ?/? ?:?"

"/d /g":

最前面的“/”与最后面的“/”是分隔符,表示正则表达式的开始与结束。

所以正则表达式匹配的内容是"d ",匹配多个数字.

而最后的"g"表示的是全局匹配,可以匹配到多次的情况,如果不加"g",那么result的匹配项最多只能有1个,匹配成功就截止.

相关的标志还有i(ignoreCase,表示忽略大小写)、m(multiline,表示允许跨行)

忽略大小写,匹配含有str标签项,示例如下所示:

代码语言:javascript复制
var str = new String("str:456; ASDZ Str:123; RES STr:XYZ; STR:qaz;");
代码语言:javascript复制
代码语言:javascript复制
        var result = str.match(/str(. ?);/gi);  // 查找含有str和;的匹配项,g:global(匹配多次) i:ignoreCase(不区分大小写)
代码语言:javascript复制
代码语言:javascript复制
        console.log(result.length);     // 打印4
代码语言:javascript复制
代码语言:javascript复制
        for (var i in result) {
代码语言:javascript复制
            console.log("index",i,": ",result[i]);
代码语言:javascript复制
            // 循环打印  index 0 :  str:456;
代码语言:javascript复制
            //         index 1 :  Str:123;
代码语言:javascript复制
            //         index 2 :  STr:XYZ;
代码语言:javascript复制
            //         index 3 :  STR:qaz;

}

正则表达式元字符参考: https://deerchao.cn/tutorials/regex/regex.htm

Array数组对象

ECMAScript提供了Array数组对象,并且该Array的元素类型还可以各个不同.

创建空数组:

代码语言:javascript复制
var arr1 = new Array();
代码语言:javascript复制
var arr2 = new Array;
代码语言:javascript复制
var arr3 = [];

console.log(arr1.length,arr2.length,arr3.length);

创建有内容的数组

代码语言:javascript复制
     var arr4 = [5];             // 数组长度为1,arr4[0] = 5
代码语言:javascript复制
        var arr5 = new Array(5);    // 数组长度为5,内容未初始化
代码语言:javascript复制
        var arr6 = new Array("5",5,123,true); // 数组长度为4,内容已初始化
代码语言:javascript复制
        var arr7 = [1,2,3]; // 数组长度为3,内容已初始化
代码语言:javascript复制
        console.log(arr4.length,arr5.length,arr6.length,arr7.length)  //打印:1 5 4 3

console.log(arr4,arr5,arr6,arr7) // 打印: [5] [undefined,undefined,undefined,undefined,undefined] ["5",5,123,true] [1,2,3]

通过下标读写数组

代码语言:javascript复制
var arr = new Array("5",5,123,true); // 数组长度为4,内容为["5",5,123,true]
代码语言:javascript复制
        console.log(arr[0] == arr["0"]);    // 通过下标访问数组时,字符串"0"和数字0是一样的.
代码语言:javascript复制
        arr[0] =6;          // 通过下标更改数组内容
代码语言:javascript复制
        arr[-1.2] = 100;   // 由于-1.2,不是数组成员,所以会把-1.2转为字符串,创建名为'1.2'的属性,并赋值100
代码语言:javascript复制
代码语言:javascript复制
代码语言:javascript复制
        for (var index in arr) {    // 循环打印数组属性成员
代码语言:javascript复制
            console.log("for:",index,arr[index])
代码语言:javascript复制
                // 打印: for: 0 5
代码语言:javascript复制
                //      for: 1 5
代码语言:javascript复制
                //      for: 2 123
代码语言:javascript复制
                //      for: 3 true
代码语言:javascript复制
                //      for: -1.2 100

}

通过更改length来改变数组长度

var arr =[1,2,3,4];

arr.length=2;//删除了数组3,4元素

arr.length=0;//重置数组

arr.length=5;//重新声明长度,但是内容是未定义的,等价于var arr5 = new Array(5);

如何判断数组类型

Array.isArray(arr) : 判断arr是否是数组类型.

arr instanceof Array : 判断arr是否是数组类型.

数组对象提供的方法

arr.toString() : 打印数组内容

arr.reverse() : 将arr的内容进行倒序排列.

arr.sort() : 排序,将内容转化为字符串,进行从小到大排列.

arr.sort(function) : 提供一个排序函数进行排序,返回正数的话,参数1会调整在后面,返回负数的话,参数2会调整在后面

示例如下:

代码语言:javascript复制
var arr = new Array(5,5,1,2,3,4,13,true,false,"s","u"); 
代码语言:javascript复制
        arr.sort();
代码语言:javascript复制
        console.log(arr);   // 打印:[1,13,2,3,4,5,5,s,true,u],说明都是将内容转化为字符串,进行字母正序排列
代码语言:javascript复制
代码语言:javascript复制
        console.log(typeof arr[7] == "boolean");
代码语言:javascript复制
代码语言:javascript复制
        // bool类型排在前面,字符串类型排在中间,数字类型排在后面
代码语言:javascript复制
        arr.sort( function(a,b) {
代码语言:javascript复制
代码语言:javascript复制
            if (typeof a ==  typeof b) {
代码语言:javascript复制
                console.log(typeof a,a,b);
代码语言:javascript复制
                if(a > b) {
代码语言:javascript复制
                    return 1;
代码语言:javascript复制
                } else {
代码语言:javascript复制
                    return -1;
代码语言:javascript复制
                }
代码语言:javascript复制
             } else if (typeof a == "number" || typeof b == "number") {
代码语言:javascript复制
                console.log("boolean1",a,b);
代码语言:javascript复制
                if(typeof a == "number") {
代码语言:javascript复制
                    return 1;
代码语言:javascript复制
                } else {
代码语言:javascript复制
                    return -1;
代码语言:javascript复制
                }
代码语言:javascript复制
            } else if (typeof a == "string" || typeof b == "string") {
代码语言:javascript复制
                console.log("string1",typeof a,a,b);
代码语言:javascript复制
                if(typeof a == "string") {
代码语言:javascript复制
                    return 1;
代码语言:javascript复制
                } else {
代码语言:javascript复制
                    return -1;
代码语言:javascript复制
                }
代码语言:javascript复制
            }
代码语言:javascript复制
        });
代码语言:javascript复制

console.log(arr); // 打印 [false,true,s,u,1,2,3,4,5,5,13]

console.log(arr.toString()); // 打印 false,true,s,u,1,2,3,4,5,5,13

arr.join(str) : 在每个元素中添加分隔符,并返回字符串,如果不带参数,那么arr.join()等价于arr.toString().

arr2 = arr1.concat(arr3,arr4...) : 连接多个数组并返回一个新数组,所以arr2 = arr1 arr3 arr4.并且不会改变arr1自身内容.

arr.slice(start,end) : 获取数组中的一部分,和String的slice()类似,var1表示数组元素起始位置,var2表示数组元素终止前位置(不包含在内),如果省略var2参数,则默认终止位置在数组末尾.

arr.splice(index,number,insert1,inset2...) :替换数组内容,index表示要被替换的起始下标,number表示被替换的元素个数,然后后面参数是要插入的任意个元素,该方法会改变对象自身内容,并且返回删除掉的元素内容.

arr.splice(1,3) : splice除了替换内容外,还可以当成删除数组元素使用,这里表示从数组下标1,删除3个元素.

arr.splice(2,0,1,2,3 ,"456"):splice除了替换内容外,还可以当成添加数组元素使用,这里表示从数组下标2开始,添加4个数组元素:[1,2,3,"456"]

示例如下所示;

代码语言:javascript复制
        var arr =[1,2,3,4,5,6,7];
代码语言:javascript复制
代码语言:javascript复制
        console.log(arr.slice(2));    // 打印[3,4,5,6,7]
代码语言:javascript复制
        console.log(arr.slice(2,5));  // 打印[3,4,5]
代码语言:javascript复制
        console.log(arr.slice(2,-1)); // 打印[3,4,5,6]
代码语言:javascript复制
        arr.splice(1,3);              // 从[1,2,3,4,5,6,7]删除掉[2,3,4]
代码语言:javascript复制
        console.log(arr);             // 打印[1,5,6,7]
代码语言:javascript复制
        arr.splice(2,0,1,2,3,"456");  // 在下标1位置处插入[1,2,3,"456"]

console.log(arr); // 打印[1,5,1,2,3,456,6,7]

arr.push(arg1,arg2,...) : 入栈,向数组的尾部添加元素,并返回数组新的长度。

arr.pop() : 出栈,删除尾部的最后一个元素,并返回删除的元素

arr.shift() : 删除数组的头部的第一个元素,并将删除的元素返回。

arr.unshift(arg1,arg2,arg3....) :向数组的头部增加一个或多个元素,并返回数组的长度。

arr.forEach(function(elem,index,arr)) : 遍历数组,不会改变对象自身内容,elem为遍历的元素,index为元素的下标,arr为数组本身。该方法只是遍历操作数组,不会有返回值,并且是无法使用continue,break这些关键字

arr.map(function(elem,index,arr)) :遍历数组,不会改变对象自身内容,并返回一个新的数组

arr.filter(function(elem,index,arr)) :过滤元素, 不会改变对象自身内容,并返回一个新的数组

arr.some(function(elem,index,arr)) : 或判断, 函数内只要一个是返回true的,则返回true.

arr.every(function(elem,index,arr)) : 与判断, 函数内只要一个是返回false的,则返回false.

arr.indexOf(elem,index) : 从arr数组中index下标位置往前搜索是否有elem元素,如果不存在,则返回-1,否者返回找到的元素下标位置

arr. lastIndexOf (elem,index) : 和indexOf相反,是反向搜索.

示例如下所示:

代码语言:javascript复制
var arr =[1,2,3,4,5,6,7];
代码语言:javascript复制
代码语言:javascript复制
        arr.forEach(function(elem,index,arr) {
代码语言:javascript复制
            elem  = 1;
代码语言:javascript复制
        });
代码语言:javascript复制
        console.log(arr); // 打印[1,2,3,4,5,6,7],由于"elem  = 1;"中的elem是定义的临时变量进行 1的,所以根本没有改变对象自身内容
代码语言:javascript复制
代码语言:javascript复制
        var arr2 = arr.map(function(elem,index,arr) {
代码语言:javascript复制
            return elem *= 2;       // 返回到arr2中
代码语言:javascript复制
        });
代码语言:javascript复制
        console.log(arr2);   // 打印[2,4,6,8,10,12,14]
代码语言:javascript复制
代码语言:javascript复制
        var arr3 = arr.filter(function(elem,index,arr) {
代码语言:javascript复制
            if (elem%2 == 1) {          // 过滤,只要奇数内容
代码语言:javascript复制
                return elem;
代码语言:javascript复制
            }
代码语言:javascript复制
        });
代码语言:javascript复制
        console.log(arr3); // 打印[1,3,5,7]
代码语言:javascript复制
代码语言:javascript复制
        var result1 = arr.some(function(elem,index,arr) {
代码语言:javascript复制
            return (elem === 3);
代码语言:javascript复制
        });
代码语言:javascript复制
        console.log(result1); // 打印true
代码语言:javascript复制
代码语言:javascript复制
        var result2 = arr.every(function(elem,index,arr) {
代码语言:javascript复制
            return (elem === 3);
代码语言:javascript复制
        });
代码语言:javascript复制
        console.log(result2); // 打印false
代码语言:javascript复制
代码语言:javascript复制
        console.log(arr.indexOf(3,1)); // 打印2,因为arr[2] = 3

Math对象

参考https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Math

Math对象可以不用创建直接使用Math.属性和Math.方法名();

它的属性有:

E : 返回自然常数 e,即自然对数的底数,(1 1/n)的n次方,n趋于无穷大(约等于2.71828...)

LN2 : 返回 2 的自然对数,也就是log(e)^2的值(约等于0.693)。

LN10 : 返回 10 的自然对数,也就是log(e)^10的值(约等于2.302)。

LOG2E : 返回以 2 为底的 e 的对数,也就是log(2)^e的值(约等于 1.414)。

LOG10E : 返回以 10 为底的 e 的对数,也就是log(10)^e的值(约等于0.434)。

PI : 返回圆周率(约等于3.14159)。

SQRT2 : 返回 2 的平方根(约等于 1.414)。

SQRT1_2 : 返回返回 2 的平方根的倒数,也就是1/SQRT2的值(约等于 0.707)。

三角方法

tan(x) : 返回x弧度值的正切。

cos(x) : 返回x弧度值的余弦。

sin(x) : 返回x弧度值的正弦。

acos(x) : 返回x余弦值的弧度值,

asin(x) : 返回x正弦值的弧度值。

atan(x) : 返回x正切值的弧度值, 算得的Y值在[-pi/2,pi/2]之间

atan2(y,x) :返回(x,0)轴与 (x,y) 轴 之间的弧度值(介于 -PI/2 与 PI/2 弧度之间)。

sin、cos、tan、cot度数表如图所示:

示例如下所示:

代码语言:javascript复制
var angle = 45;
代码语言:javascript复制
        var arc = angle/180 * Math.PI;  // 将45°转换为弧度
代码语言:javascript复制
代码语言:javascript复制
        console.log(arc);           //  45°的弧度值,打印 0.7853
代码语言:javascript复制
        console.log(Math.cos(arc)); //  cos45°的值,打印 0.7071067811865476
代码语言:javascript复制
        console.log(Math.sin(arc)); //  sin45°的值,打印 0.7071067811865476
代码语言:javascript复制
        console.log(Math.tan(arc)); //  tan45°的值,打印 0.9999999999999999
代码语言:javascript复制
代码语言:javascript复制
        console.log(Math.acos(0.7071)*180/Math.PI);  //  将cos45°的值转换为角度值acos45°的值,打印 45°
代码语言:javascript复制
        console.log(Math.asin(0.7071)*180/Math.PI);  //  asin45°的值,打印 45°
代码语言:javascript复制
        console.log(Math.atan(1)*180/Math.PI);       //  atan45°的值,打印45°
代码语言:javascript复制

console.log(Math.atan2(Math.sqrt(3),3)*180/Math.PI); // (根号3,0)轴与 (根号3,3)轴之间的角度值,打印30°

其它方法

max(arg1,arg2,arg3...) 返回传入参数中的最高值。

min(arg1,arg2,arg3...) 返回传入参数中的最高值。

abs(x) : 返回数的绝对值,不会修改x本身值.

ceil(x): 中文意义天花板,意思返回x的向下取整值,不会修改x本身值.

floor(x): 中文意义地板, 意思返回x的向下取整值,不会修改x本身值.

round(x) 返回x的四舍五入整数,算法为Math.floor(x 0.5), 比如round (11.2)= floor(11.7)=11, round(11.6)= floor(12.1)=12

random() 返回 0 ~ 1 之间的随机数, 如果想要范围更大的随机值,则需要再乘以一定的数值来实现。

pow(x,y) 返回 x 的 y 次幂。

exp(x) : 返回e的x方值

log(x) : 返回x的自然对数(log(e)^x的值)

sqrt(x) 返回x的平方根,比如sqrt(4) = 2

valueOf() 返回 Math 对象的原始值。

toSource() 返回该对象的源代码。

示例如下所示:

var x = 25.4;

console.log(Math.ceil(x)); // 26

console.log(Math.round(x)); // 25

console.log(Math.floor(x)); // 25

console.log(Math.sqrt(4)); // 2

console.log(Math.random()); // 返回 0 ~ 1的随机值

console.log(Math.random() * 2); // 返回 0 ~ 2的随机值

console.log(10 Math.random() * 10); // 返回 10 ~ 20的随机值

Math对象

0 人点赞