JavaScript：数据类型
JavaScript中数据类型分为两种：
1、基本数据类型
string number boolean null undefined
2、引用类型
数组、Object、function
一、基本数据类型
二、引用类型
1、Array
Array类型有两种定义方式：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>数组</title>
<script>
window.onload=function(){
//Array类型
//第一种使用Array构造函数
var arr=new Array();
arr[0]="1";// 数组默认索引从0开始
arr[1]="2";
//
var arr1=new Array("a","b","c");
// 使用字面量的表示法
var arr2=[1,2,3,4,5];
// 数组里面可以包含各种数据类型
var arr3=[1,"2",true,[1,2],{id:1}];
// 访问数组元素
console.log(arr3[4].id);
};
</script>
</head>
<body> </body>
</html>
把代码复制到浏览器里面运行结果：
2、object类型
2.1 使用构造函数的方式创建对象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>对象</title>
<script>
window.onload=function(){
// object类型
// 第一种object构造函数
var obj=new Object();
// 属性
obj.name="tom";
obj.age=24;
// 方法
obj.action=function(){
console.log("我的名字是:"+this.name+",年龄是:"+this.age);
};
// 输出name属性的值
console.log("姓名:"+obj.name);
// 执行方法
obj.action();
};
</script>
</head>
<body> </body>
</html>
执行结果：
2.2 使用字面量的方式创建对象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>对象</title>
<script>
window.onload=function(){
// object类型
// 第一种object构造函数
/* var obj=new Object();
// 属性
obj.name="tom";
obj.age=24;
// 方法
obj.action=function(){
console.log("我的名字是:"+this.name+",年龄是:"+this.age);
};
// 输出name属性的值
console.log("姓名:"+obj.name);
// 执行方法
obj.action(); */ // 第二种字面量
// 1、简单字面量
var obj1={};
obj1.name="tom";
obj1.age=24;
obj1.action=function(){
console.log("我是简单字面量")
};
// 属性
console.log(obj1.name);
// 方法
obj1.action();
// 2、嵌套字面量
var obj2={
name:"jack",
age:25,
action:function(){
console.log("我是嵌套字面量");
}
};
// 属性
console.log(obj2.age);
// 方法
obj2.action();
};
</script>
</head>
<body> </body>
</html>
运行结果：
2.3 使用工厂方式创建对象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>对象</title>
<script>
window.onload=function(){
// object类型
// 第一种object构造函数
/* var obj=new Object();
// 属性
obj.name="tom";
obj.age=24;
// 方法
obj.action=function(){
console.log("我的名字是:"+this.name+",年龄是:"+this.age);
};
// 输出name属性的值
console.log("姓名:"+obj.name);
// 执行方法
obj.action(); */ // 第二种字面量
/* // 1、简单字面量
var obj1={};
obj1.name="tom";
obj1.age=24;
obj1.action=function(){
console.log("我是简单字面量")
};
// 属性
console.log(obj1.name);
// 方法
obj1.action();
// 2、嵌套字面量
var obj2={
name:"jack",
age:25,
action:function(){
console.log("我是嵌套字面量");
}
};
// 属性
console.log(obj2.age);
// 方法
obj2.action(); */ // 第三种工厂方式
function createObj(){
var obj3=new Object();
obj3.name="kevin";
obj3.action=function(){
console.log("我是通过工厂方式创建的对象");
};
// 返回创建的对象
return obj3;
};
// 引用
var obj4=createObj();
// 输出属性
console.log(obj4.name);
// 调用方法
obj4.action();
// 工厂方式也可以使用传递参数的方式
function createObjWithPara(name,age){
var obj5={
name:name,
age:age,
action:function(){
console.log("我是调用参数的工厂方式创建的对象");
}
};
//
return obj5;
}; var obj6=createObjWithPara("jon",30);
// 输出属性
console.log("姓名："+obj6.name+",年龄："+obj6.age);
// 调用方法
obj6.action();
};
</script>
</head>
<body> </body>
</html>
执行结果：
2.4 使用构造函数的方式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>对象</title>
<script>
window.onload=function(){
// object类型
// 第一种object构造函数
/* var obj=new Object();
// 属性
obj.name="tom";
obj.age=24;
// 方法
obj.action=function(){
console.log("我的名字是:"+this.name+",年龄是:"+this.age);
};
// 输出name属性的值
console.log("姓名:"+obj.name);
// 执行方法
obj.action(); */ // 第二种字面量
/* // 1、简单字面量
var obj1={};
obj1.name="tom";
obj1.age=24;
obj1.action=function(){
console.log("我是简单字面量")
};
// 属性
console.log(obj1.name);
// 方法
obj1.action();
// 2、嵌套字面量
var obj2={
name:"jack",
age:25,
action:function(){
console.log("我是嵌套字面量");
}
};
// 属性
console.log(obj2.age);
// 方法
obj2.action(); */ /* // 第三种工厂方式
function createObj(){
var obj3=new Object();
obj3.name="kevin";
obj3.action=function(){
console.log("我是通过工厂方式创建的对象");
};
// 返回创建的对象
return obj3;
};
// 引用
var obj4=createObj();
// 输出属性
console.log(obj4.name);
// 调用方法
obj4.action();
// 工厂方式也可以使用传递参数的方式
function createObjWithPara(name,age){
var obj5={
name:name,
age:age,
action:function(){
console.log("我是调用参数的工厂方式创建的对象");
}
};
//
return obj5;
}; var obj6=createObjWithPara("jon",30);
// 输出属性
console.log("姓名："+obj6.name+",年龄："+obj6.age);
// 调用方法
obj6.action(); */ // 第四种构造函数 首字母大写，使用驼峰命名方式 相当于一个公共的方法
function CreateObj(){
this.name="tom";
this.action=function(){
console.log(this.name);
}
};
// 实例化
var obj7=new CreateObj();
// 输出属性
console.log(obj7.name);
// 调用方法
obj7.action(); };
</script>
</head>
<body> </body>
</html>
运行结果：
注意：构造函数的方式也可以传递参数。
3、function
function创建函数有以下两种方式：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>function类型</title>
<script>
window.onload=function(){
// function 类型 创建函数
// 函数声明
function fun(name){
return name;
};
// 函数表达式
var fun2=function(name){
return name;
};
};
</script>
</head>
<body> </body>
</html>
两种方式的区别：
两种创建函数的执行顺序不同，解析器会先读取函数声明，函数表达式必须要等待解析器执行到相应的代码才会执行。看下面的代码
1、函数声明的方式创建函数，创建的函数可以在函数声明前或者函数声明后调用：
函数声明前调用：
函数声明后调用：
2、函数表达式只能在其之后调用
如果在前面调用会直接报错：
JavaScript：数据类型的更多相关文章
- Javascript：Javascript数据类型详解
要成为一个优秀的前端工程师,系统的学习Javascript,有夯实的Javascript基础,以及对语言本身的深刻的理解,是基本功.从Javascript数据类型开始,我将对Javascript知识体 ...
- JavaScript数据类型 typeof, null, 和 undefined
JavaScript 数据类型 在 JavaScript 中有 5 种不同的数据类型: string number boolean object function 3 种对象类型: Object Da ...
- 网页、JavaScript 数据类型
JavaScript 数据类型 一.基本数据类型: 字符串.数字.布尔.日期和时间 JavaScript 拥有动态类型 JavaScript 拥有动态类型.这意味着相同的变量可用作不同的类型: 1 v ...
- javascript数据类型、初始化
Javascript数据类型有6种: 数值型数据类型(Number): 字符串(String): 布尔型数据(Boolean): 对象数据(Object): 空(Null): 未定义(Undefine ...
- 第九十九节，JavaScript数据类型
JavaScript数据类型 学习要点: 1.typeof操作符 2.Undefined类型 3.Null类型 4.Boolean类型 5.Number类型 6.String类型 7.Object类型 ...
- Javascript数据类型共有六种
Javascript数据类型共有六种 /* var box; alert(typeof box); // box是Undefined类型,值是undefined,类型返回的字符串是undefined ...
- JavaScript复习之--javascript数据类型隐式转换
JavaScript数据类型隐式转换.一,函数类 isNaN() 该函数会对参数进行隐式的Number()转换,如果转换不成功则返回true. alert() 输出的内容隐式的 ...
- 数据的分类-JavaScript数据类型
JavaScript数据类型 1.数据类型是什么? 我们接触的绝大多数程序语言来说,把数据都进行了分类,包括数字.字符.逻辑真假:int,long,string,boolean....等等:我们都知道 ...
- js基础--javaScript数据类型你都弄明白了吗？绝对干货
欢迎访问我的个人博客:http://www.xiaolongwu.cn 数据类型的分类 JavaScript的数据类型分为两大类,基本数据类型和复杂数据类型. 基本数据类型:Null.Undefine ...
- 每天五分钟-javascript数据类型
javascript数据类型分为基本数据类型与复杂数据类型 基本数据类型包括:string,number,boolean,null,undefined,symbol(es6) 复杂数据类型包括:obj ...
随机推荐
- c++中浮点数精度设置
1.包含头文件<iomanip>,附注manip是manipulator,操控的简写. 2.第一种写法: cout<<setiosflags(ios::); 第二种写法: co ...
- Android 如何在Eclipse 引入外部纯Java项目（不是打成Jar使用）
应用情景--如标题: 在Eclipse的 “Android启动项目”中引入“外部的纯Java项目”,能运行的只有是基于Android的测试代码才可以. 一直很纳闷,如果外部写好一个Java插件(例如服 ...
- autofac IOC
http://www.cnblogs.com/liupeng/p/4806184.html srvanyui 自建服务
- Xcode6中添加pch文件
转自:http://www.cnblogs.com/YouXianMing/p/3989155.html 1. 新建工程: 2. 创建pch文件: 3. 在setting里面进行设置: 4. 一切尽在 ...
- ssl与tls的差别
1)版本号:TLS记录格式与SSL记录格式相同,但版本号的值不同,TLS的版本1.0便 用的版 本号为SSLv3.1. 2) 报文鉴别码:SSLv3.0和TLS的MAC算法的范围不同,但两者的安全层度 ...
- mydqldump 备份数单库 然后还原数据的时候报:ERROR 1881 (HY000) at line 52: Operation not allowed when innodb_forced_recovery > 0.
修改my.cnf innodb_force_recovery = 1 修改为: innodb_force_recovery = 0
- 【驱动】USB驱动实例·串口驱动·键盘驱动
Preface USB体系支持多种类型的设备. 在 Linux内核,所有的USB设备都使用 usb_driver结构描述. 对于不同类型的 USB设备,内核使用传统的设备驱动模型建立设备驱动 ...
- 【教程】InstallShield使用完全教程
InstallShield Installshield是一个强大和易于使用,用于解决Windows软件安装包开发的制作工具.用它可以以传统MSI方式和虚拟格式,自动化地封装.捆绑和包装你的产品. In ...
- 三者互ping，PC，虚拟机，uboot，nfs网络文件系统搭建
要想实现三者互ping,韦老师虽然专门出了视频说明,但是在自己配置过程还是出现了问题,这里记录一下解决办法,虽然我也不知道原因,但是解决了出现的问题也实现了三者互ping. 首先,我的硬件设备是PC通 ...
- log4j打印错误异常的详细堆栈信息
一.问题场景 使用Logger.error方法时只能打印出异常类型,无法打印出详细的堆栈信息,使得定位问题变得困难和不方便. 二.先放出结论 Logger类下有多个不同的error方法,根据传入参数的 ...