cgb2110-day10

文章目录

重点难点!! 一,JS的函数
- --1,定义函数调用函数
- --2,函数传参
- --3,函数的返回值
- --4,总结
二,JS对象
- --1,内置对象
- --2,自定义对象方式1
- --3,自定义对象方式2
三,Json
- --1,概述
- --2,语法
四,DOM

重点难点!! 一,JS的函数

–1,定义函数调用函数

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>测试 JS函数</title><script>//练习1:封装函数,求数组里偶数的和// function sum(){ //方式1let sum = function(){  //方式2//1,创建数组let arr = [1,2,3,4,5,6,7,8];//2,遍历数组let sum2=0;//定义变量,记录和//for(let i=0;i<arr.length;i++){for(let i in arr){//i是下标,arr[i]是数据//3,过滤偶数if(arr[i] % 2 === 0){//4,求和    sum2+=arr[i];}}console.log(sum2);}//1,创建函数//方式1:function add(){console.log("add..被调用成功!");}//方式2:var a = function(){console.log("a..被调用成功!");}//2,调用函数add();a();</script></head><body><button onclick="sum()">点我,获取数据</button></body>
</html>

–2,函数传参

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>测试 JS函数</title><script>//改造练习1:封装函数,求数组里偶数的和// function sum(){ //方式1let sum = function(arr){  //方式2//2,遍历数组let sum2=0;//定义变量,记录和//for(let i=0;i<arr.length;i++){for(let i in arr){//i是下标,arr[i]是数据//3,过滤偶数if(arr[i] % 2 === 0){//4,求和    sum2+=arr[i];}}console.log(sum2);}//调用函数let a =[4,5,6,7,8,89,10];sum(a);//1,创建函数function print(x){console.log(x);}function add(x,y){console.log(x+y);}//2,调用函数print('abc');add(1,2);</script></head><body></body>
</html>

–3,函数的返回值

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>测试 JS函数</title><script>//练习2:模拟set设置值 / get获取值//创建函数//set()把调用者传来的参数设置值let name = '';function set(x){name = x;//设置值}//get()把值返回给调用者function get(){return name ;}//调用函数  set('jack'); //设置值let name2 = get();//获取值console.log(name2);//练习1:创建函数,求1~10的和并返回function save(){let sum =0;for(let i=1;i<=10;i++){sum += i;}//谁要调用这个函数,谁即将保存着return的值return sum;}let a2 = save();console.log(a2);//1,创建函数--通过return把结果返回给调用者let add = function(x,y,z){//通过return把结果返回给调用者return x+y+z;}//2,调用函数let a = add(1,2,3);console.log(a);</script></head><body></body>
</html>

–4,总结

二,JS对象

–1,内置对象

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>测试 js对象</title><script>//1,JS的内置对象function test1(){//String对象的功能let a = 'javascript';console.log( a.length ); //获取字符串的长度console.log( a.toUpperCase() ); //全转大写let b = a.substring(1,5); //截取字符串[1,5)console.log( b ); console.log( a.concat('hello ~') );  //拼串//Math对象console.log( Math.PI );//π的值console.log( Math.random() ); //随机数0~1console.log( Math.random() * 10 );console.log( Math.round(1.9) );//对小数的处理,round四舍五入console.log( Math.round(1.1) );//对小数的处理,round四舍五入//Array对象let c = [3,2,4,5,2];console.log( c );console.log( c.toString() );//打印数组里的数据console.log( c.sort() ); //对数组排序,默认从小到大//window对象--可以省略window.alert(100);//弹出框window.prompt(); //输入框window.confirm() ;//确认框//DOM Document d = window.document;//JSON}</script></head><body><!--2,调用函数  --><button onclick="test1()">单击按钮</button></body>
</html>

–2,自定义对象方式1

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>测试 js对象!!!!</title><script>//练习:创建Car对象function Car(){}let c = new Car();//动态的添加属性或者函数c.color='red';c.start=function(){return '启动成功!'}//模拟tostring(),返回属性的值c.tostring=function(){//this代表当前的对象return "["+this.color+"]" ;}console.log(c);//调用属性或者函数let str = c.tostring();console.log(str);let res = c.start();console.log(res);console.log( c.color );//方式1!!://1,声明对象function Person(){}//2,创建对象var p = new Person();//3,动态的给对象绑定属性p.name="rose";p.age=20;console.log(p);//Person {name: 'rose', age: 20}//4,动态的给对象绑定函数p.study = function(){console.log(100);}console.log(p);//?//5,调用对象的功能console.log( p.name );console.log( p.age );p.study();//方式2!!!!:</script></head><body><button>点我,获取数据</button></body>
</html>

