1.六种数据类型

5种基础的:Undefined,Null,Boolean,Number,String(其中Undefined派生自Null)

1种复杂的:Object(本质是一组无序键值对)

2.字符串转数字

  • Number(str):先求值再转换(先valueOf再toString都不行就是NaN),一般与我们的预期结果不一样,比如Number(”)=Number(false)=Number(null)=0而var x;Number(x)=NaN。。。所以一般都用下面两种方式

  • parseInt(str):可以指定进制,建议使用parseInt(x, 10);这样的格式,即始终指明进制

  • parseFloat(str):不可以指定进制,解析整数时返回整数而不是浮点数

3.获取字符串长度

String类型的值都有length属性。str.length返回串长整数值,而不是通过其它函数来获取串长

4.值传递与地址传递

函数传参都是值传递

5.作用域链

本质是一个,存放了各层的变量对象(类似于编译器的符号表指针栈),变量对象持有该层所有变量和函数的访问权限,如果该层是函数,那么变量对象是arguments对象,栈顶是正在执行的上下文环境对应的变量对象,栈底是全局执行环境对应的变量对象。

6.作用域

没有块级作用域,有函数作用域

7.创建Object对象的2种方法

  1. var obj = new Object();obj.attr = value;

传统的方式,调用构造函数创建对象

  1. var obj = {attr1 : value1, attr2 : value2}或者var obj = {“attr1″ : value1, “attr2″ : value2}

对象字面量表示法,属性名可以是字符串

注意:

  1. 除非属性名有歧义例如:null, var等等,一般不要用字符串做属性名,当然只是习惯约束

  2. 用对象字面量方式定义对象时,不会调用其构造函数

8.访问属性值的两种方法

  1. obj.attr

  2. obj[“attr”] 优点是可以通过变量来访问属性,如var attrName = “attr”;obj[attrName]更灵活

9.数组的声明与初始化

  1. var arr = new Array(value1, value2...);

  2. var arr = Array(...);可以省略new

  3. 数组字面量:var arr = [value1, value2...];

注意:用数组字面量定义数组时也不会调用其构造函数

10.数组相关函数

附录

11.函数声明与函数表达式的区别

  1. function fun(){...} js引擎会在加载源代码时生成该函数对象

  2. var fun = function(){...} js引擎在执行时才会生成该函数对象

12.函数重载

不支持重载。后声明的函数会覆盖先声明的,本质是对函数名进行了多次赋值操作(函数名只是一个指针变量)

13.函数内部特殊属性

  1. arguments.callee 函数指针,指向拥有该arguments对象的函数,即当前函数

  2. this 当前执行环境的引用,顶层的this就是window

  3. arguments.callee.caller 函数指针,指向调用当前函数的函数,没有则返回null

注意:this可以是对象引用或者函数引用,但callee和caller只能是函数引用

14.函数对象的属性和方法

  1. length 函数期望的命名参数的个数,js中可以给函数传递任意多个参数,因为除了形参,还可以用arguments获取任一参数

  2. prototype 指向函数的原型对象

  3. call(context, arg1, arg2...) 用来在特定的作用域中调用函数,解除对象与函数的紧耦合

  4. apply(context, arguments或其它数组对象) 功能同上,支持数组参数

  5. bind/unbind(context, arg1, arg2...) 绑定/解绑执行环境或参数,可以从已有函数生成新函数,但用bind连续绑定是无效的(连续 != 多次),例如:

    function fun(){
    alert(this.data);
    }
    var obj = {
    data : 'obj_data'
    };
    var newObj = {
    data : 'new_obj_data'
    };
    fun1 = fun.bind(obj);
    fun1();
    fun2 = fun1.bind(newObj);//连续绑定
    fun2();
    fun3 = fun.bind(newObj);//多次绑定
    fun3();

    以上代码输出’objdata’, ‘objdata’, ‘newobjdata’,第二次绑定失败了,因为bind函数内部是用call来实现的,连续绑定的效果类似于:

    //第一次绑定得到的函数
    fun1 = fun.call(obj);
    //第二次绑定得到的函数
    fun2 = fun1.call(newObj);

    第二次绑定得到的函数中fun1内部的this确实指向newObj,但fun1中根本没有用到this,所以没有任何影响

