JavaScript数据类型

值类型(基本类型)：
- 字符串（String）
- 数字(Number)
- 布尔(Boolean)
- 空（Null，可将变量的值设为 null 来清空变量）
- 未定义（Undefined，表示变量不含有值)
- Symbol（ ES6 引入的一种新的原始数据类型，表示独一无二的值）
引用数据类型（对象类型）：
- 对象(Object)
- 数组(Array)
- 函数(Function)
- 特殊的对象：正则（RegExp）
- 特殊对象：日期（Date）

1　JavaScript 拥有动态类型

- 相同的变量可用作不同的类型
- 变量的数据类型可使用 typeof 操作符来查看

var x;typeof(x);//'undefined'
x="john";typeof(x);//'string'
x=3.14;typeof(x);//'number'
x=[1,2,3];typeof(x);//'object'
x={name:"John",age:25};typeof(x);//'object'
x=true;typeof(x);//'boole'

2　JavaScript对象

在 JavaScript中，几乎所有的事物都是对象。
JavaScript 对象是拥有属性和方法的数据。
JavaScript 对象也是一个变量，但其可以包含多个值（多个变量），每个值以 name:value 对呈现，因此，JavaScript 对象是变量的容器。

2.1　JavaScript 对象的定义

使用字符来定义和创建 JavaScript 对象，如：

var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"，fullname:function(){}};

或者：

var person = {
    firstName:"John",
    lastName:"Doe",
    age:50,
    eyeColor:"blue"，
　　fullname:function(){}
};

定义 JavaScript 对象可以跨越多行，空格跟换行不是必须的

2.2　JavaScript 对象的属性

"JavaScript 对象是变量的容器"。但通常还是认为 "JavaScript 对象是键值对的容器"。键值对通常写法为 name : value (键与值以冒号分割)。
键值对在 JavaScript 对象通常称为 对象属性
JavaScript 对象是属性变量的容器。
可以通过两种方式访问对象属性：

person.lastName;//方式一
person['lastName'];//方式二

2.3　JavaScript 对象的方法

对象的方法定义了一个函数，并作为对象的属性存储，通过添加 () 调用 (作为一个函数)。如：

name = person.fullName();

通常 fullName() 是作为 person 对象的一个方法， fullName 是作为一个属性。如果使用 fullName 属性，不添加 (), 它会返回函数的定义：

name = person.fullName;

3　JavaScript 字符串

　　JavaScript 字符串用于存储和处理文本，可以存储一系列字符，如 "John Doe"

3.1　字符串的创建

//使用单引号''或双引号""创建字符串原始值
var createStringValue1='John';//使用单引号
var createStringValue2="Mike";//使用双引号

//使用new关键字创建字符串对象
var createStringObject1=new string('John');//使用单引号
var createStringObject2=new string("John");//使用双引号

//一般不建议使用new关键字创建字符串对象，它会拖慢执行速度，可能还会产生副作用
createStringValue1===createStringObject1;//false,要求绝对相等，但二者类型不同，等式左边类型是string,右边是object

3.2　字符串中字符的访问

　　使用字符串的索引位置来访问字符串中的字符，索引从 0 开始，即第一个字符索引值为 [0],第二个为 [1], 以此类推

var accessChar="JavaScript";
accessChar[0];//J
accessChar[3];//a
accessChar[4];//S

3.3　使用转义符号（\）处理字符串中的特殊字符

在字符串中使用引号，字符串中的引号不要与创建的字符串引号相同，也可以在字符串添加转义字符（\）来使用引号
特殊字符均可使用转义符号（\）处理

\' 单引号
\" 双引号
\\ 反斜杠
\n 换行
\r 回车
\t tab(制表符)
\b 退格符
\f 换页符

//与创建引号不相同
var answer = "It's alright";
var answer = "He is called 'Johnny'";
var answer = 'He is called "Johnny"';

//使用转义符号（\）
var x = 'It\'s alright';
var y = "He is called \"Johnny\"";

var NG="We are the so-called "Vikings" from the north."//将会被截断为We are the so-called
var OK="We are the so-called\ "Vikings\" from the north."

