美文网首页
note1.对象,数组,字符串,变量

note1.对象,数组,字符串,变量

作者: trayliu_小马过河 | 来源:发表于2017-07-20 16:03 被阅读17次

    JavaScript语言的标准,被称为ECMAScript标准
    JavaScript版本 ECMAScript 6标准(简称ES6)
    JavaScript严格区分大小写

    数据类型

    JavaScript不区分整数和浮点数,统一用Number表示
    Number可以直接做四则运算
    注意:NaN ,Infinity

    123; // 整数123
    0.456; // 浮点数0.456
    1.2345e3; // 科学计数法表示1.2345x1000,等同于1234.5
    -99; // 负数
    NaN; // NaN表示Not a Number,当无法计算结果时用NaN表示
    Infinity; // Infinity表示无限大,当数值超过了JavaScript的Number所能表示的最大值时
    ,就表示为Infinity
    

    运算符

    && 、 || 、 ! 同java逻辑相同,不再叙述。
    实际上,JavaScript允许对任意数据类型做比较:

    false == 0; // true
    false === 0; // false
    
    相等运算符

    JavaScript在设计时,有两种比较运算符:"==" 和 "===";

    ==: 它会自动转换数据类型再比较,很多时候,会得到非常诡异的结果;

    ===: 它不会自动转换数据类型,如果数据类型不一致,返回false,如果一致,再比较。

    由于JavaScript这个设计缺陷,不要使用==比较,始终坚持使用===比较。

    另一个例外是NaN这个特殊的Number与所有其他值都不相等,包括它自己:

      NaN === NaN; // false
    唯一能判断NaN的方法是通过isNaN()函数:
    
    isNaN(NaN); // true
    
    浮点数的相等比较:
      1 / 3 === (1 - 2 / 3); // false
    

    这不是JavaScript的设计缺陷。浮点数在运算过程中会产生误差,因为计算机无法精确表示无限循环小数。要比较两个浮点数是否相等,只能计算它们之差的绝对值,看是否小于某个阈值:

      Math.abs(1 / 3 - (1 - 2 / 3)) < 0.0000001; // true
    
    对象

    JavaScript的对象是一组由键-值组成的无序集合。JavaScript对象的键都是字符串类型,值可以是任意数据类型。

    var person = {
    name: 'Bob',
    age: 20,
    tags: ['js', 'web', 'mobile'],
    city: 'Beijing',
    hasCar: true,
    zipcode: null
    };
    

    上述person对象一共定义了6个键值对,其中每个键又称为对象的属性,例如,person的name属性为'Bob',zipcode属性为null。

    变量

    在JavaScript中,使用等号=对变量进行赋值。可以把任意数据类型赋值给变量,同一个变量可以反复赋值,而且可以是不同类型的变量,但是要注意只能用var申明一次,例如:

    var a = 123; // a的值是整数123
    a = 'ABC'; // a变为字符串
    
    静态语言与动态语言

    这种变量本身类型不固定的语言称之为动态语言,与之对应的是静态语言。静态语言在定义变量时必须指定变量类型,如果赋值的时候类型不匹配,就会报错。例如java是静态语言。

    strict模式

    启用strict模式的方法是在JavaScript代码的第一行写上:

    'use strict';
    

    字符串

    JavaScript的字符串就是用''或""括起来的字符表示。对于字符串的处理subtring, index of, toUpperCase()

    转义字符\

    如果字符串内部既包含'又包含"怎么办?

      'I\'m \"OK\"!';
    

    转义字符\可以转义很多字符,比如\n表示换行,\t表示制表符,字符\本身也要转义,所以\表示的字符就是\。

    多行字符串

    由于多行字符串用\n写起来比较费事,所以最新的ES6标准新增了一种多行字符串的表示方法,用反引号 表示:

    `这是一个
      多行
    字符串`;
    
    模板字符串

    ${ } 模板代码,同样为ES6新增

    var name = '小明';
    var age = 20;
    var message = `你好, ${name}, 你今年${age}岁了!`;
    alert(message);
    

    数组

    JavaScript的Array可以包含任意数据类型,并通过索引来访问每个元素。(真是一门没有节操的语言)

    请注意!

    直接给Array的length赋一个新的值会导致Array大小的变化:

    var arr = [1, 2, 3];
    arr.length; // 3
    arr.length = 6;
    arr; // arr变为[1, 2, 3, undefined, undefined, undefined]
    arr.length = 2;
    arr; // arr变为[1, 2]
    

    Array可以通过索引把对应的元素修改为新的值,因此,对Array的索引进行赋值会直接修改这个Array:

    var arr = ['A', 'B', 'C'];
    arr[1] = 99;
    arr; // arr现在变为['A', 99, 'C']
    

    注意!

    如果通过索引赋值时,索引超过了范围,同样会引起Array大小的变化:

    var arr = [1, 2, 3];
    arr[5] = 'x';
    arr; // arr变为[1, 2, 3, undefined, undefined, 'x']
    
    slice

    slice()就是对应String的substring()版本,它截取Array的部分元素,然后返回一个新的Array:

    var arr = ['A', 'B', 'C', 'D', 'E', 'F', 'G'];
    arr.slice(0, 3); // 从索引0开始,到索引3结束,但不包括索引3: ['A', 'B', 'C']
    arr.slice(3); // 从索引3开始到结束: ['D', 'E', 'F', 'G']
    
    注意到slice()的起止参数包括开始索引,不包括结束索引。
    

    如果不给slice()传递任何参数,它就会从头到尾截取所有元素。利用这一点,我们可以很容易地复制一个Array:

    var arr = ['A', 'B', 'C', 'D', 'E', 'F', 'G'];
    var aCopy = arr.slice();
    aCopy; // ['A', 'B', 'C', 'D', 'E', 'F', 'G']
    aCopy === arr; // false
    

    push和pop

    push()向Array的末尾添加若干元素,pop()则把Array的最后一个元素删除掉:

    var arr = [1, 2];
    arr.push('A', 'B'); // 返回Array新的长度: 4
    arr; // [1, 2, 'A', 'B']
    arr.pop(); // pop()返回'B'
    arr; // [1, 2, 'A']
    arr.pop(); arr.pop(); arr.pop(); // 连续pop 3次
    arr; // []
    arr.pop(); // 空数组继续pop不会报错,而是返回undefined
    arr; // []
    
    unshift和shift

    如果要往Array的头部添加若干元素,使用unshift()方法,shift()方法则把Array的第一个元素删掉:

    var arr = [1, 2];
    arr.unshift('A', 'B'); // 返回Array新的长度: 4
    arr; // ['A', 'B', 1, 2]
    arr.shift(); // 'A'
    arr; // ['B', 1, 2]
    arr.shift(); arr.shift(); arr.shift(); // 连续shift 3次
    arr; // []
    arr.shift(); // 空数组继续shift不会报错,而是返回undefined
    arr; // undefined
    
    sort

    sort()可以对当前Array进行排序,它会直接修改当前Array的元素位置,直接调用时,按照默认顺序排序:

    var arr = ['B', 'C', 'A'];
    arr.sort();
    arr; // ['A', 'B', 'C']
    
    reverse

    reverse()把整个Array的元素给掉个个,也就是反转:

    var arr = ['one', 'two', 'three'];
    arr.reverse(); 
    arr; // ['three', 'two', 'one']
    
    splice

    splice()方法是修改Array的“万能方法”,它可以从指定的索引开始删除若干元素,然后再从该位置添加若干元素:

    var arr = ['Microsoft', 'Apple', 'Yahoo', 'AOL', 'Excite', 'Oracle'];
    // 从索引2开始删除3个元素,然后再添加两个元素:
    arr.splice(2, 3, 'Google', 'Facebook');
     // 返回删除的元素 ['Yahoo', 'AOL', 'Excite']
    arr; // ['Microsoft', 'Apple', 'Google', 'Facebook', 'Oracle']
    // 只删除,不添加:
    arr.splice(2, 2); // ['Google', 'Facebook']
    arr; // ['Microsoft', 'Apple', 'Oracle']
    // 只添加,不删除:
    arr.splice(2, 0, 'Google', 'Facebook'); // 返回[],因为没有删除任何元素
    arr; // ['Microsoft', 'Apple', 'Google', 'Facebook', 'Oracle']
    
    concat

    concat()方法把当前的Array和另一个Array连接起来,并返回一个新的Array:

    var arr = ['A', 'B', 'C'];
    var added = arr.concat([1, 2, 3]);
    added; // ['A', 'B', 'C', 1, 2, 3]
    arr; // ['A', 'B', 'C']
    

    请注意,concat()方法并没有修改当前Array,而是返回了一个新的Array。

    实际上,concat()方法可以接收任意个元素和Array,并且自动把Array拆开,然后全部添加到新的Array里:

    var arr = ['A', 'B', 'C'];
    arr.concat(1, 2, [3, 4]); // ['A', 'B', 'C', 1, 2, 3, 4]
    

    join

    join()方法是一个非常实用的方法,它把当前Array的每个元素都用指定的字符串连接起来,然后返回连接后的字符串:

      var arr = ['A', 'B', 'C', 1, 2, 3];arr.join('-'); // 'A-B-C-1-2-3'
    
    如果Array的元素不是字符串,将自动转换为字符串后再连接。
    多维数组

    如果数组的某个元素又是一个Array,则可以形成多维数组,例如:

      var arr = [[1, 2, 3], [400, 500, 600], '-'];
    

    上述Array包含3个元素,其中头两个元素本身也是Array。

    对象

    JavaScript的对象是一种无序的集合数据类型,它由若干键值对组成。
    value可以是任意类型
    JavaScript的对象用于描述现实世界中的某个对象。例如,为了描述“小明”这个淘气的小朋友,我们可以用若干键值对来描述他:

    var xiaoming = {
    name: '小明',
    birth: 1990,
    school: 'No.1 Middle School',
    height: 1.70,
    weight: 65,
    score: null
    };
    

    JavaScript用一个{...}表示一个对象,键值对以xxx: xxx形式申明,用,隔开。注意,最后一个键值对不需要在末尾加,,如果加了,有的浏览器(如低版本的IE)将报错。

    如果属性名包含特殊字符,就必须用''括起来:

    var xiaohong = {
    name: '小红',
    'middle-school': 'No.1 Middle School'
    };
    

    xiaohong的属性名middle-school不是一个有效的变量,就需要用''括起来。访问这个属性也无法使用.操作符,必须用['xxx']来访问:

    xiaohong['middle-school']; // 'No.1 Middle School'
    xiaohong['name']; // '小红'
    xiaohong.name; // '小红'
    

    也可以用xiaohong['name']来访问xiaohong的name属性,不过xiaohong.name的写法更简洁。我们在编写JavaScript代码的时候,属性名尽量使用标准的变量名,这样就可以直接通过object.prop的形式访问一个属性了。

    实际上JavaScript对象的所有属性都是字符串,不过属性对应的值可以是任意数据类型。

    如果访问一个不存在的属性会返回什么呢?JavaScript规定,访问不存在的属性不报错,而是返回undefined:

    var xiaoming = {
    name: '小明'
    };
    xiaoming.age; // undefined
    
    动态类型

    由于JavaScript的对象是动态类型,你可以自由地给一个对象添加或删除属性:

    var xiaoming = {
    name: '小明'
    };
    xiaoming.age; // undefined
    xiaoming.age = 18; // 新增一个age属性
    xiaoming.age; // 18
    delete xiaoming.age; // 删除age属性
    xiaoming.age; // undefined
    delete xiaoming['name']; // 删除name属性
    xiaoming.name; // undefined
    delete xiaoming.school; // 删除一个不存在的school属性也不会报错
    

    如果我们要检测xiaoming是否拥有某一属性,可以用in操作符:

    var xiaoming = {
    name: '小明',
    birth: 1990,
    school: 'No.1 Middle School',
    height: 1.70,
    weight: 65,
    score: null
    };
    'name' in xiaoming; // true
    'grade' in xiaoming; // false
    不过要小心,如果in判断一个属性存在,这个属性不一定是xiaoming的,
    它可能是xiaoming继承得到的:
    'toString' in xiaoming; // true
    

    因为toString定义在object对象中,而所有对象最终都会在原型链上指向object,所以xiaoming也拥有toString属性。

    hasOwnProperty()

    要判断一个属性是否是xiaoming自身拥有的,而不是继承得到的,可以用hasOwnProperty()方法:

    var xiaoming = {
    name: '小明'
    };
    xiaoming.hasOwnProperty('name'); // true
    xiaoming.hasOwnProperty('toString'); // false

    相关文章

      网友评论

          本文标题:note1.对象,数组,字符串,变量

          本文链接:https://www.haomeiwen.com/subject/kfhlkxtx.html