早期整理的js知识点

I javascript数据类型

一、六种数据类型

五种基本类型(原始类型):

  1. Number
  2. String
  3. Boolean
  4. Null
  5. Undefined

一种对象类型

  • Object(Function,Array,Date...)

二、隐式转换

巧用‘+’ 和 ‘-’隐式转换规则

  • 最常用且容易疑惑的是加法运算,除了算数意义,还表示字符串拼接:
    var a = 'The answer is ' + 47;//The answer is 47
    '37' + 7 = 377
    '37' - 7 = 30 //把字符串转换成数值类型

'=='等于,类型不同时,尝试类型转换和比较

  • ‘1.23’ == 1.23 //string转number
  • 0 == false// boolean转number
  • null == undefined
  • new Object() == new Object()
  • [1,2] == [1,2]
  • object == number | string //尝试对象转为基本类型
  • 其他false

'==='全等于

  • 类型不同,返回false
  • 类型相同
    NaN != NaN
    new Object == new Object
    null === null
    undefined ===undefined

三、包装对象

临时性的对象,用完即时删除,设置属性时访问不到。


基本类型的包装对象
基本类型的包装对象

四、类型检测

常用类型检测方法:

  1. typeof:适用于检测基本类型


    typeof
    typeof
  2. instanceof:适用于检测对象的类型,值得注意到是,不同window或iframe间的对象类型检测不能用instanceof


    instanceof
    instanceof
  3. Object.prototype.toString:


    Object.prototype.toString
    Object.prototype.toString

类型检测小结:

II javascript表达式和运算符

1.表达式

表达式是指能计算出值的任何可用程序单元 --Wiki
表达式是一种js短语,可以使js解释器用来产生一个值。--《Js权威指南》

1.1 原始表达式

  • 常量,直接量:3.14,“test”
  • 关键字:null,this,true
  • 变量:i,j,k

1.2 数组,对象的初始化表达式

  • [1,2]
    new Array(1,2)
  • [1,,,4]
    [1,undefined,undefined,4]
  • {x:1,y:2}
    var o =new Object();o.x=1;o.y=2;

1.3 函数表达式

  • var fe = function(){};
  • (function(){console.log("hello world!");})();
  • function add(){};

1.4 属性访问表达式

  • var o = {x:1}
    o.x
    o['x']

1.5 调用表达式

  • funcName()

1.6 对象创建表达式

  • new Func(1,2);
  • new Object;

2.运算符

2.1 常用运算符

常用运算符
常用运算符

2.2 特殊运算符

特殊运算符
特殊运算符

2.3 运算优先级

运算优先级
运算优先级

III javascript语句和严格模式

1.语句(statement)

  • block,break,continue,empty,if...else,switch,try catch
  • var,function,return,do...while,for,for..in,while
  • debugger,label,with

2.块(block)

快语句常用于组合0~多个语句。块语句用一对{}定义,但是没有块级作用域,有函数作用域

有函数作用域


有函数作用域
有函数作用域

没有块级作用域


没有块级作用域
没有块级作用域

3.严格模式(use strict)

严格模式是一种特殊的执行模式,它修复了部分语言上的不足,提供更强的错误检查,并增强安全性。


严格模式
严格模式

IV javascript对象

1.概述

对象中包含一系列属性,这些属性使无序的。每个属性都有一个字符串key和对应的value:
var obj = {x:1,y:2};
obj.x = 1;
obj.y = 2;

2.对象的结构

2.1 结构图解:

对象obj是函数foo的一个实例(var obj = new foo()),而函数foo的原型上定义了一个属性z(foo.prototype.z = 3),对象obj除了自身的x,y属性外,还继承了z属性,那是因为对象obj内部的[[prototype]]属性(指针)指向函数foo的原型,在查找对象属性时查找到了z属性。之外它还拥有[[class]],[[extensible]]等对象标签和writable,enumerable等属性标签。


对象的结构
对象的结构

2.2 对象创建

  1. 对象字面量
    var obj1 = {x:1,y:2}
    var obj2 = {
    x:1,
    y:2,
    o:{
    z:3,
    n:4
          }
    };
  1. new Object
    new Object
    new Object

    new Object2
    new Object2
  2. Object.create


    Object.create
    Object.create

2.3 属性操作

  1. 属性读写


    属性读写
    属性读写
  1. 属性删除


    属性删除
    属性删除
  2. 属性检测
    属性检测
    属性检测

    属性检测
    属性检测
  3. 属性枚举


    属性枚举
    属性枚举

3.getter setter

3.1 get/set 关键字定义方法

3.2 一些复杂的应用,检测输入是否合法

3.3 get/set与原型链的关系