3.4　字符串的属性和方法

通常， JavaScript 字符串是原始值。但也可以是对象
- 原始值字符串，如 "John"没有属性和方法(因不是对象)
- 原始值可使用 JavaScript 的属性和方法（因 JavaScript 在执行方法和属性时可把原始值当作对象）

3.4.1　字符串的属性

constructor 返回创建字符串属性的函数
length 返回字符串的长度
prototype 允许您向对象添加属性和方法

3.4.2　字符串的方法

charAt() 返回指定索引位置的字符
charCodeAt() 返回指定索引位置的字符
concat() 连接两个或多个字符串，返回连接后的字符串
omCharCode() 将 Unicode 转换为字符串
indexOf() 返回字符串中检索指定字符第一次出现的位置
lastIndexOf() 返回字符串中检索指定字符最后一次出现的位置
localeCompare() 用本地特定的顺序来比较两个字符串
match() 找到一个或多个正则表达式的匹配
replace() 替换与正则表达式匹配的子串
search() 检索与正则表达式相匹配的值
slice() 提取字符串的片断，并在新的字符串中返回被提取的部分
split() 把字符串分割为子字符串数组
substr() 从起始索引号提取字符串中指定数目的字符
substring() 提取字符串中两个指定的索引号之间的字符
toLocaleLowerCase() 根据主机的语言环境把字符串转换为小写，只有几种语言（如土耳其语）具有地方特有的大小写映射
toLocaleUpperCase() 根据主机的语言环境把字符串转换为大写，只有几种语言（如土耳其语）具有地方特有的大小写映射
toLowerCase() 把字符串转换为小写
toString() 返回字符串对象值
toUpperCase() 把字符串转换为大写
trim() 移除字符串首尾空白
valueOf() 返回某个字符串对象的原始值

4　JavaScript数字

JavaScript 不是类型语言。不定义不同类型的数字（如整数、短、长、浮点等），它只有一种数字类型，即所有的数字都是浮点类型

4.1　JavaScript数字的表示

可使用也可不使用小数点来书写数字
极大或极小的数字可通过科学（指数）计数法来写

var pi=3.14;    // 使用小数点
var x=34;       // 不使用小数点
var y=123e5;    // 12300000
var z=123e-5;   // 0.00123

4.2 　所有 JavaScript 数字均为 64 位

　　JavaScript 采用 IEEE754 标准定义的 64 位浮点格式表示数字：

- 其中 0 到 51 存储数字（片段），52 到 62 存储指数，63 位存储符号
- 它能表示最大值（Number.MAX_VALUE）为 ±1.7976931348623157e+308，最小值（Number.MIN_VALUE）为 ±5e-324

4.3　精度

整数（不使用小数点或指数计数法）最多为 15 位
小数的最大位数是 17，但是浮点运算并不总是 100% 准确

var x = 999999999999999;   // x 为 999999999999999
var y = 9999999999999999;  // y 为 10000000000000000

var x = 0.2+0.1; // 输出结果为 0.30000000000000004

4.4　进制

默认情况下，JavaScript 数字为十进制显示
前缀为 0，则 JavaScript 会把数值常量解释为八进制数（不要在数字前面写零，除非确实需要进行八进制转换）
前缀为 0 和 "x"，则解释为十六进制数
可以使用 toString() 方法输出16进制、8进制、2进制

var y = 0555;//365（5x8x8+5x8+5x1）
var z = 0xFF;//255（15x16+15x1） 

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

4.5　无穷大（Infinity）与非数字值（NaN）

当数字运算结果超过了JavaScript所能表示的数字上限（溢出），结果为一个特殊的无穷大值，在JavaScript中以Infinity表示
当负数的值超过了JavaScript所能表示的负数范围，结果为负无穷大，在JavaScript中以-Infinity表示
无穷大值（要保留正负号）的行为特性和我们所期望的是一致的：基于它们的加、减、乘和除运算结果还是无穷大（如除以0也产生了无限大）
无穷大是一个数字
NaN 属性是代表非数字值的特殊值。该属性用于指示某个值不是数字
可以把 Number 对象设置为该值，来指示其不是数字值
可以使用 isNaN() 全局函数来判断一个值是否是 NaN 值

