JavaScript数据类型学习笔记分享


Posted in Javascript onSeptember 01, 2016

本文实例为大家讲解JavaScript数据类型的相关资料,供大家参考,具体内容如下

1.引用类型
引用类型的值是引用类型的一个实例,引用类型是一种数据结构,用于将数据和功能组织在一起,也常被叫做类。
对象时某个特定引用类型的实例,新对象是使用new操作符后跟一个构造函数来创建的,构造函数本身就是函数,是出于创建新对象的目的而定义的。

 var person = new Object();

2.Object类型
(1)Object类型对于应用程序中存储和传输数据来说,是非常理想的选择。
(2)Object类型实例创建方式:
使用new加Object构造函数。

<script type="text/javascript">
      var person = new Object();
      person.name = "peter";
      alert(person.name);
 </script>

使用对象字面量的表示方法。

var dog = {
        name:"kity",
        age:3,
        eye:bigEyes
      };

这种创建方法,由一对花括号开始,前面是变量名,后面是冒号,再是属性值,可以有多个属性,但是每个属性之间必须使用逗号分隔,最后一个属性一般是不加逗号的。其中属性名也可以是字符串。如果花括号里面不写东西,那么只可以定义包含默认属性和方法的对象。

一般来说,访问对象属性使用点表示法,在javascript中使用方括号[]来访问对象的属性。在使用[]时,应该将要访问的属性以字符串的形式放在[]中。

 alert(person["name"]);
    alert(person.name);

前者可以通过变量访问属性。
如果属性名中包含会导致语法错误的字符,属性名使用的是关键字或保留字,也可以使用方括号。
除非必须使用变量来访问属性,否则我们建议使用点表示法。

3.Array类型
javascript中的数组是有序列表,它可以保存任意类型的数据,这是和其他语言数组的最大区别,而且它的数组的大小是可以动态调整的。
(1)创建数组的基本方式:
使用Array构造函数,可以给他传值(数组的大小或者数组的内容)

var student = new Array();
  var student = new Array(10);
  var student = new Array("peter","merry","bob");

(2)使用数组字面量的表示方法,数组字面量由一对包含数组项的方括号表示,多个数组之间用逗号隔开。
(3)在读取和设置数组的值时,使用方括号和对应值基于0的数字索引。
数组的长度保存在length属性中,这个属性值可以返回0或者更大的数值。可以通过设置length属性的值,从数组的末尾删除或者增加新的项。

var colors = ["red","blue","green"];
  colors.length = 2;//数组长度变成了2,green被移除
  alert(colors[2]);//此时访问会返回undefined,alert(colors[1]);会返回blue

如果将Length属性设置为大于数组项目的值,则新增的每一项都会返回undefined值。

var colors = ["red","blue","green"];
  colors.length = 5;
  alert(colors[4]);

利用length属性在数组末尾增加项。

var colors = ["red","blue","green"];
  alert(colors[colors.length]="black");

(4)数组最多可以包含4294967295个项
(5)检测数组
使用Array.isArray()方法,它可以最终确定该值是不是数组,而且不管他是在哪个全局执行环境中创建的。

if(Array.isArray){
    //operates 
  }

(6)转换方法
所有对象都具有toLocaleString(),toString()和valueOf()方法,其中,调用数组的toString()方法会返回由数组中每个值得字符串形式拼接而成的一个以逗号分隔的字符串。valueOf()会返回数组。
当调用toLocaleString()方法时,会创建一个数组值得以逗号分隔的字符串,与前面的不同是,为了取得每一项的值,调用的是每一项的toLocaleString()方法,而不是toString()方法。

<script type="text/javascript">
      var person1 = {
        toString : function(){
          return "peter";
        },
        toLocaleString :function(){
          return "mary";
        }
      };
      var person2 = {
        toString: function(){
          return "26";
        },
        toLocaleString:function(){
          return "18";
        }
      };
      var person = [person1,person2];
      alert(person);
      alert(person.toString());
      alert(person.toLocaleString());
    </script>

使用join()方法可以用不同的分隔符来构建这个字符串,join()方法只接收一个参数,用作分隔符的字符串,然后返回包含所有数组项的字符串。如果不给join()方法传入任何值,或者传入undefined,使用逗号作为分隔符。如果数组中的某一项的值是null或undefined,那么该值在join(),toString(),toLocaleString()和valueOf()方法返回的结果中以空字符串表示。

