cgb2108-day10
文章目录
-
- 一,JS语句
-
- --1,测试
- 二,JS数组
-
- --1,概述
- --2,测试
- 三,JS函数
-
- --1,概述
- --2,测试
- --3,练习
- 四,JS对象
-
- --1,测试
一,JS语句
–1,测试
DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>测试 js语句title>
<script>
// 2.js的循环语句
//练习3:假设你有1个亿,每天花500w,能花多少天
var days = 0; //记录天
var money = 100000000 ;//记录钱
while(money>0){
money -= 5000000 ;//花钱
days++;//天数++
}
console.log(days);
//练习2:统计1~100的偶数和
var sum = 0;//记录和
for(let i=1;i<=100;i++){
if(i % 2 == 0){
//过滤偶数
sum = sum + i;//修改变量
// sum += i;
}
}
console.log(sum);
//练习1:打印1~100
for(let i=1;i<=100;i++){
console.log(i);
}
// 1.js的变量和常量
var a = 2; //变量
a = 'hello';
console.log(a);//hello
const b = 10; //常量,值不能再改
// b = 20;
console.log(b);
let c = 10;//变量,有作用域
c = 20;
console.log(c);
var x = 10;
{
let x = 20; //只在{}内有效,出去就无效了
console.log("x="+x);//20
}
console.log("x="+x);//10
script>
head>
<body>
body>
html>
二,JS数组
–1,概述
JS的数组和java一样,可以存储多个数据.
区别:
1, java严格区分数据类型,整型数组只能存整数…
2, JS里的数组可以存放各种类型的数据(JS弱类型) – 灵活!!!
–2,测试
DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>测试 js数组title>
<script>
// 1.创建js数组: 数据类型丰富 + 长度可变
//方式1:
let a = new Array();
//存入数据--丰富的类型
a = new Array(1,1.6,true,'hello',null);
a[99]=0;
console.log(a);
console.log(a.length);//获取数组的长度
console.log(a[2]);//获取下标为2的数据
console.log(a[a.length-1]);//获取null元素
//方式2:
let b = [];
//存入数据
b = [1,1.6,true,'hello',null];
console.log(b);
console.log(b.length);
console.log(b[3]);
// 2.遍历js数组:
//普通for循环
for (let i = 0; i < b.length; i++) {
console.log(b[i]+"========");//i是下标
}
//增强for循环..foreach--for in
//java的写法 for(var i : b){}
for(var i in b){
console.log(i);//i是下标
console.log(b[i]);
}
script>
head>
<body>
body>
html>
三,JS函数
–1,概述
类似于java里的方法,用来封装一段代码,为了提高代码的复用性.
步骤: 1,定义函数 2,调用函数
定义函数使用function关键字
–2,测试
DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>测试 js函数title>
<script>
//方式1:
// 1,定义函数
function print(){
console.log("调用成功");
}
// 2,调用函数
print();
//方式2:
// 1,定义函数
var sout = function(){
console.log("调用成功");
}
// 2,调用函数
sout();
// 练习1:求1~10的总和
// function add(){ 定义JS函数的第一种方式
var add = function(){
//定义JS函数的第二种方式
//1,定义数组
var a = [1,2,3,4,5,6,7,8,9,10] ;
//2,遍历数组
let b = 0;//定义变量,记录和
for(let i=0;i<a.length;i++){
b = b + a[i] ;//数组里的数据求和
}
console.log(b);
}
// add();//调用函数
script>
head>
<body>
<button onmouseenter="add()">点我,求和button>
body>
html>
–3,练习
DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>测试 js函数title>
<script>
//1.没有参数没有返回值 的函数
// 求1~100的和
function sum(){
var a = 0;
for (var i = 1; i <=100; i++) {
a += i;
}
console.log(a);
}
//2.有参数没有返回值 的函数
//关键字 函数名(参数名,参数名){函数体}
function save(a,b){
//定义函数
console.log(a+b);
}
save(1,2); //调用函数
// 练习1:求1~10的总和
// function add(a){//定义函数的第一种方式
var add = function(a){
//定义函数的第二种方式
var b = 0;//记录和
for (var i in a){
//遍历a数组,i是下标
b += a[i];
}
console.log(b);
}
add(new Array(1,2,3,4));//调用函数
//3.有参数有返回值 的函数
//定义函数 return
var add = function(a){
//定义函数的第二种方式
var b = 0;//记录和
for (var i in a){
//遍历a数组,i是下标
b += a[i];
}
return b;//把计算的结果返回给调用者
}
//调用函数
var x = add(new Array(1,2,3,4,5,6));
console.log(x);
//练习: 求1~100里的偶数和
function fun(){
//定义函数
var y = 0;//记录和
for (var i = 1; i < 101; i++) {
if(i % 2 == 0){
//过滤偶数
y += i ;//求和
}
}
return y;//把求和的结果返回给调用者
}
var z = fun();//调用函数
console.log(z+100);
script>
head>
<body>
<button onclick="sum()">点我,求和button>
body>
html>
四,JS对象
–1,测试
DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>测试 JS对象title>
<script>
// 2,创建JS对象的方式2: 比方式1简洁
let car = {
// 资源名 : 资源的值
//设置属性
name : "BMW" ,
price : 9.9 ,
//设置函数
start : function(){
console.log('调用成功!');
}
}
console.log(car);//{name: 'BMW', price: 9.9}
console.log(car.name+car.price);//调用属性
car.start();//调用函数
// 1,创建你JS对象的方式1:比java灵活
function Person(){
} //声明对象
let p = new Person();//创建对象
//动态设置属性
p.name='tony';
p.addr='北京';
//动态获取属性
console.log(p.name+p.addr);
//动态设置函数
p.eat=function(){
console.log("吃大餐");
}
console.log(p);
//调用函数
p.eat();
function a(){
// 1,内置对象--window对象
window.alert('100');//弹出框
window.confirm('确认');//确认框
window.prompt("请输入");//输入框
// window.document //属性,获取网页文档
//string对象
var x='hello';
console.log( x.length );//求长度
console.log( x.charAt(0) );//根据下标查找数据
console.log( x.concat(123) );//拼接字符串
console.log( x.substring(1,3) );//截取字符串[1,3)
}
a();
script>
head>
<body>
body>
html>