03JavaScript基础(笔记).md

最新推荐文章于 2024-04-06 10:41:14 发布

笑中取栗

最新推荐文章于 2024-04-06 10:41:14 发布

阅读量318

点赞数

本文链接：https://blog.csdn.net/mxl00z/article/details/82903232

版权

WEB学习个人笔记专栏收录该内容

6 篇文章 0 订阅

订阅专栏

day1

数据类型

查看数据类型可以使用 typeof（）

###Number数据类型

####进制

八进制表示 (以0开头)

var num=0666;

十进制表示

var num=666;

十六进制表示（0x开头）

var num=0xfff;

浮点型

数据精度有问题

不要判断两个浮点数是否相等

####数据范围

Number.MAX_VALUE 这个值为： 5e-324

Number.MIN_VALUE 这个值为： 1.7976931348623157e+308

数值判断

isNaN()-----is Not a Number

存在隐式转换

String类型

####转义符

1498289626813

###Boolean类型

null类型

###undefined类型

Object类型

数据转换

###转换成字符串类型

toString()
. String()
. +

字符串转数据

parseInt（）
parseFloat()
Number()
运算符
Boolean() // 0 空字符串 null undefined 会被隐式转换成false

运算符的优先级

优先级从高到底
	1. ()  优先级最高
	2. 一元运算符  ++   --   !
	3. 算数运算符  先*  /  %   后 +   -
	4. 关系运算符  >   >=   <   <=
	5. 相等运算符   ==   !=    ===    !==
	6. 逻辑运算符 先&&   后||
	7. 赋值运算符

day2

流程控制

顺序结构
循环结构
分支结构

switch中的表达式是严格的===

学好调试

day3

做练习

day4

函数的定义

函数声明
$function fun(){....}$
函数表达式
$var fun=function (){......}；$

函数声明的时候不会调用

函数的调用

函数名（）；

//代码示例：
//声明函数
function fn(){}
//调用函数
fn();//函数的调用方式

匿名函数的自调用（关于自执行函数（匿名函数自调用）的作用：防止全局变量污染。）
```
//代码示例

(function(){....})();
```

函数的返回值

函数的返回值可以是任意类型

可以是数值，字符串，布尔型，变量，函数。也可以没有返回值

//代码演示

//返回值是一个函数的函数

function fn1(){

return function(){...}

}

var fn2=fn1();//定义一个变量来接收fn1的返回值

函数的参数

函数的参数类型

函数的参数可以是任意类型。用函数作为参数也是可以的

//代码示例

function fn1(){console.log("大家好我系渣渣辉")}

function fn2(fn){//把函数作为参数只需传入参数名就可以了。不然是把参数的返回值作为参数

	fn();//调用传进来的函数参数

}

fn2();

函数的参数个数

调用函数的时候可以传参数也可以不传参数。因为JavaScript的函数不像java的函数（方法）一样可以重构。所以一个方法名就是一个函数。

调用函数的时候可以不传参数，但有时有不传进相应的参数，会发生异常

如果在不知道函数个数的情况下，也可以写一个没有参数的函数。而在函数内部通过arguments对象来获取调用者传进来的参数。arguments是伪数组，调用方式可以和数组一样

//代码演示

function fn1(){//方法求和

	var sum=0；

	for（var i=0;i<arguments.length;i++）{

		sum+=arguments[i];

	}

	return sum;

}

作用域

块级作用域

JavaScript没有块级作用域（现阶段没有）

循环和if语句里面声明的变量也是全局变量

可以用关键字 delete 删除隐式全局变量

词法作用域

也叫做静态作用域在定义是决定，不是在执行时决定

在 js 中词法作用域规则:**

函数允许访问函数外的数据.
整个代码结构中只有函数可以限定作用域.
作用域规则首先使用提升规则分析
如果当前作用规则中有名字了, 就不考虑外面的名字

作用域链

1534963091462

预解析

JavaScript代码的执行是由浏览器中的JavaScript解析器来执行的。JavaScript解析器执行JavaScript代码的时候，分为两个过程：预解析过程和代码执行过程

预解析过程：

把变量的声明提升到当前作用域的最前面，只会提升声明，不会提升赋值。
把函数的声明提升到当前作用域的最前面，只会提升声明，不会提升调用。
先提升var，在提升function

day5

对象

对象创建方式

对象字面量

//代码演示

var obj={

	//属性

	name:"张三"，

	age:20，

	sex:男，

	//行为

	eat:function(food){

		console.log("吃"+food);

	},
    show:function(){
        console.log("我叫"+this.name+",今年”+age+“岁了 ");
    }
}；

new Object()创建对象

//代码演示

var obj=new Object();

obj.name="张三";

obj.age=20;

