JavaScript 学习笔记(第二天)

一、分支结构

1.1、do while 循环

  • 是一个和while循环类似的循环
  • while会先进行条件判断,满足就执行,不满足直接就不执行了
  • 但是do while 循环是,先不管条件,先执行一回,然后在进行条件判断
  • 语法:do{ 要执行的代码 } while (条件)
//下面这个代码,条件一开始就不满足,但是依旧会执行一次do后面{}内部的代码
var num = 10;
do {
	console.log('我执行了一次')
	num = num +1;
}while (num<10)

小知识点

prompt(“”) →输入框

1.2、for循环

  • 和while 和 do while循环都不太一样的一种循环
  • 道理是和其他两种一样的,都是循环执行的代码的
  • 语法:for ( var i = 0 ; i < 10;i ++).
//把初始化,条件判断,自身改变,写在了一起
for ( var i = 1;i<= 10;i++ )
//这里写的是要执行的代码
	console.log(i)
}
//控制台会依次输出1~10

1.3、break终止循环

  • 在循环没有进行完毕的时候,因为我设置的条件满足,提前终止循环
  • 比如:我吃了我吃了五个包子,吃到三个的时候,不能再吃了,我就停止吃包子这个事情
  • 要终止循环,就可以直接使用break关键字
for( var i = 1;i <= 5;i++)
{
	//每循环一次,就吃一个包子
	console.log('我吃了一个包子')
	//当i的值为3的时候,条件为true,执行{}里面的代码终止循环
	//循环就不会继续向下执行,也就没有4和5了
	if(i===3)
	{
	break
	}
}

1.4、continue结束本次循环

  • 在循环中,把循环的本次跳过去,继续执行后续的循环
  • 比如:吃我个包子,到第三个的时候,第三个掉地下了,不吃了,跳过第三个,继续吃第四个和第五个
  • 跳过本次循环,就可以使用continue关键字
for(var i = 1;i<=5;i++)
//当i的值为3的时候,执行{}里面的代码
//{}里面有continue,那么本次循环后面的代码就都不执行了
//自动算作i为3的这一次结束了,去继续i=4的那次循环了
if(i===3){
	console.log('这是第三个包子,掉地下了,我不吃了')
	continue
	}
	console.log('我吃了一个包子')
}

1.5、求质数案例

  • 质数:除了1和它本身以外,没有其他的约数
  • 比如:1,3,5,7,11…
<script>
	var n=9;
	var zhushu=ture;
	for(var i=2;i<=n/2;i++)
		if(n%i===0){
		zhushu = flase;
		break;
		}
		console.log(i)
	}
	if (zhushu){
		console.log('Yes');
	}else{
	 	console.log('No');
	 }
</script>
//简化
<script>
	var n=9;
	for(var i=2;i<=n/2;i++)
		if(n%i===0){
		break;
		}
		console.log(i)
	}
	if (i<=n/2){
		console.log('Yes');
	}else{
	 	console.log('No');
	 }
</script>

1.6、九九乘法表

<style>
	span{
	display:inline-block;
	width: 100px;
	height:20px;
	}
</style>
<script>
for(var i=1;i<=9;i++)
{
	for(var j=1;j<=i;j++)
		{
		document.write("<span>"+j+"*"+i+"="+j*i"+</span> ")
		}
		document.write("</br>")
}
</script>

二、函数

2.1、函数的基础

2.1.1、函数的概念

  • 对于js来说,函数就是把任意一段代码放在一个盒子里面
  • 在我想要让这段代码执行的时候,直接执行这个盒子里面的代码就行
  • 例:
//这个是我们以前写的一段代码
for(var i = 0;i<10 ;i++)
{
	console.log(i)
}
//函数,这个{}就是那个“盒子”
function fn() {
//这个函数我们以前写的代码
for (var  i =0 ;i<10;i++)
	{
	console.log(i)
	}
}	

2.1.2、定义函数

2.1.2.1、声明式
  • 使用function这个关键词来声明一个函数