15.一些常识

  1. this永远指向自身所属的对象(你是谁的属性,你内部的this就是谁)

    var obj1 = {
    data : 1,
    fun : function(){
    alert(this.data);
    }
    };
    var obj2 = {
    data : 2
    }; obj1.fun();
    obj2.fun = obj1.fun;
    obj2.fun();

    以上代码输出1和2,因为执行过倒数第二句后,obj2新增了一个fun属性,值为obj1.fun的引用,但因为obj2.fun是obj2的属性,所以this指向obj2

  2. 尽量在构造函数原型上定义成员函数,因为直接在构造函数中定义的函数有运行时闭包的开销

  3. 在js中应该用单引号,因为JSON和XML里只有双引号,用单引号可以避免转义

  4. 尽量在变量声明的同时初始化,以便区分undefined表示未声明。因为对已声明但未初始化的变量和未声明的变量用typeof操作符都会返回”undefined”

  5. NaN(Not a Number)与任何值都不相等,包括NaN本身,所以需要用isNaN()函数来判断

  6. 只能给引用类型的值动态地添加属性。给基本类型的值添加属性不会报错但没有任何意义

  7. 数组会根据索引自动增长。需要注意length属性是可写的,也就是说可以动态地设置数组长度,如截掉尾部元素

  8. 函数名只是一个指针变量。function fun{...} fun = null;只是断开了引用关系,函数体并没有被销毁

附录

1.基础数据类型

  1. Undefined 已定义但未初始化的对象的默认值

  2. Null 表示一个空对象指针,所以用typeof检测之返回object

  3. Boolean 布尔值,注意Boolean()转换函数,规则如下:

    1. true/false ~ 不变

    2. 非空字符串/空字符串 ~ true/false

    3. 非0数字/0和NaN ~ true/false

    4. 任何对象/null ~ true/ false

    5. undefined ~ false

    上面这些规则非常重要,因为if条件会自动应用Boolean()转换,而且if(obj)是在js代码中是很常见的,很多时候流程控制错误都是if条件自动转换造成的

  4. Number 数值,js中+0和-0相等,注意NaN,它与任何东西都不相等,包括自身,而且它既不大于n也不小于等于n。Number变量支持toString()函数,可以用来对数值串进行进制转换,例如var num = 17;num.toString(16)返回”11″

  5. String 字符串,注意字符串的不可变性,进行巨量拼接操作时应该用数组 + join而不是循环+

2.Object类型变量的属性和方法

  1. Constructor 保存这构造函数的引用

  2. hasOwnProperty(porpertyName) 用来检查当前对象是否拥有指定属性(此处”属性“包括属性和方法)

  3. isPrototypeOf(obj) 用来当前对象是不是指定对象的原型

  4. propertyIsEnumerable(propertyName) 用来检测指定属性是否可枚举

  5. toLocaleString() 相当于toString()函数,但附加了地区特征

  6. toString() 返回对象的字符串表示

  7. valueOf() 返回对象的字符串、数值或布尔值表示

3.常见引用类型

  1. Function js中函数也是对象,非常灵活,例如:

    var load = window.onload;
    window.onload = function(){
    //do something
    load();//就是这么简单,添一对括号马上执行
    }
  2. Array 数组类型的操作函数是最多的

    1. 栈方函数:push() 在数组末尾插一项, pop() 尾元出栈

    2. 队列函数:push() 同上,shift() 首元出队并返回首元;反向队列(队头进,队尾出)unshift()/pop()

    3. 排序函数:sort(fun) 无参比较字符串升序排列,有璨传入自定义比较函数返回正值/负值/0;reverse() 反转顺序

      注意:sort()/reverse()都会直接改变原数组,而且sort()默认实现方式不太科学,对[1, 3, 10, 5]排序的结果是[1, 10, 3, 5],想要心里想的结果,必须传入自定义比较函数

    4. 操作函数:

      1. arr.concat(arr1, arr2...) 连接形成新数组

      2. arr.slice() 相当于substring对字符串的截取效果,用法也一样

      3. arr.splice() 向数组中部插入项,splice(startIndex, num, item1, item2...) 表示把从startIndex开始的num项替换为各个item,只有前两个参数表示把从startIndex开始的num项换为空(也就是删除),用splice可以实现删除/替换/插入操作。

        注意:splice函数也会直接改变原数组。

    5. 位置函数:indexOf(value)和lastIndexOf(value),查找value的索引位置,没找到返回-1,内部用的是全等操作符(===)

    6. 迭代函数:every(), filter(), forEach(), map(), some()都是对数组中的每一项运行指定方法,IE9+支持且并不常用,在此不展开叙述

    7. 归约函数:reduce(), reduceRight() 不做介绍,原因同上

  3. Date类型:相关内容略多,参见W3School

  4. RegExp类型:var regex = /^cat$/i;创建正则表达式(RegExp类型),支持的模式有g, i, m分别表示全局模式,忽略大小写模式,多行模式。当然,也可以用new RegExp(strRegex, strMode),不过,有什么理由非要去用这种方式呢?

    js支持正则捕获,var matches = regex.exec(text); 通过matches[0], matches[1]...来获取捕获到的内容

    普通的正则匹配:regex.test(text)返回true/false

  5. 基本包装类型:Boolean,String和Number,一直都在见面,只是没有注意到,例如:

    var str = 'smilestome';
    var str_ = str.substring(1);

    以上代码等价于:

    var s1 = new String('smilestome');//创建包装类型实例
    var s2 = s1.substring(1);//在实例上调用相应方法
    s1 = null;//销毁实例

    自动装箱拆箱,为了让基础数据类型用起来更方便,但需要注意:new String()与String()转换方法不同,前者返回object类型,而后者返回string类型,鉴于这样的区别,混用会引起不必要的麻烦,所以我们没有理由显式创建包装类型。Boolean,Number与之类似。