–3,自定义对象方式2

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>测试 js对象!!!!</title><script>//练习:创建JS对象对并调用let person= {name : "蔡徐坤",like : "唱跳rap",play : function(a){return a;}}console.log(person.name+person.like);let a = person.play('篮球');console.log(a);//1,创建JS对象let student = {//属性名 : 属性值name : "jack" ,age : 18 ,//函数名 : 函数声明coding : function(){console.log(100);} ,tostring:function(){return this.name+","+this.age ;}}//2,调用对象的功能let res = student.tostring();console.log(res);student.coding();console.log(student.name + student.age);//{name: 'jack', age: 18, coding: ƒ}console.log(student);</script></head><body></body>
</html>

三,Json

–1,概述

是一种轻量级的数据交互格式.本质上就是一个字符串(文本).
作用: 用来完成前后端数据交互的格式 , 存储和管理数据.

–2,语法

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>测试 JSON串</title><!-- json用来把 前后的数据 进行交互 --><script>//解决方案:如果能把一个json字符串转成js对象,就能通过对象调用属性啦--JSON对象var c = '[{"name":"jack","age":"20"},{"name":"rose","age":"22"}]'var jsobj = JSON.parse(c);//把json串转成js对象console.log(jsobj);//得到一个数组console.log(jsobj[0].name);//调用对象的属性,jack console.log(jsobj[1].name);//调用对象的属性,rose //3,json数组console.log(c);//需求:把json串里的 jack 和 rose获取到 console.log(c.substring(10,14));//jack console.log(c.substring(37,41));//rose //2,json对象var b = '{"name":"18","age":"20"}';console.log(b);console.log(b.length);//获取长度console.log(b.concat(100));//拼接console.log(b.substring(1,5));//截取//1,json字符串var a = '"name":"熊大"' ;console.log(a);console.log(a.length); //获取长度console.log( a.concat(123) ); //拼接console.log( a.substring(2,6) ); //截取[2,6)</script></head><body></body>
</html>

四,DOM

cgb2110-day10相关推荐

必背单词_研究生满大街走？真实数据来啦真题必背单词Day10
研究生满大街走?真实数据来啦我国现在有多少研究生了?先上图: 从以上数据可以得知,1995年至2019年,我国的研究生入学人数共计约878万人. 这个数字看似很大,但不要忽视了我国的总人口.简单计算 ...
Java基础day10
Java基础day10 Java基础day10-继承&修饰符 1 继承 1.1 继承的实现 1.2 继承的好处和弊端 2. 继承中的成员访问特点 2.1 继承中变量的访问特点 2.2 supe ...
第二课运算符(day10)
第二课运算符(day10) 一.运算符结果是值算数运算 a = 10 * 10 赋值运算 a = a + 1 a+=1 结果是布尔值比较运算 a = 1 > 5 逻辑运算 a ...
Day10:html和css
Day10:html和css <html> <body> <h1>标题</h1> <p>段落</p> </body> ...
LeetCode算法入门- 3Sum Closest -day10
LeetCode算法入门- 3Sum Closest -day10 Given an array nums of n integers and an integer target, find thre ...
spss典型相关分析_R语言实战多元统计分析Day10— —典型相关分析
R语言实战多元统计分析Day10-- 典型相关分析 01 前言典型相关分析是用于分析两组随机变量之间的相关性程度的一种统计方法,它能够有效的揭示两组随机变量之间的相互线性依赖关系,这种方法是由Hot ...
句句真研—每日长难句打卡Day10
句句真研-每日长难句打卡Day10 参考译文:这段情节证明了具有讽刺意味的现象确实存在:尽管美国男性倾向于在公共场合比女性健谈,在家里却比妻子话少.
Python菜鸟入门：day10模块介绍
写在前面: 此博客仅用于记录个人学习进度,学识浅薄,若有错误观点欢迎评论区指出.欢迎各位前来交流.(部分材料来源网络,若有侵权,立即删除) 传送门: day01基础知识 day02知识分类 day03 ...
day10【过渡】分布式理论
day10[过渡]分布式理论划水课,参考老师的课件即可
21天Jmeter打卡Day10线程用户之setUp和tearDown
21天Jmeter打卡Day10线程用户之setUp和tearDown 其实学过unittest,就知道setup和teardown分别是测试类的初始准备工作和结束工作. 另外发现查看结果树,可以只添 ...

cgb2110-day10

文章目录

重点难点!! 一,JS的函数

–1,定义函数调用函数

–2,函数传参

–3,函数的返回值

–4,总结

二,JS对象

–1,内置对象

–2,自定义对象方式1

–3,自定义对象方式2

三,Json

–1,概述

–2,语法

四,DOM

cgb2110-day10相关推荐

最新文章

热门文章

cgb2110-day10

文章目录

重点 难点!! 一,JS的函数

–1,定义函数调用函数

–2,函数传参

–3,函数的返回值

–4,总结

二,JS对象

–1,内置对象

–2,自定义对象方式1

–3,自定义对象方式2

三,Json

–1,概述

–2,语法

四,DOM

cgb2110-day10相关推荐

最新文章

热门文章

重点难点!! 一,JS的函数