web前端—基础知识03讲

极客晨逸
143 阅读12分钟

数据类型

  • Number类型
  • String类型
  • Boolean类型
  • undefined
  • null
  • object
  • symbol(es6新增加的)

break 和continue之间的区别

  • break:语句用于跳出代码块或循环。
  • continue:语句用于立即终止本轮循环，返回循环结构的头部开始下一轮循环。

javascript确定一个值是什么类型的三种方法

  • typeof运算符
    • 缺点：typeof null 返回null;
    • 缺点：引用类型的值返回 "object"
  • instanceof：判断实例对象是不是类（构造函数）的实例：写法： obj instancof Object
  • Object.prototype.toString.call([]) // "[object Array]" 这种方法是最好使的。

与数值相关的方法

  • 需要注意的是：在ES6开始将这几个方法移至到了Number对象上，目的是逐渐减少全局方法，是JS更模块化。
  • Number.parseInt():用于将字符串转为整数。
    • 如果字符串头部有空格，空格会被自动去除。
    • 如果parseInt的第一个参数不是字符串，则会先转为字符串再转换。
    • 如果第一个参数(字符串)不能转化为数字则会返回NaN,所以parseInt()的返回值只能是十进制整数和NaN。
    • 还允许有第二个参数的存在，表示被解析值的进制(2-36)，默认是十进制。
    • 如果第二个参数的数值不在2-36范围内直接返回NAN。
    • 如果第二个参数为： 0 null undefined则会被直接忽略，按默认值10来处理。
  • Number.parseFloat()：parseFloat()方法用于将一个字符串转为浮点数。
  • Number.isNaN()方法可以用来判断一个值是否为NaN。
  • 如果是ES5的isNaN()方法，如果传入其他值，会被先转成数值,如果传入的是字符串则字符串是会被转化为NAN，最后返回的结果是true。也就是时说iSNaN返回的true的时候不一定是NaN有可能是一个字符串
  • 出于同样的原因，对于对象和数组，ES5的isNaN()也返回true。但是，对于空数组和只有一个数值成员的数组，isNaN返回false，能转化为false是因为这些数能被Number函数转化为数值类型
isNaN('hello')//true
console.log(isNaN({}));//true
isNaN([]) // false
isNaN([123]) // false
isNaN(['123']) // false
  • ES5中：isFinite():该方法返回一个布尔值，表示某个值是否为正常的数值,除了Infinity、-Infinity和NaN这三个值会返回false，isFinite对于其他的数值都会返回true
  • ES6中：Number.isFinite():该方法用来检查一个数值是否为有限的（finite），即不是Infinity,如果参数类型不是数值，一律返回false。
  • Number.isInteger(): 该方法用来判断一个数值是否为整数，需要注意点的是：Number.isInteger(25) === Number.isInteger(25.0),因为JavaScript内部整数和浮点数采用的同样的储存方式。
  • Number.trunc(): 去掉小数点。
  • Number.sign(): 判断一个数是正数、负数、0。

字符串

  • undefined 和 null 是没有toString()方法的如果强制调运则会报错，其他的数据类型是都有该方法的
  • NAN是可以转化为一个字符串的，因为它也是数值类型的值，也是可以调运toString()方法的。
//快速转换字符串的方法
var num = 123456;
var res = num + '';
console.log(typeof res);//string
  • 字符串可以被视为字符数组，因此可以使用数组的方括号运算符，用来返回某个位置的字符（位置编号从0开始），例如： 'hello world'[2] // 返回：l
  • 如果方括号中的数字超过字符串的长度，或者方括号中根本不是数字，则返回undefined。
  • 字符串与数组的相似性仅此而已。无法通过方括号改变字符串之中的单个字符值。
var s = 'hello';
console.log(s[0]);//h
console.log(s[8]);//undefined
  • 有时文本里面包含一些不可打印的符号，比如 ASCII码0到31的符号都无法打印出来，这时可以使用 Base64 编码，将它们转成可以打印的字符。另一个场景是，有时需要以文本格式传递二进制数据，那么也可以使用 Base64 编码。所谓 Base64 就是一种编码方法，可以将任意值转成 0～9、A～Z、a-z、+和/这64个字符组成的可打印字符。使用它的主要目的不是为了加密，而是为了不出现特殊字符，简化程序的处理。注意，这里不是为了加密任务的,只是为了处理特殊的字符