var x = 2/0;//infinity
var y = -2/0;//-infinity
isNaN(x); // 返回 false，即infinity是数字
isNaN(y); // 返回 false, 即infinity是数字

var x = 1000 / "Apple"; isNaN(x); // 返回 true,即x是NaN
var y = 100 / "1000"; isNaN(y); // 返回 false,即y是数字，"1000"程序会强制转化为数字类型

4.6　数字的属性和方法

数字可以是数字或者数字对象
数字可以直接进行初始化，就像 x = 123
JavaScript 数字对象初始化数据， var y = new Number(123)（不建议这样使用，一是会拖慢速度，二是可能产生副作用）

var x = 123;
var y = new Number(123);
typeof(x) // 返回 Number
typeof(y) // 返回 Object
(x === y) // 为 false，因为 x 是一个数字，y 是一个对象，使用绝对相等时，就产生了副作用

4.6.1　数字的属性

Number.MAX_VALUE 最大值
Number.MIN_VALUE 最小值
Number.NaN 非数字
Number.NEGATIVE_INFINITY 负无穷，在溢出时返回
Number.POSITIVE_INFINITY 正无穷，在溢出时返回
Number.EPSILON 表示 1 和比最接近 1 且大于 1 的最小 Number 之间的差
Number.MIN_SAFE_INTEGER 最小安全整数
Number.MAX_SAFE_INTEGER 最大安全整数

4.6.2　数字的方法

Number.parseFloat() 将字符串转换成浮点数，和全局方法 parseFloat() 作用一致
Number.parseInt() 将字符串转换成整型数字，和全局方法 parseInt() 作用一致
Number.isFinite() 判断传递的参数是否为有限数字
Number.isInteger() 判断传递的参数是否为整数
Number.isNaN() 判断传递的参数是否为 isNaN()
Number.isSafeInteger() 判断传递的参数是否为安全整数

4.6.3 数字类型原型上的部分方法

toExponential() 返回一个数字的指数形式的字符串，如：1.23e+2
toFixed() 返回指定小数位数的表示形式
toPrecision() 返回一个指定精度的数字。如下例子中，a=123 中，3会由于精度限制消失

var a=123;
b=a.toFixed(2); // b="123.00"

var a=123;
b=a.toPrecision(2); // b="1.2e+2"

5　JavaScript函数

　　函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。

5.1　函数的定义

JavaScript 定义函数可以使用关键字 function
JavaScript 定义函数可以使用内置的函数构造器Function()

5.1.1　JavaScript 使用关键字 function 定义函数

函数可以通过声明定义，函数声明后不会立即执行，在需要时调用
函数也可以是一个表达式，存储在变量里，不需要函数名称，通常通过变量名来调用，这样的函数也称 匿名函数 (即函数没有名称)

//函数声明的语法
function functionName(parameters) {
  //执行的代码块
}

//函数声明
function myFunction(a, b) {
    return a * b;
}

//函数表达式
var x = function (a, b) {return a * b};//匿名函数
var z = x(4, 3);//x当作函数使用

5.1.2　JavaScript 使用内置函数构造器 Function() 定义函数

使用 new 关键字与内置的函数构造器Function()定义函数（不推荐，因在 JavaScript 中，很多时候需要避免使用 new 关键字）

var myFunction = new Function("a", "b", "return a * b");//等同：var myFunction =function("a", "b", "return a * b");
var x = myFunction(4, 3);

5.2　函数的参数

　　 JavaScript 函数对参数的值没有进行任何的检查。

5.2.1　函数显式参数(Parameters)与隐式参数(Arguments)

函数显式参数在函数定义时列出
函数隐式参数在函数调用时传递给函数真正的值

5.2.2　参数规则

JavaScript 函数定义显式参数时没有指定数据类型
JavaScript 函数对隐式参数没有进行类型检测
JavaScript 函数对隐式参数的个数没有进行检测

5.2.3　默认参数