当尝试去修改位于原型上的属性时,如果是一般属性,则可以在对象内部创建新值以修改。如果要修改的属性含有get关键字,那么就不能修改。要想尝试去修改的话,可以调用Object的定义属性方法。



同样的,如果尝试修改原型上的属性是只读的(writable=false,默认是false),也不能直接修改。还是要用Object.defineProperty()方法去修改。


4.属性标签

4.1 定义属性

方法getOwnPropertyDescripor(对象,’属性名‘)(标签属性访问器)用于获取属性的标签。该方法以键值对形式返回一个对象。
方法defineProperty(对象,‘属性’,{标签:值})自定义属性的配置信息。



方法keys(对象)枚举对象上的属性,对于设置了不可枚举(enumerable:false)的属性不枚举出来。


4.2 定义多个属性

方法defineProperties(对象,{
属性1:{value:"",标签:值},
属性2:{value:"",标签:值}
})定义多个属性。



结合get/set方法定义属性



属性权限对照表

5.对象标签

5.1对象原型标签指向对应的原型(原型链的形成)

5.2 表示对象的类别(属于哪类引用类型)

5.3 扩展性标签(对标签进行修改)

6.序列化和其它对象方法

6.1把对象序列化为JSON数据和解析json数据

值为undefined的属性序列化时不显示,值为NaN或Infinity的属性会转换成null,new Date()会被转换为UTC。


6.2自定义序列化方法toJSON:function(){}

6.3 其它对象方法

V javascript数组(Array)

1 创建数组、数组操作

  1. js中数组是弱类型的,数组中的每一项可以保存任何类型的数据
    var arr = [1,true,null,undefined,{x:1},[1,2.3]];
  • js中数组的大小是动态可调整的,可以随着数据的添加自动增长
    var arr = [1,2,3,4,5];
    arr[5] = 6; // 增加第5项
    arr.length //6 自动增长,也可以动态修改
    arr[2]; //3 访问数组第2项
  • 创建数组-使用Array构造函数
    var arr = new Array();
    var arr = new Array(20); //如果是数值,指定长度;如果是其它类型,则创建包含这个值的只有一项的数组
    var arr = new Array(“red”,“blue”,“orange”,“black”); //指定元素
    var arr = Array(); //可以省略new关键字
  • 创建数组-数组字面量表示法(不会调用Array构造函数)
    var arr = [1,2,3,4];
    var arr = []; //空数组
  • 检测数组
    if(Array.isArray( 要检测的数组 )){//对数组执行操作}
  • 转换方法
    var arr = ['a','b','c'];
    arr.toString(); //拼接成一个以逗号分隔的字符串 a,b,c
    arr.valueOf(); //返回原数组
    alert(arr); //同toString(),会在后台调用toString()方法
    arr.join(','); //a,b,c
    arr.join('|'); //a|b|c
    如果数组中的某一项的值是null或undefined,该值在join(),toString(),toLocaleString()和valueOf()方法的返回结果中以空字符串显示

2 数组方法

  1. 栈方法(后进先出-向后推入push(),末尾取出pop())
    var arr = new Array();
    arr.push('NBA','AT&T'); // 推入2项
    arr.pop(); // 取得最后一项 'AT&T'
  1. 队列方法(先进先出-向前推入unshift(),前端取出shift())
    var arr =new Array(1,2,3);
    arr.unshift('num'); //在前端添加一项
    arr.shift(); //取得第一项
  2. 重排序方法(升序排序sort(),反转排序reverse())
    sort() 方法会调用每个数组项的toString()转型方法,比较的是字符串。所以不是最佳方案
    创建比较函数:
    function compare1(v1,v2) {
    if (v1 < v2) {
    return -1;
    }else if (v1 > v2) {
    return 1;
    }else{
    return 0;
    }
    };
    //对于数值类型的比较方法
    function compare2(v1,v2) {
    return v2 - v1;
    };
    var arr = [0,1,10,5];
    arr.sort(compare1);//会得到正确的数值排序0,1,5,10
  3. 数组迭代


  4. 二维数组


  5. Array.prototype.concat()


  6. Array.prototype.slice()


  7. Array.prototype.splice()


  8. Array.prototype.forEach()


  9. Array.prototype.map()


  10. Array.prototype.filter()


  11. Array.prototype.every&some()


  12. Array.prototype.reduce&reduceRight()


  13. Array.prototype.indexOf&lastIndexOf()


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 159,716评论 4 364
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,558评论 1 294
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 109,431评论 0 244
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,127评论 0 209
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,511评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,692评论 1 222
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,915评论 2 313
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,664评论 0 202
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,412评论 1 246
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,616评论 2 245
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,105评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,424评论 2 254
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,098评论 3 238
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,096评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,869评论 0 197
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,748评论 2 276
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,641评论 2 271

推荐阅读更多精彩内容