obj.eat=function(food){

	console.log("吃"+food);

}

工厂模式创建对象

//代码演示

function createObj(name,age){

	var obj=new Object();

	obj.name=name;

	obj.age=age;

	obj.eat=function(food){

		console.log("吃"+food);

	};

return obj;

}

var obj1=createObj("张三",20);

var obj2=createObj("李四",21);

自定义构造函数（构造函数首字母大写）

//代码演示

//构造函数首字母大写

function People(name,age,eat){

	this.name=name;

	this.age=age;

	this.eat=function(food){

		eat(food);

	}	

}

var obj=new People("张三",20,function(food)	 {

	console.log("吃"+food)

	});

new 关键字

构造函数，是一种特殊的函数。主要用来在创建对象时初始化对象，即为对象成员变量赋初始值，总与new运算符一起使用在创建对象的语句中。

构造函数用于创建一类对象，首字母要大写。
构造函数要和new一起使用才有意义。

new在执行时会做四件事情

   new会在内存中创建一个新的空对象
   new 会让this指向这个新的对象
   执行构造函数  目的：给这个新对象加属性和方法
   new会返回这个新对象

this详解

   JavaScript中的this指向问题，有时候会让人难以捉摸，随着学习的深入，我们可以逐渐了解
   现在我们需要掌握函数内部的this几个特点
   	1. 函数在定义的时候this是不确定的，只有在调用的时候才可以确定
   	2. 一般函数直接执行，内部this指向全局window
   	3. 函数作为一个对象的方法，被该对象所调用，那么this指向的是该对象
   	4. 构造函数中的this其实是一个隐式对象，类似一个初始化的模型，所有方法和属性都挂载到了这个隐式对象身上，后续通过new关键字来调用，从而实现实例化

对象的使用

遍历对象的属性

通过for…in语法可以遍历一个对象

var obj={

	name:"张三"，

	age:20,

	eat:function(){..}

}

for(var key in obj){	

	console.log(obj[key]);

}

删除对象的属性

function fun(){

	this.name="张三"；

}

var obj=new fun();

console.log(obj.name);张三

delete obj.name;

console.log(obj.name); //undefined

day6

内置对象

Math对象

Math对象不是构造函数，它具有数学常数和函数的属性和方法，都是以静态成员的方式提供

跟数学相关的运算来找Math中的成员（求绝对值，取整）

Math

演示：Math.PI、Math.random()、Math.floor()/Math.ceil()、Math.round()、Math.abs() 、Math.max()

Math.PI						// 圆周率
Math.random()				// 生成随机数
Math.floor()/Math.ceil()	 // 向下取整/向上取整
Math.round()				// 取整，四舍五入
Math.abs()					// 绝对值
Math.max()/Math.min()		 // 求最大和最小值

Math.sin()/Math.cos()		 // 正弦/余弦
Math.power()/Math.sqrt()	 // 求指数次幂/求平方根

Date对象

创建 Date 实例用来处理日期和时间。Date 对象基于1970年1月1日（世界标准时间）起的毫秒数。

// 获取当前时间，UTC世界时间，距1970年1月1日（世界标准时间）起的毫秒数
var now = new Date();
console.log(now.valueOf());	// 获取距1970年1月1日（世界标准时间）起的毫秒数

Date构造函数的参数
1. 毫秒数 1498099000356		new Date(1498099000356)
2. 日期格式字符串  '2015-5-1'	 new Date('2015-5-1')
3. 年、月、日……				  new Date(2015, 4, 1)   // 月份从0开始

获取日期的毫秒形式

var now = new Date();
// valueOf用于获取对象的原始值
console.log(date.valueOf())	

// HTML5中提供的方法，有兼容性问题
var now = Date.now();	

// 不支持HTML5的浏览器，可以用下面这种方式
var now = + new Date();			// 调用 Date对象的valueOf()

日期格式化方法

toString()		// 转换成字符串
valueOf()		// 获取毫秒值
// 下面格式化日期的方法，在不同浏览器可能表现不一致，一般不用
toDateString()
toTimeString()
toLocaleDateString()
toLocaleTimeString()

获取日期指定部分

getTime()  	  // 返回毫秒数和valueOf()结果一样，valueOf()内部调用的getTime()
getMilliseconds() 
getSeconds()  // 返回0-59
getMinutes()  // 返回0-59
getHours()    // 返回0-23
getDay()      // 返回星期几 0周日   6周6
getDate()     // 返回当前月的第几天
getMonth()    // 返回月份，***从0开始***
getFullYear() //返回4位的年份  如 2016

Array对象

创建数组对象的两种方式
- 字面量方式
- new Array()