ES5 中如果函数在调用时未提供隐式参数，会默认设置为undefined，有时这可以接受，但建议最好为参数设置一个默认值：
ES6 支持函数带有默认参数
默认参数设置方法（undefined 和 || 的操作）

//直接判断undefined，设置默认参数
function myFunction(x, y) {
    if (y === undefined) {
          y = 0;
    } 
}
//推荐精简设置默认参数方式：结合undefined和||操作
function myFunction(x, y) {
    y = y || 0;//如y已定义,y是true，y||0返回y，否则返回0，因undefined为false
}

//ES6支持默认参数，其实现就是采用上述精简方式
function myFunction(x, y = 10) { // y is 10 if not passed or undefined 
　　return x + y; 
} 
myFunction(0, 2) // 输出 2 
myFunction(5); // 输出 15, y 参数的默认值

5.2.4　参数传递（两种方式：值传递和对象传递）

JavaScript 隐式参数通过值来传递：
- 在函数中调用的参数是函数的隐式参数
- JavaScript 隐式参数通过值来传递：函数仅仅只是获取值
- 如果函数修改参数的值，不会修改显式参数的初始值（在函数外定义）
- 隐式参数的改变在函数外是不可见的
JavaScript 隐式参数通过对象传递
- 在JavaScript中，可以引用对象的值
- 在函数内部修改对象的属性就会修改其初始的值
- 修改对象属性可作用于函数外部（全局变量）
- 修改对象属性在函数外是可见的
arguments 对象

JavaScript 函数有个内置的对象 arguments 对象，包它含了函数调用的参数数组
如果函数调用时设置了过多的参数，参数将无法被引用，因无法找到对应的参数名。只能使用 arguments 对象来调用
arguments 对象的应用

x = findMax(1, 123, 500, 115, 44, 88); 
function findMax() {//获取传入参数的最大值
    var i, max = arguments[0];    
    if(arguments.length < 2) return max; 
    for (i = 0; i < arguments.length; i++) {
        if (arguments[i] > max) {
            max = arguments[i];
        }
    }
    return max;
}

x = sumAll(1, 123, 500, 115, 44, 88); 
function sumAll() {//对传入参数求和
    var i, sum = 0;
    for (i = 0; i < arguments.length; i++) {
        sum += arguments[i];
    }
    return sum;
}

5.3　函数的调用

JavaScript 函数有 4 种调用方式。每种方式的不同在于 this 的初始化
一般而言，在Javascript中，this指向函数执行时的当前对象
this 是保留关键字，你不能修改 this 的值

5.3.1　作为一个函数调用

作为一个函数调用是调用 JavaScript 函数常用的方法，但非良好的编程习惯，此时函数是全局变量，容易造成命名冲突的bug
如果函数没有明确属于哪个对象，在 JavaScript 中它始终默认属于全局对象的
在 HTML 中默认的全局对象是 HTML 页面本身，所以函数是属于 HTML 页面
在浏览器中的页面对象是浏览器窗口(window 对象)，所以函数会自动变为属于 window 对象
当函数没有被自身的对象调用时 this 的值就会变成全局对象。使用window 对象作为一个变量容易造成程序崩溃

function myFunction(a, b) {
    return a * b;
}
myFunction(10, 2);           // 返回 20
window.myFunction(10, 2);    // 同样返回20，声明window.myFunction(10, 2)与myFunction(10,2)是一样的

function myFunction() { 
　　return this; 
} 
myFunction(); // 返回 window 对象，使用 window 对象作为一个变量容易造成程序崩溃

5.3.2　函数作为方法调用

在 JavaScript 中你可以将函数定义为对象的方法
函数作为对象方法调用，会使得 this 的值成为对象本身

var myObject = {
    firstName:"John",
    lastName: "Doe",
    fullName: function () {
        return this.firstName + " " + this.lastName;
    }
　　thisValue:function() {
　　　　　return this;
　　}
}
myObject.fullName();// 返回 "John Doe"
myObject.thisValue();//返回[Object object]即所有者对象

5.3.3　使用构造函数调用函数