JS学习笔记1_基础与常识的更多相关文章

  1. JavaScript学习笔记1_基础与常识

    1.六种数据类型 5种基础的:Undefined,Null,Boolean,Number,String(其中Undefined派生自Null) 1种复杂的:Object(本质是一组无序键值对) 2.字 ...

  2. Vue.js学习笔记--1.基础HTML和JS属性的使用

    整理自官网教程 -- https://cn.vuejs.org/ 1. 在HTML文件底部引入Vue <script src="https://cdn.jsdelivr.net/npm ...

  3. Vue.js学习笔记--2.基础v-指令

    整理自官网教程 -- https://cn.vuejs.org/ 1. v-bind绑定Class与Style a. 绑定Class 语法:v-bind:class="{classname: ...

  4. js学习笔记:webpack基础入门(一)

    之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...

  5. WebGL three.js学习笔记 使用粒子系统模拟时空隧道(虫洞)

    WebGL three.js学习笔记 使用粒子系统模拟时空隧道 本例的运行结果如图: 时空隧道demo演示 Demo地址:https://nsytsqdtn.github.io/demo/sprite ...

  6. WebGL three.js学习笔记 创建three.js代码的基本框架

    WebGL学习----Three.js学习笔记(1) webgl介绍 WebGL是一种3D绘图协议,它把JavaScript和OpenGL ES 2.0结合在一起,通过增加OpenGL ES 2.0的 ...

  7. vue.js 学习笔记3——TypeScript

    目录 vue.js 学习笔记3--TypeScript 工具 基础类型 数组 元组 枚举 字面量 接口 类类型 类类型要素 函数 函数参数 this对象和类型 重载 迭代器 Symbol.iterat ...

  8. WebGL three.js学习笔记 6种类型的纹理介绍及应用

    WebGL three.js学习笔记 6种类型的纹理介绍及应用 本文所使用到的demo演示: 高光贴图Demo演示 反光效果Demo演示(因为是加载的模型,所以速度会慢) (一)普通纹理 计算机图形学 ...

  9. Vue.js学习笔记(2)vue-router

    vue中vue-router的使用:

随机推荐

  1. [RF]怎样用Robot Framework写好Test Case?

    1.介绍 这是一个关于如何用Robot Framework写好Test Case的高层次的指导准则 怎样实际的与系统进行交互不在此文档范围内 最重要的准则是使测试用例尽可能的让熟悉此领域的人觉得简单易 ...

  2. Activiti5 添加/查询审批批注(审批意见)

    Activiti5 添加/查询审批批注 Activiti 工作流开发,23张表中,act_hi_commit 中,用于保存流程审核的批注信息:  调用:   taskServer.addComment ...

  3. 实现WireCard支付

    实现WireCard支付,暂未完成 WireCardController.cs using System; using System.Collections.Generic; using System ...

  4. 【算法】Escape

    The students of the HEU are maneuvering for their military training. The red army and the blue army ...

  5. 【Linux】CentOS 7.2 安装 MySQL 5.7.21 解压版

    安装环境/工具 1.Linux(CentOS 7.2版) 2.mysql-5.7.21-linux-glibc2.12-x86_64.tar.gz 安装步骤 1.下载mysql解压版(mysql-5. ...

  6. android bug笔记

    昨天集成一个第三方的联盟sdk,然后执行它的代码,程序就会crash,这个第三方的sdk报错日志后面,紧跟着一个友盟分享的报错,我现在也不明白这里是为何把友盟给扯进来了,因为我这步骤操作上并没有调用任 ...

  7. excel怎样添加的选项卡中含有下拉列表

    <customUI xmlns="http://schemas.microsoft.com/office/2006/01/customui"> <ribbon s ...

  8. DocumentType类型

    并不常用 nodeType 10 nodeName doctype的名称 NodeValue 值为null parentNode Document 不支持子节点 DocumentType不能动态创建, ...

  9. spring mvc 文件上传工具类

    虽然文件上传在框架中,已经不是什么困难的事情了,但自己还是开发了一个文件上传工具类,是基于springmvc文件上传的. 工具类只需要传入需要的两个参数,就可以上传到任何想要上传的路径: 参数1:Ht ...

  10. php,ajax上传文件,多文件上传

    HTML <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF- ...