批改状态:合格
老师批语:
<script>//1、栈方法//栈 后进先出//栈 1、 后端进后端出 push() + pop()//栈 2、 头端进头端出 unshift() + shift()//队 先进先出//队 1、头端进尾端出 unshift() + pop()//队 2、头端出尾端进 shift() + push()let arr=[1,2,3];arr.push(4,5);console.log(arr);arr.pop();console.log(arr);arr.unshift(0);console.log(arr);arr.shift();console.log(arr);//2、join() 将数组元素通过分隔符拼装成字符串let arr2 =["我",'爱吃','苹果'];console.log(arr2.join(""));//3、concat() 数组合并let arr31 =[4,5,6];console.log(arr31.concat([7,8],9));//4、slice() 返回数组的部分成员let arr4 = [1,2,3,4,5];console.log(arr4.slice(2));//slice() 可用于复制数组let arr41 = arr4.slice(0);console.log(arr41);//5、splice() 用于数组的增删改,原始用途是删除元素,第一个参数是删除的其实索引号,第二个参数是删除的数量,第三个参数是插入的元素(可以插入多个值)let arr5 = [1,2,3,4,5,6];arr5.splice(1,0,...[11,111]);console.log(arr5);//6、sort() 排序,重点是整数排序let arr6 = [74,14,55,89];console.log(arr6.sort((a,b) => a - b));//7、map() 遍历,有返回值let arr7 = [1,2,3,4,5,6,789];console.log(arr7.map(item => item));//8、filter() 过滤let arr8 = [1,2,3,4,5,6,7];console.log(arr8.filter(item => item%2));//9、reduce() 接收一个函数作为累加器,第一个参数为回调函数,第二个参数为初始累加值let arr9 = [1,2,3,4,5];console.log(arr9.reduce((prev,curr)=> prev + curr));//10、length属性,可以得出数组的元素个数let arr10 = [1,2,3,4,5];console.log(arr10.length);</script>
<script>//JSON是一种数据交换格式,可以和各种编程语言进行数据交换。可以充当不同编程语言数据交换的中间角色。//1.JSON.stringify(),该函数可以将JS对象序列化为JSON字符串,该函数有三个参数,参数1为JS数据,参数2为数据处理方式,参数3为格式化输出的JSON字符串//1.1 第二个参数为数组,表示筛选条件,如下console.log(JSON.stringify({a:"苹果",b:"香蕉",c:"橘子"},["a","b"]));//1.2 如果第二个参数为函数,表示筛选条件,有两个参数,第一个表示键,第二个表示值console.log(JSON.stringify({a:1,b:2,c:3},(k,v)=>{if (v > 2) return undefined;return v;}));//1.3 第三个参数示例,如果写数字表示空格个数,也可以用字符串console.log(JSON.stringify({a:"苹果",b:"香蕉",c:"橘子"},null,4));console.log(JSON.stringify({a:"苹果",b:"香蕉",c:"橘子"},null,'---'));//2.JSON.parse(),可以将JSON字符串解析为JS对象,有两个参数,第一个参数是JSON字符串,第二个参数是数据过滤或数据处理console.log(JSON.parse('{"a":1,"b":2,"c":3}',(k,v)=>{if (k==="") return v;return v*2;}));</script>
同源指的是协议相同,域名相同,端口号相同
跨域指的是不同源之间的请求与响应
在html中的示例代码为
<button>跨域请求</button><p></p><script>//跨域请求需要在服务器端开启请求头许可,下面以get方式模拟(post方式同样可以)const btn = document.querySelector("button");btn.onclick =()=>{//创建异步对象const xhr = new XMLHttpRequest();xhr.open('get',"http://www.text.com/ceshi.php");xhr.onload = () => document.querySelector('p').innerHTML = xhr.response;xhr.send(null);};</script>
在对应的ceshi.php下示例代码为
<?phpheader('Access-Control-Allow-Origin:http://www.123.com');echo '跨域成功';
不用通过开启请求头许可,跨域请求响应的方法。
原理是标签的跨域是无法屏蔽的。将需要返回的数据以JSON数据格式作为参数封装在回调函数语句中,然后通过前端的script标签的src属性进行跨域请求,因为标签跨域的不可屏蔽性,后端无需开启请求头许可,就可将该回调函数语句返回到前端,进而调用回调函数,将数据输出到当前页面。
JSON-with-Padding只能完成get请求
前端html中示例代码如下
<!DOCTYPE html><html lang="utf-8"><head><title>jsonp的原理</title></head><body><button>jsonp</button><p></p><script>function getUser(data){console.log(data);let user = data.name + ": " + data.email;document.querySelector('p').innerHTML = user;}//getUser({"name":"张三","email":"admin@qq.com"});const btn= document.querySelector("button");btn.onclick = ()=> {let script = document.createElement("script");script.src = "http://www.test.com/1.php?haha=getUser";document.body.insertAdjacentElement("afterbegin",script)};</script></body></html>
后端php中示例代码如下
<?php$haha = $_GET['haha'];$data ='{"name":"张三","email":"admin@admin.com"}';echo $haha . '(' .$data . ')';
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号