在函数调用前使用 new 关键字, 则是调用了构造函数
这看起来就像创建了新的函数，但实际上 JavaScript 函数是重新创建的对象
构造函数中 this 关键字没有任何的值。this 的值在函数调用实例化对象(new object)时创建

// 构造函数:
function myFunction(arg1, arg2) {
    this.firstName = arg1;
    this.lastName  = arg2;
} 
// This creates a new object
var x = new myFunction("John","Doe");
x.firstName;                             // 返回 "John"

5.3.4　作为函数方法调用函数

在 JavaScript 中, 函数是对象。JavaScript 函数有它的属性和方法，call() 和 apply() 是预定义的函数方法，均可用于调用函数
- 两个方法都使用了对象本身作为第一个参数
- 第二个参数存在区别： apply传入的是一个参数数组，可将多个参数组合成为一个数组传入，而call则作为call的参数传入（从第二个参数开始）
- 在 JavaScript 严格模式(strict mode)下, 在调用函数时第一个参数会成为 this 的值，即使该参数不是一个对象
- 在 JavaScript 非严格模式(non-strict mode)下, 如果第一个参数的值是 null 或 undefined, 它将使用全局对象替代
通过 call() 或 apply() 方法你可以设置 this 的值, 且作为已存在对象的新方法调用

function myFunCf(a, b) {
    return a * b; 
}

function myFunJf(a, b) {
    return a + b; 
}

//this指向自身
myObjCf = myFunCf.call(myFunCf, 10, 2); // 返回 20,call()
myArray = [10, 2];
myFunCf = myFunCf.apply(myFunCf, myArray); // 返回 20,apply()

//this指向非自身
myFunCf.apply(new myFunJf(), myArray); // 返回 12
myFunJf.call(new myFunCf(), 2,10); // 返回 20

5.3.5　函数与变量作用域

调用带参数的函数
- 当声明函数时，推荐把参数作为变量来声明
- 在调用函数时，可以向其传递值（这些值被称为参数），这些参数可以在函数中使用
- 可以发送任意多的参数，由逗号 (,) 分隔，变量和参数必须以一致的顺序出现。第一个变量就是第一个被传递的参数的给定的值，以此类推
- 函数很灵活，可以使用不同的参数来调用该函数

//声明函数时，将参数作为变量声明
function myFunction(var1,var2)
{
　　//代码
}
//调用时，发送位置对应的多个参数，分号隔开
myFunction(argument1,argument2)；
myFunction(v1,v2);//v1,v2与argument1，argument2不同

带有返回值的函数
- 有时，希望函数将值返回调用它的地方，使用 return 语句就可以实现
- 函数执行return 语句后，返回指定的值并退出函数，但整个 JavaScript 并不会停止执行，它会从调用函数的地方继续执行
- 仅仅只是希望退出函数时，也可使用 return 语句。返回值是可选的

function myFunction(x)
{
    return x;
}
var myVar=myFunction(5);//函数将返回值5存储到myVar变量种
document.getElementById("demo").innerHTML=myFunction(5);//直接将返回值给到页面ID为demo的元素

function myFunction(a,b)//直接返回没有值，退出函数
{
    if (a>b)
    {
        return;
    }
    x=a+b
}

局部 JavaScript 变量
- 在 JavaScript 函数内部声明的变量（使用 var）是局部变量（该变量的作用域是局部的），只能在函数内部访问它
- 在不同的函数中可以使用名称相同的局部变量，不会出现冲突（因只有声明过该变量的函数才能识别出该变量）
- 函数运行完毕，局部变量就会被删除

全局 JavaScript 变量
- 在函数外声明的变量是全局变量，网页上的所有脚本和函数都能访问它

JavaScript 变量的生存期
- JavaScript 变量的生命期从它们被声明的时间开始
- 局部变量会在函数运行以后被删除
- 全局变量会在页面关闭后被删除
向未声明的 JavaScript 变量分配值
- 把值赋给尚未声明的变量，该变量将被自动作为 window 的一个属性
- 非严格模式下给未声明变量赋值，创建的是全局变量，是全局对象的可配置属性，可以删除

