let 命令
let 关键字用来定义变量
let 的特性:
a.不能够重复定义的
b.不存在变量提升
c.存在块级作用域
d.不存在作用域链问题
ES6 中 let
<script>
//测试一
var name = "admin"
var name = "root"
console.log(name);//结果:root
/*
//测试二
let name = "admin"
let name = "root"
console.log(name);//结果:报错
*/
/*
测试三
console.log(name); //结果,报错
let name = "admin"
*/
/*
//测试四
{
let i = 20
}
console.log(i) //报错 (因为块级作用域,没有在括号里,所以报错)
*/
</script>
变量:
<script>
//1.ES5中定义变量 变量名的规则
//var name = "任嘉伦";
//2.ES6中定义变量 使用let 关键字
let name = "任嘉伦"
//ES6新特性1: 不能狗重复声明
/*
let name = "任嘉伦"
let name = "赵露思" //会报错
*/
//ES6新特性2: 块级作用域
/*
循环结构 for(){} while(){} do(){}
选择结构 if(){} if(){}else{} if(){}elseif(){}.....else switch(){}
函数 function fun_name(){}
*/
{
let num = 12;
}
//console.log(num); //结果:报错
//ES6新特性3: 没有变量提升
//ES6方法
console.log(color); 结果: 报错
let color = 'red'
//ES5方法
/*
console.log(color); 结果: undefined
var color = 'red'
*/
</script>
for 经典案例:
<script>
var arr =[];//定义了一个空数组
for(var i=1; i < 10; i++) {
// //循环体
arr[i] = function () {
// //将i的值返回到外边(函数)
return i;
}
}
console.log(arr[4]());//结果:10
</script>
不完全结构:
<script>
//1.变量名比等号右侧的值少,且没有其他特殊处理,多出的值会被忽略
let [a,b,c] = [10,15,17,23,31] //结果: a是10 b是15 c是17
//2.变量名比等号右侧的值多,多出的变量名值为 undefined
let [a1,b1,c1] = [10,15] //结果: a1是10 b1是15 c1是undefined
//console.log(c1);
//3.剩余运算符(...),会将剩下的值以数组的方式存储到c2变量中
let [a2,b2,...c2] = [10,15,17,23,31] //结果: a2是10 b2是15 c是2
console.log(c2);
//4.默认值,当等号左侧的变量设置了默认值,在等号右侧又可以找到
let [a3,b3,c3=`default`] = [10,15,zhangsan]
console.log(c3);//结果: zhangsan
//5.undefined 和 unll
let [test = 12] = [undefined]
console.log(test);//结果: 12
let [test = 12] = [unll]
console.log(test1);//结果: null
</script>
点击换色:
<title>点击换色案例</title>
<style>
*{
margin:0px;padding:0px;
}
.container{
width: 450px;
height: 300px;
border: 1px solid#4013af;
padding: 8px;
margin: 0 auto;
}
.container h2{
text-align:center;
}
.container .item{
border:1px dashed red;
margin-top:12px;
padding:12px 0px;
}
</style>
</head>
<body>
<div class="container">
<h2>点击换色</h2>
<div class="item">one</div>
<div class="item">two</div>
<div class="item">three</div>
<div class="item">four</div>
</div>
<script>
//1.获取到需要绑定单击事件的标签
var divObj = document.getElementsByClassName("item")
//2.给标签绑定单机事件
for(var i = 0;i<divObj.length;i++){
console.log(i);
divObj[i].onclick=function(){
//alert(i)
//3.改变div的背景颜色 this表示当前这个对象
this.style.backgroundColor = 'cyan'
}
}
/*
console.log(divObj);
divObj[0].onclick = function(){
alert(0)
}
divObj[0].onclick = function(){
alert(10)
}
*/
//扩展:点击时随机颜色
// 两个颜色之间互相切换
</script>
声明常量const:
<script>
//定义一个常量PI
const PI=3.14 //常量在定义时必须赋值
console.log(PI);
//const 定义的对象或数组时,可以修改对象和数组中的元素值,不能直接修改
const ARR = ['zhangsan','lisi']
ARR[1] = ['李四']
ARR[2] = '王五'
console.log(ARR)
/*
const是用来声明常量,常量就是固定不变的量,在我们开发的过程中当一个变量希望它的值在声明以后,不被(自己或者他人)改变。
语法: const 常量名称 = 值
注意:
常量的值一旦定义不能被修改
常量的名称一般使用大写
常量在定义时必须赋值
不允许重复定义的
块级作用域
*/
</script>
解构赋值:
<title>解构赋值</title>
</head>
<body>
<script>
//1. es5 赋值方式
/*
var name = "张三"
var age;
age = 20
var a = 5;
a = age+a
*/
//2.ES6中的解构赋值 目的在于可以简化同时定义多个变量并赋初
/*var num1 = 12;
var num2 = 13;
var num3 = 15;
var num4 = 20;
var num5 = 23;
*/
/*
//ES5(js)方法 (不是很简化)
var num1 = 12,num2 = 13, num3 = 15,num4 = 20,num5 = 23
*/
//ES6解构赋值的用法 (比ES5更简化)
let[num1,num2,num3,num4,num5] = [12,13,15,20,23]
// console.log(num1);
let[name,age] = [18,'zhangsan']
console.log(age);//结果:zhangsan
</script>
对象的解构赋值:
<script>
//js如何定义对象,对象中有属性和值() 属性名:值属性
let obj = {
name:"任国超",
age:18,
sex:1,
study:function(){}
}
//使用对象中的某个值: 对象名称.属性名
obj.age //访问对象中的属性
obj.study() //调用方法
//对象的解构赋值
/*注意:
a.等号的左侧要使用花括号( {} )包裹变量名
b.变量名要和对象中要解构的属性名保持一致
c.等号右侧就是要解构的对象
*/
let obj1 = {
name:"任国超",
age:18,
sex:1,
study:function(){}
}
let {name,age} = obj1
console.log(name);
</script>
JS 运算符复习:
<script>
/*
运算符:帮助我们完成业务逻辑
运算符号的分类:
算数运算符
+ - * % ++ --
比较运算符
> < >= != == !== ===
= 表示赋值,就是把等号右边赋值给等号左边的变量
== 表示比较,如果两边的值相等,返回true,否则返回fale
=== 表示比较,两边的值和数据类型都是相同,返回true,否则返回fale
赋值运算符
= += -= *= /= %=
a+=b 等价于 a = a+b
逻辑运算符
注:大多数情况都会用在条件里边
&& 只有当两边的条件都为真时,整体返回true,其他情况全返回false
|| 只有当两边的条件都为假时,整体返回false,其他情况全返回true
! 非真即假 非假即真
字符串拼接运算
注:变量和字符串拼接
5+5 //结果 10
10+'5' //结果 105 因为是拼接运算,所以是将+号两边拼接为105
三元运算符
条件?条件为真的执行:条件为假的执行
if(){}else
*/
//取余运算 % 例: 4%5余数是4
//++ -- 注意:参与运算的是一个变量
var num = 10
num++ //num =11
var num = 10
++num //num =11 // num++ 和 ++num 对于num这个变量来讲没有任何区别
var res = ++num //num = 11 res = 11
var res = num++ //num = 11 res = 10
//15*'zhangsan' //结果:NaN
//NaN+NaN //结果:NaN
</script>
ES6 运算符扩展:
<script >
//指数运算符 符号 ++
// 5的3次方
console.log( 5**3);
//指数赋值运算符 符号 **=
var a = 2;
a**=4 //等价于 a = a**4
console.log(a);
</script>
链判断运算符:
<script>
var message = {
body:{
user:{
firstName:'任国超',
lastName:'赵露思'
},
inf0:{
age:18,
sex:0
}
}
}
//访问lastName 语法:对象名称.属性名
console.log(message.body.user.lastName)
//在使用某个对象的属性时,需要先对他之前的对象进行判断
//const firstName = message.body.user.lastName ||'default'
//es2020 中引入了链判断运算符 ?.
var lastName = message?.body?.user?.lastName||'default'
</script>
逻辑赋值运算符:
<script>
//或赋值运算符
x ||= y
//等同于
x || (x = y)
</script>
函数的参数:
<script>
function role(name){
Console.log(name+'百里守约是射手');
}
//在函数调用的时候,输出某个角色是射手
role("孙尚香")
role("公孙离")
role()
//有形参并且没有设置默认值的时候,必须传入实参
//多个参数使用逗号隔开
//有默认值的参数,要放在参数列表的最后
function role1(name,pos){
console.log(name+pos);
}
role1("鲁班七号","射手")
role1("蔡文姬","辅助")
/*
函数参数的默认值
//有形参并且没有设置默认值的时候,必须传入实参
(1)function demo(para = 'default'){}
//多个参数使用逗号隔开
//有默认值的参数,要放在参数列表的最后
(2)function demo(name,para = 'default'){}
*/
</script>
函数声明:
<script>
/*
函数的定义:函数是一段可重复使用的有名字的代码块
函数的作用:代码重复使用
函数的特性:不能自动执行,需要通过调用才能够执行
函数调用:函数名()
*/
/*
函数使用步骤
1.声明函数
语法:function 函数名称(){}
2.函数的调用
函数名()
*/
domo()//能否调用成功
function domo(){
console.log("百里守约是射手");
}
demo()//函数的调用
demo()
demo()
</script>
</doby>
<script>
demo()//可以调用成功
</script>
箭头函数:
<script>
//ES5 中函数回顾
//function fun_name(){}
//ES6 中箭头函数 =>
//let fun_name = ()=>{}
//定义一个函数实现传入的两个参数求和,然后将求和的结构返回
//ES5中
/*
function qiuhe(num1,num2){
return num1+num2
}
var res = qiuhe(5,8)
console.log(ress);
*/
//ES6中
let qh = (num1,num2) =>{
return num1+num2
}
var res = qh(9,8)
console.log(ress);
//1.不带参数的箭头函数,小括号必须有
let demo = ()=>{
console.log('不带参数的箭头函数');
}
//2.带参数的箭头函数
//b.带多个参数
//a.带一个参数 (用let或者var都可以)
/*let demo1 = (a)=>{
return a+1
}
console.log(demo1(3));//结果:4 (传的参数加一:3+1=4)
*/
//简写方式:
//(1)参数只有一个,可以省略参数的小括号 函数体中只有一行returndai代码 可以省略{}和return关键字
let demo1 = a => a+1
console.log(demo1(15));//结果:16 (传的参数加一:15+1=16)
//(2)参数只有一个,可以省略参数的小括号 如果参数有默认值小括号就不能省略
let demo1 = a => {return a+1}
//带多个参数(2个以上)
//3.参数有默认值
let qh1 = (num1,num2=10) =>{
return num1+num2
}
</script>
箭头函数属性:
<script>
//1.length属性 有默认值的参数和rest参数不参与length属性的计算
let demo = (a=12)=>{}
console.log(demo.length);
let dome1 = (str,a=12)=>{}
demo.length //结果:1 (因为有默认值的参数和rest参数不参与length属性的计算)
let demo2=(str,a=12,...val)=>{}
//2.name属性
//针对匿名函数 ES5中name属性返回空,ES6中name属性返回实际的函数
//ES5
var demo3 = function (){}
console.log(demo3.name);//结果:demo3 (可能性:浏览器在执行代码的时候,是按照ES6标准来执行的)
var demo4 = ()=>{}
console.log(demo4.name);
//bind返回的函数,name属性值会加上bound的缀
function foo(){};
console.log(foo.bind({}).name) //"bound foo"
console.log(function foo(){}).bind({}).name //"bound"
</script>
箭头函数的注意事项:
<title>Document</title>
<style>
div{
width: 120px;
height: 80px;
background-color: rgb(153, 0, 255);
margin-top: 25px;
}
</style>
</head>
<body>
<div class="item">001</div>
<div class="item">002</div>
<div class="item">003</div>
<div class="item">004</div>
<script>
document.getElementsByClassName("item")[0].onclick = function(){
alert(this.innerHTML)
//[0]当前单击的是001
//如果填入[1]单击的是002
//如果填入[2]单击的是003
//如果填入[3]单击的是004
}
//不存在this伪对象
document.getElementsByClassName("item")[0].onclick = ()=>{
alert(this.innerHTML)
}
//注意事项
//1.箭头函数没有自己的this对象,箭头函数没有作用域,this永远指向window对象
//2.不可以当作构造函数,也就是说,比可以对箭头函数使用new命令,否则会抛出一个错误
//3.不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用rest参数代替
//4.不可以使用yield命令,因此箭头函数不能作用Generator函数
</script>
数值扩展:
<script>
//数值分隔符
//ES2021,允许JavaScript的数值使用下划线(_)作为分隔符
let num = 10_101
console.log(num === 10101);//true
//注意:
//不能放在数值的最前面(leading)或者最后(trailing)
//不能两个或者两个以上的分隔符连在一起
//小数点的前后不能有分隔符
//科学计数法里面,表示指数的e或E前后不能有分隔符
//ES5中
isNaN()
//ES6中 为了遵循对象的访问格式增加Number 对象
var res = Number.isNaN('abc')//判断括号中的值是不是NaN 是返回true 不是返回false
console.log(res);//结果: false
//扩展
//ES6将全局方法parseInt()和parseFloat(),移植到Number对象上面,行为完全保持不变
//ES5写法
parseInt('12,34')//12
parseFloat('123.45#')//123.45
//Number.isInteger()用来判断一个数值是否为整数
//注意:如果参数类型不是数值,一律返回false
Number,isInteger(25)//true
Number,isInteger(25.1)//false
Number,isInteger(25.0)//true
</script>
字符串扩展:
<button>新增</button>
<script>
$(function(){
$("button").click(function(){
let test= 12
//在模板字符串中解析变量
var str = `<div class="item">
姓名: <input type="text">
性别: <input type="radio"name="sex">男 ${test}
<input type="radio"name="sex">女
</div>`
$("body").append($(str))
})
})
</script>
Aarry.of
<script>
//var arr = new Array(4)
//console.log(arr);
var arr = Array.of('z','gh')
console.log(arr);
</script>
find
<script>
let arr2=[11,13,15,16,17,19];
let res3 = arr2.find((n)=>{
return n<15
});
console.log(res3);//结果:16
/*
Array.from()
Array.of()
find()
includes
*/
let arr=[11,13,15,16,17,19,NaN];
console.log(arr.includes('19'));//false
</script>
数组复习:
<script>
//1.数组的定义
//a.通过[]方式定义,有人称之为字面量定义法
var arr = ['张三',18,true]
//b.通过naw关键字定义
var arr1 = new Array(3)
//2.单个数组元素的访问 数组名称[索引]
arr[0]
//获取到arr数组中 true
arr[2]
//3.数组元素的修改
arr[2] = false
arr[3] = 'hebel'
console.log(arr);
//4.数组元素的遍历
for(var i = 0;i<arr.length;i++){
arr[i]=arr[i]+1
}
console.log(arr); //false是1
</script>
数组遍历扩展:
<script>
//数组遍历
let arr=[11,13,1,156,17,19];
//keys()
for(let indx of arr.keys()){
console.log(index);
}
//values()
for(let ele of arr.values()){
console.log(ele);
}
//entries()
for(let[key,ele] of arr.entries()){
console.log(ele+"==="+key);
}
</script>
数组扩展1:
<script>
var num = [25,12,31,14,20]
var max = num[0]
//输出两边最大值
for(var i =0;i<num.length;i++){
if(max<num[i]){
max = num[i]
}
}
console.log(max);
//假如想移除数组中的最后一个元素
//num.splice(4,1)
num.pop()
</script>
数组扩展2:
<script>
//1.Array.from()
let arrayLike = {
'0':'a',
'1':'b',
'2':'c',
length:3 //对象需要有length属性
};
//var res = arrayLike.pop()
var arr = Array.from(arrayLike)
console.log(arr);
//将arguments转换为数组
function demo(){
console.log(arguments);
var res = Array.from(arguments);
console.log(res);
}
demo('zhangsan',20,'男')
</script>
随机点名器
<div id="box">随机点名</div>
<span id="span">开始</span>
<style>
#box {
width: 30%;
height: 200px;
background-color: rgb(146, 205, 245);
border: 1px solid rgb(31, 18, 216);
font-size: 30px;
font-weight: 300;
font-family: Arial, Helvetica, sans-serif;
line-height: 200px;
text-align: center;
/* border-radius: 10px; //角度更改10px数,直角去掉这个 */
margin: 25px auto;
}
span {
display: block;
width: 30%;
height: 44px;
line-height: 44px;
background-color: rgb(91, 4, 190);
/* border-radius: 10px; //角度更改10px数,直角去掉这个 */
color: #fff;
text-align: center;
margin: 0 auto;
font-size: 18px;
font-family: 华文细黑;
}
span:hover {
background-color: rgb(91, 4, 190);
}
</style>
<script>
var arr = ["西施", "马超", "曜", "蔡文姬", "小乔","云中君", "瑶", "高渐离", "刘禅", "庄周","赵云", "廉颇"
]
var box = document.getElementById("box");
var span = document.getElementById("span");//获取元素
var state = 0;//定义状态,开始和结束
var t;
span.onclick = function () {
if (state == 0) {
//如果是0即开始随机,变为1时结束,不是0时执行else
clearInterval(t);
t = setInterval(function () {
// console.log(1);
var sj = Math.round(Math.random() * (arr.length - 1));
console.log(arr[sj]);
box.innerHTML = arr[sj];
}, 3)
span.innerHTML = "结束"//更改按钮的内容
state=1;
}else{
state=0;
clearInterval(t);
span.innerHTML = "开始"
}
}
</script>
类的定义:
<script>
/*
ES6中通过class关键字来定义一个类
语法:class 类名{
}
*/
//定义类
class Person{
//通过构造方法实现属性的定义,在实例化类的时候传入值
constructor(name,age,sex){
this.pname = name
this.page = age
this.psex = sex
}
//定义了一个say方法
say(){
//console.log("正在说话....");
console.log("我的名字叫:"+this.pname);
}
study(){
console.log("正在学习....");
}
}
//实例化类,产生一个对象 使用new关键字
//new Person()
let p = new Person()
console.log(p);
//类中方法的调用 对象名.方法名()
p.say()
//调用一下 study方法
p.study()
//实例化类 (类可通过多个对象,多个实例化)
let p1 = new parent('王小平',0,'男')
//访问类中的属性 语法:对象名.属性名
console.log(p1.pname);
p1.say()
</script>
类的继承1:
<script>
//定义类
class Person{
//定义了一个say方法
say(){
//console.log("正在说话....");
console.log("我的名字叫:XXX");
}
study(){
console.log("正在学习....");
}
}
//继承关键字 extends
//定义一个男人类
class Man extends Person{ //(Man继承Person的类)
//重写父类中的方法
}
//实例化Man这个类
let man1 = new Man()
man1.study()
</script>
类的继承2:
<script>
//定义类
class Person{
//通过构造方法实现属性的定义,在实例化类的时候传入值
constructor(name,age,sex){
this.pname = name
this.page = age
this.psex = sex
}
//定义了一个say方法
say(){
//console.log("正在说话....");
console.log("我的名字叫:XXX");
}
study(){
console.log("正在学习....");
}
}
//继承关键字 extends
//定义一个男人类
class Man extends Person{ //(Man继承Person的类)
//重写父类中的方法
}
//实例化Man这个类
let man1 = new Man("网名",12,'男')//(继承constructor(name,age,sex)里内容)
console.log(man1);
man1.study()
console.log(man1.pname)
</script>
面向对象概念:
PHP是一个后门端的脚本语言
MySQL是一个关系型数据库 SQLServer Oracle Access
面向对象 是大多数编程语言中都有的一个概念
面向对象: Object Oriented 简写:OO
面向对象编程: Object Oriented Programing 简写:OOP
对象: 万物皆对象,在描述对象的过程中需要加上量词 一张桌子 一把椅子
类:
将具有相同或者相似属性或者功能的事物,抽象出来成为一类
类里面包含属性和方法
类和对象之间的关系:
类是对象抽象出来的结果,对象是类实例化后的产物(结果)
重写父类中的方法:
<script>
//定义类
class Person{
//通过构造方法实现属性的定义,在实例化类的时候传入值
constructor(name,age,sex){
this.pname = name
this.page = age
this.psex = sex
}
//定义了一个say方法
say(){
//console.log("正在说话....");
console.log("我的名字叫:XXX");
}
study(){
console.log("正在学习....");
}
}
//继承关键字 extends
//定义一个男人类
class Man extends Person{ //(Man继承Person的类)
//重写父类中的方法
study(){
alert('12345')
}
}
//实例化Man这个类
let man1 = new Man("网名",12,'男')//(继承constructor(name,age,sex)里内容)
console.log(man1);
man1.study()
console.log(man1.pname)
</script>
promise 常用的API
<script>
/*
P.then()得到异步任务的正确结果
P.catch()获取异常结果
P.finally()成功与否都会执行(并且不是正式标准)
*/
function queryData(){
return new Promise(function(resolve,rej){
setTimeout(function(){
//resolve(123);
reject('error');
},100);
})
}
foo()
.then(function(data){
console.log(data)
})
.catch(function(data){
console.log(data)
})
.finally(function(){
console.log('finished')
});
//可以把两个函数传递给then,也可以then接受一个函数,另外一个通过catch来处理。catch的作用就是专门用来处理异常信息的。
</script>
ajax
<script>
/*
$({
ur1:'',
type:'',
data:'',
dataType:'',
success:function(){
//ajax成功以后的回调函数
$ajax({
})
}
})
*/
/*
promise(备用) 是一个对象,从它可以获得异步操作
javaScript 原生的ajax方法 不适合进行项目开发 适合帮助我们理解ajax的
jQuery jaax方法 $.ajxa({})
ES6 promise
*/
</script>
基本 promise 用法:
<script>
/*
promise(备用) 是一个对象,从它可以获得异步操作
javaScript 原生的ajax方法 不适合进行项目开发 适合帮助我们理解ajax的
jQuery jaax方法 $.ajxa({})
ES6 promise
*/
//promise使用好处:1.可以避免多层异步调用嵌套问题;
//基本用法:
//1.实训化promise对象 构造函数中传递函数 该函数中用于处理异步任务
//2.resolve和rejec两个参数用于处理成功和失败两种情况,并通过p.then获取处理结果
var p = new Promise(function(resolve,rejec){
setTimeout(function(){
var fiag = true;
if (fiag) {
//正常情况
resolve('hello');
}else{
//异常情况
reject('出错了');
}
},100);
})
P.then(function(data){
//从resolve得到正常结果
console.log(data)
},function(info){
//从reject得到错误结果
console.log(info)
});
</script>
普通对象和函数对象区别:
<script>
//定义函数
function f1(){}
let f2 = new Function()//构造函数完成创建
let f3 = function(){}//匿名函数
//定义对象
let o1 = {};
let o2 = new Object();
let o3 = f1();
//函数对象 函数对象基本都是由new function()构造而来
console.log(typeof Object);//function
console.log(typeof Function);//function
console.log(typeof f1)//function
console.log(typeof f2)//function
console.log(typeof f3)//function
//Object对象(普通对象)
console.log(typeof o1)//object
console.log(typeof o2)//object
console.log(typeof o3)//object
</script>
原生的 Ajax
<script>
//1.基于promise处理Ajax请求
var xhr = new XMLHttpRequest () ;
xhr.onreadystatechange = function(){
if (xhr.readyState !=4)return;
if (xhr.readyState ==4 && xhr.status == 200){
//处理正常情况
console.log(xhr.responseText);
}else{
//处理异常情况
console.log('出错了');
}
}
xhr.open('get',ur1);
xhr.send(null);
//2.发送多个ajax请求
//发送多个ajax请求并且保证顺序
queryData('htta://locaThost:3000//data')
.then(function(dsta){
console.log(data);
return queryData('htta://locaThost:1000//data');
})
.then(function(data){
console.log(data)
});
//注意:return的是一个新的promise实例对象,下一个then调用名就是上面return出来的promise对象,并且then当中的函数参数data用于接收上一个异步任务的处理结果。
</script>
原型和原型链:
<script>
//原型
//在JavaScript中,原型也是一个对象,原型的作用,则是实现对象的继承
//在js的所有函数对象中,都存在一个属性prototype,该属性对应当前对象的原型
function f1(a){}
let f2 = new Function()//构造函数完成创建
let f3 = function(){}//匿名函数
let obj = {
xm:'zhangsan',
age:18
}
//console.log(f1.prototype);
console.log(obj);
//原型链:
//除开Object的prototype的原型是null以外,所有的对象和原型都有自己的原型,对象的原型指向原型对象
//在已层级多的关系中,多个原型层层相连则构成了原型链
//在查找一个对象的属性时,倘若在当前对象找不到该属性,则会泪着原型链一直往上查找,知道找到为止,如果到了原型链顶端,还没找到,则遇回undefined
/*
访问一个对象的属性时,
先在自身属性中查找,找到返回
如果没有,再沿着_proto这条链向上查找,找到反回,如果最终没找到返回undefined
别名:隐式原型链
作用:查找对象的属性(方法)
*/
</script>
模块导入:
<script type="module">
//import导入 export导出
//1.单个变量的导入 (在Wampserver64中打开)
import{name,age}from".profile,js"
//2.default 导入
import date from".profile,js"
console.log(name);
/*
模块开发时注意的问题:
a.必须基于服务器环境下边运行
b.导出的时候如果使用了default名称,导入的时候不能加{},import后变量名自定义
c.导出的时候如果未使用default名称,导出的时候加{变量名}变量名与导出时的变量名保持一致
d.每个模板块导出的时候只能包含一个default名称
*/
</script>