// 1. 使用构造函数创建数组对象
// 创建了一个空数组
var arr = new Array();
// 创建了一个数组，里面存放了3个字符串
var arr = new Array('zs', 'ls', 'ww');
// 创建了一个数组，里面存放了4个数字
var arr = new Array(1, 2, 3, 4);


// 2. 使用字面量创建数组对象
var arr = [1, 2, 3];

// 获取数组中元素的个数
console.log(arr.length);

检测一个对象是否是数组
- instanceof
- Array.isArray() HTML5中提供的方法，有兼容性问题
函数的参数，如果要求是一个数组的话，可以用这种方式来进行判断
toString()/valueOf()
- toString() 把数组转换成字符串，逗号分隔每一项
- valueOf() 返回数组对象本身
数组常用方法

演示：push()、shift()、unshift()、reverse()、sort()、splice()、indexOf()

// 1 栈操作(先进后出)
push()
pop() 		//取出数组中的最后一项，修改length属性
// 2 队列操作(先进先出)
push()
shift()		//取出数组中的第一个元素，修改length属性
unshift() 	//在数组最前面插入项，返回数组的长度
// 3 排序方法
reverse()	//翻转数组
sort(); 	//即使是数组sort也是根据字符，从小到大排序
// 带参数的sort是如何实现的？
// 4 操作方法
concat()  	//把参数拼接到当前数组
slice() 	//从当前数组中截取一个新的数组，不影响原来的数组，参数start从0开始,end从1开始
splice()	//删除或替换当前数组的某些项目，参数start, deleteCount, options(要替换的项目)
// 5 位置方法
indexOf()、lastIndexOf()   //如果没找到返回-1
// 6 迭代方法 不会修改原数组(可选)
every()、filter()、forEach()、map()、some()
// 7 方法将数组的所有元素连接到一个字符串中。
join()

清空数组

// 方式1 推荐 
arr = [];
// 方式2 
arr.length = 0;
// 方式3
arr.splice(0, arr.length);

基本包装类型

为了方便操作基本数据类型，JavaScript还提供了三个特殊的引用类型：String/Number/Boolean

// 下面代码的问题？
// s1是基本类型，基本类型是没有方法的
var s1 = 'zhangsan';
var s2 = s1.substring(5);

// 当调用s1.substring(5)的时候，先把s1包装成String类型的临时对象，再调用substring方法，最后销毁临时对象, 相当于：
var s1 = new String('zhangsan');
var s2 = s1.substring(5);
s1 = null;

// 创建基本包装类型的对象
var num = 18;  				//数值，基本类型
var num = Number('18'); 	//类型转换
var num = new Number(18); 	//基本包装类型，对象
// Number和Boolean基本包装类型基本不用，使用的话可能会引起歧义。例如：
var b1 = new Boolean(false);
var b2 = b1 && true;		// 结果是什么

String对象

字符串的不可变

var str = 'abc';
str = 'hello';
// 当重新给str赋值的时候，常量'abc'不会被修改，依然在内存中
// 重新给字符串赋值，会重新在内存中开辟空间，这个特点就是字符串的不可变
// 由于字符串的不可变，在大量拼接字符串的时候会有效率问题

创建字符串对象

var str = new String('Hello World');

// 获取字符串中字符的个数
console.log(str.length);

字符串对象的常用方法

字符串所有的方法，都不会修改字符串本身(字符串是不可变的)，操作完成会返回一个新的字符串

// 1 字符方法
charAt()    	//获取指定位置处字符
charCodeAt()  	//获取指定位置处字符的ASCII码
str[0]   		//HTML5，IE8+支持 和charAt()等效
// 2 字符串操作方法
concat()   		//拼接字符串，等效于+，+更常用
slice()    		//从start位置开始，截取到end位置，end取不到
substring() 	//从start位置开始，截取到end位置，end取不到
substr()   		//从start位置开始，截取length个字符
// 3 位置方法
indexOf()   	//返回指定内容在元字符串中的位置
lastIndexOf() 	//从后往前找，只找第一个匹配的
// 4 去除空白   
trim()  		//只能去除字符串前后的空白
// 5 大小写转换方法
to(Locale)UpperCase() 	//转换大写
to(Locale)LowerCase() 	//转换小写
// 6 其它
search()
replace()
split()
fromCharCode()
// String.fromCharCode(101, 102, 103);	 //把ASCII码转换成字符串

笑中取栗

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
03JavaScript基础(笔记).md

day1数据类型查看数据类型可以使用 typeof（）###Number数据类型####进制八进制表示 (以0开头)var num=0666;十进制表示var num=666;十六进制表示（0x开头）var num=0xfff;浮点型数据精度有问题不要判断两个浮点数是否相等####数据范围Number.MAX_VALUE 这个值为： 5e-324Number.MIN...
复制链接

扫一扫