<script type="text/javascript">
      var person1 = {
        toString : function(){
          return "peter";
        },
        toLocaleString :function(){
          return "mary";
        }
      };
      var person2 = {
        toString: function(){
          return "26";
        },
        toLocaleString:function(){
          return "18";
        }
      };
      var person = [person1,person2];
      alert(person);
      alert(person.toString());
      alert(person.toLocaleString());
      alert(person.join("*"));
      alert(person.join("--"));
    </script>

(7)栈方法
栈就是数据结构中的栈,他的特点就是先进后出,而且所有的操作只发生在栈顶,javascript提供了push()和pop()方法,可以实现类似于栈的行为。
push()可以接收任意数量的参数,并且逐个添加到数组的末尾,并返回修改后数组的长度。
pop()方法可以从数组末尾移除最后一项,减少数组的lengthh值,然后返回移除的顶。
(8)队列方法
队列的数据结构特点是先进先出,队列在列表末端添加项,从列表的前端移除项。
push()可以向数组的末端添加项,shift()可以移除数组中的第一个项,并返回该项,数组长度减1;unshift()可以在数组前端添加任意个项并返回新数组的长度。
(9)重排序方法
reverse()会反转数组的顺序
默认情况下,sort()按照升序排列数组项(最小值位于最前面,最大值位于最后面,为了实现排序,sort()方法会调用每个数组项的toString()转型方法,然后比较得到的字符串,来确定如何排序)。sort()可以接收一个比较函数作为参数,比较函数接收两个参数,如果第一个参数应该位于第二个之前,返回一个负数,如果两个参数相等则返回0,如果第一个参数应该位于第二个之后返回一个正数。
reverse()和sort()方法的返回值都是经过排序之后的数组。
(10)操作方法
concat()可以基于当前数组中的所有项创建一个新数组。
slice()可以基于当前数组中一个或多个项创建一个新数组,slice()可以接收一个或两个参数,要返回项的起始和结束位置,。参数为一个时,会返回该参数指定位置开始到当前数组末尾的所有项;如果有两个参数,返回起始和结束位置之间的项,但是不包括结束位置的项。
splice()方法:主要用于向数组的中部插入项
删除:可以删除任意数量的项,只需要指定2个参数,要删除的第一项的位置和要删除的项数。
插入:可以向指定位置插入任意数量的项,只需提供三个参数,起始位置和0和要插入的项。
替换:可以向指定位置插入任意数量的项,且同时删除任意数量的项,只需指定3个参数,起始位置,要删除的项数和要插入的任意数量的项,插入项数不必与删除的项数相等。
splice()总会返回一个数组,该数组中包含从原始数组中删除的项(如果没有删除任何项,则返回一个空数组)。
(11)位置方法
这两个方法都可以接收两个参数,要查找的项和表示查找起点位置的索引,都返回要查找的项在数组中的位置,或在没有找到的情况下返回-1,在比较第一个参数与数组中的每一项时,会使用全等操作符,要查找的项必须严格相等。
indexOf():从数组的开头开始向后查找
lastIndexOf():从数组的末尾开始向前查找。
(12)迭代方法
javascript为数组提供了5个迭代方法,每个方法都接收两个参数:要在每一项运行的函数和(可选的)作用域对象(影响this的值),传入这些方法中的函数会接收三个参数:数组项的值,该数组中的位置和数组对象本身。
every():对数组中每一项运行给定函数,如果该函数对每一项都返回true,则返回true.
filter():对数组中每一项运行给定函数,返回该函数会返回true的项组成的数组
forEach():对数组中每一项运行给定函数,这个方法没有返回值
map():对数组中每一项运行给定函数,返回每次函数调用的结果组成的数组
some():对数组中每一项运行给定函数,如果该函数对任一项返回true,则返回true.
上面的方法都不会修改数组中的包含值。
every()和sum()都用于查询数组中的项是否满足某个条件
(13)缩小方法
下面的两个方法都会迭代数组的所有项,然后构建一个最终返回的值。都接收两个参数:一个在每一项上调用函数和(可选的)作为缩小基础的初始值。传给这两个方法接收4个参数:前一个值,当前值,项的索引和数组对象。这个函数返回的任何值都会作为第一个参数自动传给下一项,第一次迭代发生在数组的第二项上,因此第一个参数是数组的第一项,第二个参数是数组的第二项。
reduce():从数组的第一项开始,逐个遍历到最后。可以执行求数组中所有值得和的操作。