//直接声明函数
function test1(){
	console.log("我是test1函数")
}
function tset2(){
	console.log("我是test2函数")
}
2.1.2.2、赋值式
  • 其实就是我们使用var关键词是一个道理了
  • 首先使用var定义一个变量,把一个函数当作值直接赋值给这个变量就可以了
var test3 = function(){
	console.log("我是test3函数")
}

两者区别:

  • 声明式的先调用再定义,赋值式的先定义再调用

2.1.3、调用函数

  • 直接在<script>标签中写出函数名即可调用
 	test1();

2.2、函数实现九九乘法表

function test(){
for(var i=1;i<=9;i++)
{
	for(var j=1;j<=i;j++)
		{
		document.write("<span>"+j+"*"+i+"="+j*i"+</span> ")
		}
		document.write("</br>")
}
}
	test()

2.3、函数的参数

  • 我们再定义函数和调用函数的时候都出现过()
  • 现在我们就来说一下这个()的作用
  • 就是用来放参数的位置
  • 可以不传参
  • 形参只能在函数内部去使用
  • 参数分为两种 形参实参
//声明式
function fn(形参写在这里面){
//一段代码
}
fn(实参写在这里)
//赋值式函数
var fn = function(形参写在这里){
//一段代码
}
fn(实参写在这里)
//实现自定义乘法表
function test(n){
if(n===undefined)
{
	alert("请输入有效参数")
}
for(var i=1;i<=n;i++)
{
	for(var j=1;j<=i;j++)
		{
		document.write("<span>"+j+"*"+i+"="+j*i+"</span> ")
		}
		document.write("</br>")
}
}
	test()

2.4、返回值

  • 函数调用本身也是一个表达式,表达式就应该有一个值出现
  • 现在的函数执行完毕之后,是不会有结果出现的
//比如1+2是一个表达式,那么这个表达式的结果就是 3 
console.log(1+2)//3
function fn(){
//执行代码
}
//fn()也是一个表达式,这个表达式就没有结果出现
console.log(fn())//undefined
  • return关键字就是可以给函数执行完毕一个结果
function fn(){
//执行代码
return 100
}
//此时,fn()这个表达式执行完毕之后就有结果出现了
console.log(fn())//100
  • 我们可以在函数内部使用return关键把任何内容当作这个函数运行后的结果
    注:
  • return可以不写,看需求来写
  • return之后的代码无法执行

2.4.1、返回值案例

<script>
        	function isPrime(n){
		for(var i=2;i<=n/2;i++){
			if(n%i===0){
			break
			}
			//console.log(i)
		}
		if (i<=n/2){
			//console.log('NO');
			return false
		}else{
		 	//console.log('Yes');
		 	return true
		 }
    }
	var res = isPrime(71)
	console.log(res)
//给其定下一个范围,只需要使用一个for 循环
for( i=100;i<=300;i++ )
{
	if(isPrime(i)){
	console.log(i)
	}	
}
</script>

2.5、预解析

  • 预解析其实就是聊聊js代码的编译与执行
  • js是一种解释型语言,就是在代码执行之前,先对代码进行通读和解释,然后再执行代码
  • 也就是说,我们的js代码在运营的时候,会经过两个环节解释代码执行代码

2.5.1、解释代码

  • 因为是在所有代码执行之前进行解释,所以叫做预解析(预解释)
  • 需要解释的内容有两个
    • 声明式函数
      在内存中先声明有一个变量名是函数名,并且这个名字代表的内容是一个函数
    • var关键字
      在内存中先声明有一个变量名
fn()
console.log(num)

function fn(){
console.log('我是fn函数')
}
var num=100

  • 经过预解析之后可以变形为
function fn(){
	console.log('我是fn函数')
}
var num

fn()
console.log(num)
num=100
  • 赋值式函数会按照var关键字的规则进行预解析

2.6、作用域

  • 什么是作用域,就是一个变量可以生效的范围
  • 变量不是在所有地方都可以使用,而这个变量的使用范围就是作用域

2.6.1、全局作用域

  • 全局作用域是最大的作用域
  • 在全局作用域中定义的变量可以在任何地方使用
  • 页面打开的时候,浏览器会自动给我们生成一个全局作用域window
  • 这个作用域会一直存在,直到页面关闭就销毁了