var str = 'Hello World!';
console.log(btoa(str));//"SGVsbG8gV29ybGQh"
console.log(atob('SGVsbG8gV29ybGQh'));// "Hello World!"
  • 字符的加法运算符：如果加法两边都是数字，进行普通的加法运算，如果是字符串的加法会根据不同的运算子确定是加法运算还是字符串的拼接。注意点：非字符串 + 字符串会把非字符串转化为字符串
 1 + 2 // 3
 1 + false //1
 true + true // 2
 1 + 'hello' //1hello
 'hello' + 2 // hello2
 2 + 3 +'hello' // 5hello
 'hello' + 'world' // helloworld
 false + 'hello' // falsehello
 // 取反返回true的六个值： false 0 NaN undefined null  ‘’

对象

  • 对象是JavaScript核心概念，也是最重要的数据类型
  • 注意点：对象的键名是字符串，加不加引号都是可以的，如果键名是数字，则会自动转化为字符串
  • 如果键名不符合标识符的条件或者也不是数字，这是就必须加上引号。开发中对象的属性都会有一些有意义的标识符，不会起我们自己都不认识的键名，这样非常不利于我们去阅读代码
  • 对象的键值可以是任意的数据类型，如果键值是一个函数，我们一般称这个函数为该对象的方法
  • 如果取消某一个变量对于原对象的引用，不会影响到另一个变量。但是，这种引用只局限于对象，如果两个变量指向同一个原始类型(number boolean string)的值。那么，变量这时都是值的拷贝
  • 表达式还是语句
    • 对象采用一个大括号表示，这这会产生一个问题，如果行首是一个大括号，它到底是语句还是表达式，因此JavaScript规定如果行首是一个大括号，一律解释为语句（即代码块）,如果要解释为表达式需要在大括号前面加上一个()
  • 属性的操作：对象的属性通过点运算符或者方括号运算符调运，方括号运算是必须在属性上面加上单引号,否则JavaScript引擎会把他当做变量处理，如果方括号内是数字键可以不加引号，JavaScript引擎会自动转换,但是数字键不能进行点运算，js会以为是小数点，因此数字键只能使用方括号运算符
  • 查看对象本身的属性：Object.keys()返回的是一个数组，而且是不会返回继承的属性，不会返回不可枚举的属性，要想返回不可枚举的属性使用：Object.getOwnPropertyNames()
  • 对象属性的删除：只有一种情况是返回false，那就是对象的属性存在而且不能删除，其余的情况都是会返回true的，注意点:它只能删除对象自身的属性，继承的属性是不会删除的
  • in 运算符符用于检查对象是否包含某个属性，如果包含返回true，如果不包含则返回false，但是有一个问题它是不能判断那个属性是对象自身的还是对象继承的属性,对象继承的属性，它也是返回true
  • for...in循环：它遍历的是对象所有可遍历（enumerable）的属性，会跳过不可遍历的属性，它不仅遍历对象自身的属性，还遍历继承的属性。我们最好的做法就是在遍历的时候判断一下，过滤掉继承的属性
var obj = {
    name:'geek',
    age: 10,
    sex: male
};
for(var key in obj){
    if(obj.hasOwnProperty(key)){
        console.log(key);
    }
}

函数

  • 函数有三种声明方式：
    • function命令声明
    • 函数表达式声明
    • Function构造函数
  • 采用函数表达式声明函数时，function命令后面不带有函数名。如果加上函数名，该函数名只在函数体内部有效，在函数体外部无效。
  • 函数的重复声明：函数的重复声明后面声明的会覆盖掉前面声明的。
  • 函数的length属性是获得函数定义时的参数个数，一但函数被定义，这个值是不会被改变的。也就是函数的形参个数。
  • javaScript 语言将函数看作一种值(也就是说是一种数据类型)，与其它值（数值、字符串、布尔值等等）地位相同。凡是可以使用值的地方，就能使用函数。比如，可以把函数赋值给变量和对象的属性，也可以当作参数传入其他函数，或者作为函数的结果返回。函数只是一个可以执行的值，此外并无特殊之处
  • 如果同时采用function命令和赋值语句声明同一个函数，最后总是采用赋值语句的定义,为什么会这样，这跟执行期上下文有关系。
  • 函数预编译的过程发生在函数指向的前一刻，预编译的四部曲：
    • 第一步：创建AO对象（activation object）也叫生成上下文
    • 第二步：找形参和变量声明，将变量和形参名作为AO对象的属性名，值为undefined
    • 第三步：将实参值和形参同一，也就是传参的过程
    • 第四步：在函数体里面找函数声明，值赋于函数体
    • 注意点：预编译不仅仅发生在函数体内，也发生在全局范围内
  • 函数也是一个对象，它也是有属性和方法的