<script type="text/javascript">
      var values=[1,2,3,4,5];
      var sum = values.reduce(function(prev,cur,index,array){
        return prev + cur;
      });
      alert(sum);
  </script>

reduceRight():从数组最后一项开始,向前遍历到第一项。可以执行求数组中所有值得和的操作。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 存在陷阱 删除某一区域所有节点
May 10 Javascript
jQuery快速上手:写jQuery与直接写JS的区别详细解析
Aug 26 Javascript
node.js中的fs.chmodSync方法使用说明
Dec 18 Javascript
AngularJS基础知识笔记之表格
May 10 Javascript
深入解析JavaScript中的立即执行函数
May 21 Javascript
浅谈javascript中的加减时间
Jul 12 Javascript
详解angular2封装material2对话框组件
Mar 03 Javascript
详解如何在vue中使用sass
Jun 21 Javascript
Vue2.x中利用@font-size引入字体图标报错的解决方法
Sep 28 Javascript
vue实现点击按钮切换背景颜色的示例代码
Jun 23 Javascript
JS异步宏队列与微队列原理区别详解
Jul 02 Javascript
Vue v-for中的 input 或 select的值发生改变时触发事件操作
Aug 31 Javascript
js实现文字超出部分用省略号代替实例代码
Sep 01 #Javascript
纯js和css完成贪吃蛇小游戏demo
Sep 01 #Javascript
在web中js实现类似excel的表格控件
Sep 01 #Javascript
Javascript点击按钮随机改变数字与其颜色
Sep 01 #Javascript
AngularJs 指令详解及示例代码
Sep 01 #Javascript
JS表格组件BootstrapTable行内编辑解决方案x-editable
Sep 01 #Javascript
JS实现列表的响应式排版(推荐)
Sep 01 #Javascript
You might like
phpMyAdmin链接MySql错误 个人解决方案
2009/12/28 PHP
PHP 一个页面执行时间类代码
2010/03/05 PHP
php 仿Comsenz安装效果代码打包提供下载
2010/05/09 PHP
PHP+iframe图片上传实现即时刷新效果
2016/11/18 PHP
使用laravel和ECharts实现折线图效果的例子
2019/10/09 PHP
Wordpress ThickBox 添加“查看原图”效果代码
2010/12/11 Javascript
json原理分析及实例介绍
2012/11/29 Javascript
js(jQuery)获取时间的方法及常用时间类搜集
2013/10/23 Javascript
Egret引擎开发指南之发布项目
2014/09/03 Javascript
AngularJS 使用$sce控制代码安全检查
2016/01/05 Javascript
基于JavaScript实现鼠标悬浮弹出跟随鼠标移动的带箭头的信息层
2016/01/18 Javascript
jQuery图片轮播功能实例代码
2017/01/29 Javascript
js实现上下左右弹框划出效果
2017/03/08 Javascript
JS实现课堂随机点名和顺序点名
2017/03/09 Javascript
vue中使用极验验证码的方法(附demo)
2019/12/04 Javascript
vue中解决拖拽改变存在iframe的div大小时卡顿问题
2020/07/22 Javascript
javascript代码实现简易计算器
2021/01/25 Javascript
用python删除java文件头上版权信息的方法
2014/07/31 Python
Python实现比较两个列表(list)范围
2015/06/12 Python
实例详解Matlab 与 Python 的区别
2019/04/26 Python
django 中的聚合函数,分组函数,F 查询,Q查询
2019/07/25 Python
Python GUI学习之登录系统界面篇
2019/08/21 Python
Python的pygame安装教程详解
2020/02/10 Python
python使用Thread的setDaemon启动后台线程教程
2020/04/25 Python
Python开发.exe小工具的详细步骤
2021/01/27 Python
英国折扣零售连锁店:QD Stores
2018/12/08 全球购物
高分子材料与工程专业推荐信
2013/12/01 职场文书
网上开店必备创业计划书
2014/01/26 职场文书
幼儿园安全责任书
2014/04/14 职场文书
大学生翘课检讨书范文
2014/10/06 职场文书
工作表扬信范文
2015/01/17 职场文书
签字仪式主持词
2015/07/03 职场文书
感恩父母主题班会
2015/08/12 职场文书
Golang的继承模拟实例
2021/06/30 Golang
Python办公自动化解决world文件批量转换
2021/09/15 Python
SQL Server远程连接的设置步骤(图文)
2022/03/23 SQL Server