//下面两个变量都是存在在全局作用域下面的,都是可以在任意地方使用的
var num=100
var num2=200

2.6.2、局部作用域

  • 局部作用域就是在全局作用域下面有开辟出来的一个相对小一些的作用域
  • 在局部作用域中定义的变量只能在这个局部作用域内部使用
  • 在js中只有函数能生成一个局部作用域,别的都不行
  • 每一个函数,都是一个局部作用域
//这个num是一个全局作用域下的变量在任何地方都可以使用
var num = 100
function fn(){
//下面这个变量就是一个 fn局部作用域内部的变量
//只能在 fn函数内部使用
var num2 = 200
}
fn()

2.7、变量使用规则

2.7.1、访问规则

  • 当我想获取一个变量的值的时候,我们管这个行为叫做访问
  • 获取变量的规则:(就近原则)
    • 首先,在自己的作用域内部查找,如果有,就直接拿来使用
    • 如果没有,就去上一级作用域查找,如果有,就拿来使用
    • 如果没有,就继续去上一级作用域查找,依次类推
    • 如果一直到全局作用域都没有这个变量,那么就会直接报错(该变量 is not defined)

2.7.2、赋值规则

  • 当你想给一个变量赋值的时候,那么就先要找到这个变量,在给他赋值
  • 变量赋值规则:
    • 先在自己作用域内部查找,有就直接赋值
    • 没有就去上一级作用域内部查找,有就直接赋值
    • 还没有再去上一级作用域查找,有就直接赋值
    • 如果一直找到全局作用域都没有,那么就把这个变量定义为全局变量,再给他赋值

三、对象

3.1、对象

  • 对象是一个复杂数据类型
  • 其实说是复杂,但是没有很复杂,只不过是存储了一些基本数据类型的一个集合
var obj={
	num=100
	str:'hello world'
	boo:true
}
  • 这里的{ }和函数中{ }的不一样
  • 函数里面的是写代码的,而对象里面是写一些数据的
  • 对象就是一个键值对的集合
  • { }里面的每一个键都是一个成员
  • 也就是说,我们可以把一些数据放在一个对象里面,那么他们就互不干扰了
  • 其实就是我们准备一个房子,把我们想要的数据放进去,然后把房子的地址给到变量名,当我们需要某一个数据的时候,就可以根据变量名里面存储的地址找到对应的房子,然后去房子里面找到对应的数据

3.1.1、创建对象

  • 字面量的方式创建一个对象
//创建一个空对象
var obj={}
//向对象中添加成员
obj.name='jack'
obj.age=18
  • 内置构造函数的方式创建对象
//创建一个空对象
var obj=new objectr()
//向对象中添加成员
obj.name'Rose'
obj.age=20
  • object是js内置给我们的构造函数,用于创建一个对象使用的

3.2、对象的基本操作

  • 第一种方式:
var obj={}
obj.name="Jack"
obj,age=100
obj.location="tianjing"
console.log(obj)
//查
document.write("姓名是"+obj.name)
obj.age=200
delete obj.name
  • 第二种方式:
var obj2={}
obj2["name"]="JACK"
console.log(obj2["name"])
obj2["name"]="Rose"
delete obj2["name"]
  • 第二种当时一般用于不正规命名方式的对象

3.3、对象的遍历

var obj={
	name="Kerwin",
	age=18,
	location="Guangzhou"
}

for( var i in obj ){
//获取key
	console.log(i)
//获取vable
	console.log(obj[i])
//全部获取
 	document.write(i"+"obj[i])
 	document.write("<br>")

3.4、不同数据类型的存储

  • 既然我们区分了基本数据类型和复杂数据类型
  • 那么他们之间就一定会存在一些区别
  • 他们最大的区别就是在存储上的区别
  • 我们的存储空间分成两种
  • 栈:主要存储基本数据类型的内容
  • 堆:主要存储复杂数据类型的内容
    在这里插入图片描述
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值