function f1(a,b,c){
    console.log('hello world');
}
console.log(f1.name);//f1,如果是通过函数表达式的方式声明函数，则返回的是变量名，前提是这个函数是一个匿名函数
console.log(f1.length);//3
console.log(f1.toString());//返回函数源码的字符串
  • 函数参数的传递方式：
    • 如果函数的参数是原始类型的值，传递是按照传值传递
    • 如果函数的参数是复合类型的值，传递的方式是地址传递
  • arguments对象:由于 JavaScript允许函数有不定数目的参数，所以需要一种机制，可以在函数体内部读取所有参数。这就是arguments对象的由来
  • 在严格模式下arguments对象是一个只读对象，通过arguments修改参数的值是不起作用的
  • 通过arguments对象的length属性，我们可以判断函数真实传递进去了几个参数
  • arguments对象是一个类似数组的对象
  • 两种将arguments转为真实数组的方法
    • var args = Array.prototype.slice.call(arguments);
    • 通过for循环逐一填入

闭包

  • 闭包是将函数内部和函数外部链接起来的一座桥梁
  • 闭包的两个作用：
    • 读取函数内部的值
    • 让这些变量始终保存在内存中，即闭包可以让诞生它的环境一直存在
    • 封装对象的私有属性和方法，jQuery就是这样做的
  • 立即调运的函数表达式使用的两个目的：
    • 不必为函数命名，避免污染全局变量
    • 二是 IIFE 内部形成了一个单独的作用域，可以封装一些外部无法读取的私有变量。

运算符

  • 加法运算符的重载现象：加法运算符是在运行时决定，到底是执行相加，还是执行连接。也就是说，运算子的不同，导致了不同的语法行为，这种现象称为“重载”（overload）
  • 如果运算子是对象，就必须先转化为原始类型的值再进行现加
//对象的加法
var obj = { p: 1 };//注意：转化为原始类型的时候是一个字符串的形式
console.log(obj + 2); // "[object Object]2"
  • 对象转化为原始值类型的过程：先自动调用对象的valueOf方法。再自动调运对象的toString方法，将其转化为字符串。对象的valueOf返回的是对象本身，toString方法默认返回的是[objcet Object]
  • 注意点：如果运算子是Data对象的实例，那么就会先调运toString()方法,再调运valueOf()方法
  • 布尔运算符：一共包含四种：或运算 且运算 取反运算 三目运算
  • 对于非布尔的取反运算：只有这六种返回true，其余的都是返回false 他们分别是：null undefined false 0 NaN ''(空字符)
  • 如果对于一个值进行两次取反运算就会转化为布尔值，与布尔函数的作用一样

数据类型的转化

  • 强制类型的转换:强制类型主要指Number String Boolean这三种
  • Number：数值转换为数值型 字符串转换为数值 空字符串转化是0 布尔转化数值 undefined转化为NaN null转化是0
  • Number：数值转化为数值型、字符串转化为数值，如果转化不了直接返回NaN（typeof NAN返回的是Number），空字符串转化为0、布尔值转化为数值 、undefined转化为NaN 、null转化为 0、对象转化为NaN
  • String：数值会转换为相应的字符串 字符串依旧是字符串 布尔也会转换为字符串 undefined转为"undefined" null 转化为"null" 对象转化为"[object Object]" 数组转化为字符串例如：String([1, 2, 3]) // "1,2,3"
  • Boolean:可以将其他类型的值转化为布尔类型 只有这5个(+0或-0 null undefined NaN ''(空字符串))是返回的false，其余的都是true,包括对象也是true
avatar
文章
阅读
粉丝