carname="Volvo";

var var1 = 1; //不可配置全局属性
var2 = 2; //没有使用 var 声明，可配置全局属性

console.log(this.var1); // 1
console.log(window.var1); // 1
console.log(window.var2); // 2

delete var1; // false 无法删除
console.log(var1); //1

delete var2; 
console.log(delete var2); // true
console.log(var2); // 已经删除 报错变量未定义

5.3.6　函数自调用

5.4　提升（Hoisting）

提升（Hoisting）是 JavaScript 默认将当前作用域提升到前面去的行为
提升（Hoisting）应用在变量的声明与函数的声明。因此，函数、变量可以在声明之前使用
使用表达式定义函数时无法提升

myFunction(5);//调用函数在先，定义函数在后
function myFunction(y) {
    return y * y;
}

posted @ 2023-02-25 17:48 好记心不如烂笔头阅读(51) 评论(0) 收藏举报

刷新页面返回顶部

学无止尽

孔子曰：“三人行，必有我师焉！”

JavaScript数据类型

JavaScript数据类型

1 JavaScript 拥有动态类型

2 JavaScript对象

2.1 JavaScript 对象的定义

2.2 JavaScript 对象的属性

2.3 JavaScript 对象的方法

3 JavaScript 字符串

3.1 字符串的创建

3.2 字符串中字符的访问

3.3 使用转义符号（\）处理字符串中的特殊字符

3.4 字符串的属性和方法

3.4.1 字符串的属性

3.4.2 字符串的方法

4 JavaScript数字

4.1 JavaScript数字的表示

4.2 所有 JavaScript 数字均为 64 位

4.3 精度

4.4 进制

4.5 无穷大（Infinity）与非数字值（NaN）

4.6 数字的属性和方法

4.6.1 数字的属性

4.6.2 数字的方法

4.6.3 数字类型原型上的部分方法

5 JavaScript函数

5.1 函数的定义

5.1.1 JavaScript 使用关键字 function 定义函数

5.1.2 JavaScript 使用内置函数构造器 Function() 定义函数

5.2 函数的参数

5.2.1 函数显式参数(Parameters)与隐式参数(Arguments)

5.2.2 参数规则

5.2.3 默认参数

5.2.4 参数传递（两种方式：值传递和对象传递）

5.3 函数的调用

5.3.1 作为一个函数调用

5.3.2 函数作为方法调用

5.3.3 使用构造函数调用函数

5.3.4 作为函数方法调用函数

5.3.5 函数与变量作用域

5.3.6 函数自调用

5.4 提升（Hoisting）

公告

1　JavaScript 拥有动态类型

2　JavaScript对象

2.1　JavaScript 对象的定义

2.2　JavaScript 对象的属性

2.3　JavaScript 对象的方法

3　JavaScript 字符串

3.1　字符串的创建

3.2　字符串中字符的访问

3.3　使用转义符号（\）处理字符串中的特殊字符

3.4　字符串的属性和方法

3.4.1　字符串的属性

3.4.2　字符串的方法

4　JavaScript数字

4.1　JavaScript数字的表示

4.2 　所有 JavaScript 数字均为 64 位

4.3　精度

4.4　进制

4.5　无穷大（Infinity）与非数字值（NaN）

4.6　数字的属性和方法

4.6.1　数字的属性

4.6.2　数字的方法

5　JavaScript函数

5.1　函数的定义

5.1.1　JavaScript 使用关键字 function 定义函数

5.1.2　JavaScript 使用内置函数构造器 Function() 定义函数

5.2　函数的参数

5.2.1　函数显式参数(Parameters)与隐式参数(Arguments)

5.2.2　参数规则

5.2.3　默认参数

5.2.4　参数传递（两种方式：值传递和对象传递）

5.3　函数的调用

5.3.1　作为一个函数调用

5.3.2　函数作为方法调用

5.3.3　使用构造函数调用函数

5.3.4　作为函数方法调用函数

5.3.5　函数与变量作用域

5.3.6　函数自调用

5.4　提升（Hoisting）