跟着艾文一起学前端-第14篇-JavaScript - 函数和对象

js中的函数

js中的函数的一些特点:

  1. 通过函数内部的 arguments 对象可以获取到传入该函数的所有参数的值
  2. js中的匿名函数: 如果定义一个变量赋值为一个函数表达式,这个变量就相当于是一个函数,可以直接对该变量加一个小括号此时就像是调用函数一样;
  3. 由上面的匿名函数的方式可以引出函数的自调用,(function () {匿名函数体})();
  4. 通过typeof 可以获取函数的数据类型,结果返回的是function,所以说函数也是一种数据类型;
  5. 回调函数:因为js是弱语言,所以函数的参数类型也可以是4中的函数数据类型,如果说一个函数名(即不带括号)作为参数,那就是回调函数。
    比如说:
    function f1(arg) {
    	arg();
    }
    function argTest() {
    	函数体;
    }
    f1(argTest);//这时就会执行上面argTest()函数中的函数体。
    
  6. 在js中函数也是对象,所有的函数都是内置对象即Function构造函数创建出来的实例对象

js中的作用域

作用域是变量的可视范围,变量又分为全局变量和局部变量。
js 中没有块级作用域,因为在块内的变量,可以在块以外进行访问但是函数内部var声明的变量是局部变量。

  • 使用 var声明的非函数内部的变量就是全局变量,全局变量可以在页面中任何位置使用;
  • 但是函数内部声明的var 变量,外部是无法直接调用的,也就说函数内部声明的变量都是局部变量

隐式全局变量:
声明变量时没有使用var,如果说函数中声明变量没有使用var,那么外部可以直接调用函数内的该变量。

全局变量var是不会被删除的,隐式全局变量无var是可以被删除的

作用域链:一层套一层的这种包裹关系的变量的使用是先检查自己有没有没有的话去上一层寻找,上一层没有的话再往上一层。一直到找到就停止检索,如果到最外层都没找到的话就会直接报错。

js的预解析

js的执行是由浏览器中的js解析器来执行的,js解析器执行js代码分为两步:预解析和代码执行

预解析

预解析就是在浏览器解析代码之前,就把变量的声明和函数的声明在该作用域之前就解析了。

  1. 把变量的声明提前解析到当前代码之前,但是不会赋值;
  2. 把函数的声明提前解析到当前作用域的前面,但不会先调用;
  3. 先解析var,再解析function

函数声明的方式

  1. function 函数名称() {
    函数体
    }
    该方式在IE8中如果放置在条件语句中,不管有没有满足添加判断都会预解析该函数

  2. 函数名称 = function() {
    函数体
    };
    这种方式如果放置在条件控制语句中是不会被预先解析的,所以推荐使用该方式进行函数的声明。

函数的分类

一种分类方式可以按照上面说的:命名函数 和 匿名函数
还可以分为如下方式

  1. 普通函数 - - 函数名称以小写字母开头 - - 用于逻辑处理;
  2. 构造函数 - - 函数名称以大写字母开头 - - 用于实例化对象;
  3. 对象中的方法 - - 和普通函数类似,只是它属于某个对象私有的; 给对象声明函数的方式可以使用this.函数名=function(){};

函数的一些属性

  • name - - 函数的名称,只读,不可修改;
  • arguments - - 实际参数;
  • length - - 形参个数;
  • caller – 函数调用者,即调用了该函数的对象。

函数作为参数

当函数作为参数时,如果是命名函数,只需要传入命名函数的函数名称,不需要加括号;

函数作为返回值

需要定义一个函数名称,将返回值函数赋值给它,然后需要调用,如下:
var fun = funCC(); // funCC return 了一个函数;
fun();//调用fun函数;

js中的对象

js不是面向对象的语言,但是可以模拟面向对象的思想,它是基于对象的语言:

js中创建对象的方式

  1. 调用系统的构造函数创建: var obj = new Object(); 添加属性是通过obj.属性名称 = xxx;直接给属性赋值就好了;
  2. 自定义构造函数创建: function 首字母大写的类名(参数) {} 和普通函数的区别在于首字母大写;
  3. 字面量方式创建 var obj = { 对象体} 这里和自定义构造函数比较类似,区别在于这个方式创建对象只能使用一次,多次使用不建议使用该方式;

如何判定一个对象是不是某个对象的类型:var isSomeObject = 对象 instanceof 类型名称 ;返回值是true的时候就是这个类型,false的话就不是;

js 遍历json数据

for(var keyName in jsonStr){//遍历json数据中所有的key
	console.log(jsonStr[keyName]);
}

js中的内置对象

内置对象即系统自带的对象,js中常用的内置对象:
Math、Date、String、Array、Object

js中的Math对象

Math

Math 是一个内置对象,它拥有一些数学常数属性和数学函数方法。Math 不是一个函数对象。
Math 用于 Number 类型。它不支持 BigInt。与其他全局对象不同的是,Math 不是一个构造器。Math 的所有属性与方法都是静态的。引用圆周率的写法是 Math.PI,调用正余弦函数的写法是 Math.sin(x),x 是要传入的参数。Math 的常量是使用 JavaScript 中的全精度浮点数来定义的。

js中的Date对象

创建一个 JavaScript Date 实例,该实例呈现时间中的某个时刻。Date 对象则基于 Unix Time Stamp,即自1970年1月1日(UTC)起经过的毫秒数。

  • 获取年份 : var dt = new Date(); dt.getFullYear();
  • 获取月份: dt.getMonth() + 1;
  • 某月的第几天: dt.getDate();
  • 获取一周的第几天: dt.getDay();
  • 获取小时: dt.getHours();
  • 获取分钟: dt.getMinutes();
  • 获取秒:dt.getSeconds();
  • 获取毫秒数:dt.valueOf();
  • 英文格式日期: dt.toDataString(); - - Tue Apr 14 2020
  • 数字格式日期: dt.toLocaleDateString(); - - 2020/4/14
  • 时区的时分秒: dt.toTimeString(); - - 16:23:00 GMT+0800 (中国标准时间)
  • 上下午的时分秒:dt.toLocaleTimeString(); - - 下午4:23:00

String

String 全局对象是一个用于字符串或一个字符序列的构造函数。
js中没有字符类型,js中的字符串可以使用单引号也可以使用双引号。
字符串可以看成一个数组可以遍历;
字符串的常用属性:

  • 字符串长度 - - str.length;
  • 指定索引的字符 – str.charArt(索引); 超出索引获取到的是空;
  • 将一个或多个字符串与原字符串合并,形成一个新的字符串并返回: - - str.concat(string2, string3[,…,Stringn]);
  • 截取字符串的一部分 : – str.slice(startIndex,endIndex); 从索引startIndex开始到endIndex前面的一位;
  • 截取字符串: - - str.substr(startIndex,length); 从某个索引开始截取对应长度的字符串;
  • 截取字符串: - - str.substring(startIndex,endIndex); 从开始索引截取到结束的索引,和slice一样
  • 按分隔符拆分成数组: - - str.split(分隔符);
  • 转换成小写: - - str.toLocaleLowerCase(); 或者 toLowerCase();
  • 转换成大写: - - str.toLocaleUpperCase(); 或者 toUpperCase();
  • 去除字符串两端的空格 : – str.trim();

Array

如何判断一个对象是不是数组:

  • obj instanceof Array; 判断如果是数组返回true,不是数组的话返回false;
  • Array.isArray(obj); 同上,返回true是数组;

其他常用的方法:

  • 组合合并数组 arr.concat(数组,数组,…);
  • every(函数) 测试数组的所有元素是否都通过了指定函数的测试返回一个布尔值;callback调用时传入三个参数:元素值,元素的索引,原数组;
  • .filter() 方法创建一个新数组,其包含通过所提供函数实现的测试的所有元素,即返回一个满足指定函数判断条件的数组;
  • .push(元素); 将数据追加到数组的尾部,返回值是插入后的数组长度;
  • .pop(); 删除数组的最后一个元素,返回值就是被删除的那个元素;
  • .shift(); 删除数组中第一个数据元素,返回值是删除的元素值;
  • .unshift(); 向数组的第一个元素前面插入一个新的元素,返回值是插入后的数组长度;
  • .forEach(函数); 遍历数组 ,相当于for in ;
  • .indexOf(元素值); 返回的是索引,如果不存在则返回值是-1;
  • .join(字符串); 将数组用该字符串拼接起来,返回拼接后的字符串;
  • .map(); 方法创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果;
  • .reverse(); 反转数组
  • .sort(函数); 排序, 需要传入排序函数,否则不稳定;
    arr.sort(function (a, b){
    	if(a>b){
    		return 1;
    	}else if(a == b){
    		return 0;
    	}else {
    		return -1;
    	}
    }
    )
    
  • .slice() 方法返回一个从开始到结束(不包括结束)选择的数组的一部分浅拷贝到一个新数组对象。原始数组不会被修改。
  • .splice(开始的位置,要删除的个数,替换的元素值); 一般用于删除数组中的元素,或者替换、插入元素

判断数据所属的类型

  1. 基础数据类型判断:- - typeof paramData ; - - 返回的是基本数据类型;
  2. 判断一个对象的数据类型:
    1) 判断是不是某个对象: obj instanceof ObjName - - 返回布尔值:ture是,false 否
    2) 获取某个对象的数据类型:
    * Object的数据类型: - - Object.prototype.toString(); - - Object 的数据类型,返回的是 : [object Object];
    * 数组的数据类型: - - Object.prototype.toString.call(arr); 返回的是[object Array];- - 所以可以通过该方式来判断是不是数组;
    * 所以想获取某个数据类型的方式可以写为: - - Object.prototype.toString.call(obj); - - 返回 [object 对应的数据类型名称]
发布了37 篇原创文章 · 获赞 15 · 访问量 3万+

猜你喜欢

转载自blog.csdn.net/u012764358/article/details/105482141
今日推荐