<script>
function foo(val){
if (val > 5)
{
console.log('aaa');
}else if(val > 10 )
{
console.log('bbb');
}else if(val > 15)
{
console.log('bbb');
}
}
foo(6);
foo(11);
foo(16);
//其实这里的if...else if相当于python
// 中的if...elif,程序会依次评估寻找第一个结果为true的条件,并且执行对应语句块,结束后跳过整个if/elif/eles结构
// 所以会控制台输出aaa aaa aaa
var b = 10;
(function b(){
b = 20;
console.log(b);
});
</script>
<script>
function demo(){
console.log(arguments.callee)
}
demo();//这里采用的就是es3方法
function test(){
"use strict";//必须写在逻辑的最前面
console.log(arguments.callee);
}
test();//这里用的就是es5模式
</script>
<body>
<*node block inline-block table inherit flex grid*> :display类型
</body>
<script>
//盒子模型 content->padding->border->margin
//margin不占盒子的实际大小(长宽),比如我们自己写的width height就是内容区(content)的宽高
// 改变padding,整个盒子的大小改变,但是margin不会变化
</script>
<style>
div{
width: 100px;
height: 100px;
border: 3px solid red;
zoom: 3;
}
</style>
</head>
<body>
<div>hello</div>
<script>
document.write(parseInt("10") + "<br>");
document.write(parseInt("10.33") + "<br>");
document.write(parseInt("34 45 66") + "<br>");
document.write(parseInt(" 60 ") + "<br>");
document.write(parseInt("40 years") + "<br>");
document.write(parseInt("He was 40") + "<br>");
document.write("<br>");
document.write(parseInt("10",10)+ "<br>");
document.write(parseInt("010")+ "<br>");
document.write(parseInt("10",8)+ "<br>");
document.write(parseInt("0x10")+ "<br>");
document.write(parseInt("10",16)+ "<br>");
</script>
</body>
<script>
// var arr = [1,23,12,90,229];
// //实现max方法,找到数组中最大值
// function maz(arr){
// var temp = arr[0];
// for(var i = 1;i < arr.length;i++){
// if(temp < arr[i]){
// temp = arr[i];//打不过就加入,哈哈
// }
// }
// return temp;
// }
// maz(arr);
var arr = [1,2,3,4,5,67];
function min(arr){
var temp = arr[0];
for(var i = 0;i < arr.length;i++){
if(temp > arr[i]){
temp = arr[i];
}
}
return temp;
}
min(arr);
var arr1 = [12,13,14,15,15,19];
function max(arr){
var temp = arr1[0];
for(var i = 0;i < arr1.length;i++){
if(temp < arr1[i]){
temp = arr1[i];
}
}
return temp;
}
max(arr1);//直接调用函数不能直接实现在控制台显示
// var a = 10;
// var b = 20;
// console.log("a + b" + a + b);//字符串拼接问题,任何问题加字符串还是字符串
// console.log("1" + "2");
// console.log(11+"1" + "2");
// console.log("A" - "B" + "2");
// 计算每个数组的平方,并且返回新的数组
// function Square(arr){
// var arrs = []; //i:0 ~ arr.length-1,数组下标
// for(var i = 0;i <arr.length;i++){
// arrs.push(arr[i] * arr[i]);
// }
// return arrs;
// }
// var arr = [1,2,3,4];
// // var arrs = Square(arr);
// // Square(arr);
// function S(arr){
// return arr.map(function (item){
// return item * item;
// })
// }
// console.log(10 > 9 > 8);
// //比较运算符返回结果是布尔值 TRUE / FALSE
// 10 > 9 : True True > 8 发生隐式转换 -> 1 > 8? 不对,返回false
// var arr = [1,2,3];
// var arr1 = new Array(6);//6是数组长度,返回[undifined * 6] [empty * 6]
// var arr2 = new Array(1,2,3,4); //[1,2,3,4]
// 实现 Remove([1,2,2,2,3],2) -> return [1,3]这样的效果
// function Remove(arr,item){
// var arrs = [];
// for(var i = 0;i < arr.length;i++){
// if(arr[i] !== item){
// arrs.push(arr[i]);
// }
// }
// return arrs
// }
// Remove([1,2,2,2,3],2);
// var num1 = 0.9;
// var num2 = -0.9;
// console.log(parseInt(num1));//0
// console.log(Math.floor(num1));//0
// console.log(parseInt(num2));//-0
// console.log(Math.floor(num2));//-1
// parseInt : 取整,去整数部分,取小数点之前的
// Math.floor:向上取整<=当前数字的最大整数
// // 求和实例
// function sum(arr){
// var total = 0;
// for(var i = 0;i < arr.length;i++){
// total += arr[i];
// }
// return total;
// }
// sum([1,2,3])
// js思考一下下列控制台输出会是什么
// console.log("1" + "2");
// console.log(+ "1" + "2");
// console.log("A" - "B" + 2);
// 解析 首先我们要知道js当中这个+有两个作用,一个用来做运算,一个是是可以做字符串的拼接,
// 比如你在pycharm经常看到+被用来当做字符串拼接,知道这个,那么我们就很轻松就会知道,第一个
// 应该输出12,注意它是字符串类型的数据,你可以搜一下typeof方法,然后用typeof去检测它的数据类型
// ,同理第二个应该也是12(str类型),那么第三个就需要你想想了,-运算符做-对于字符串,结果应该还是字符串,同理的* /,"A" - "B"输出一个非数字,js当中叫NAN,Not A Number简写,然后再做字符串拼接,最后输出NAN2
</script>
//- var str=“hello world”;
//请编写代码统计str中o和l总共出现了多少次?
//(统计两个字母的总次数)
// var str = "Hello World";
// var GetTotal = function(str){
// var count = 0;
// str.split('').forEach(function (item){
// if(item === "l" || item === "o"){
// count++;
// }
// })
// return count;
// }
// console.log(GetTotal(str))
<body>
<p><span>你好</span></p>
<p><a href="">好什么</a></p>
<script>
var a = 10;
function test(){
// var a;虚拟位置,但是确实是在
a = 100;
console.log(a);
console.log(this.a);
var a;
console.log(a)
}
test();
//解析现在函数外声明一个全局变量a并且赋值100,a = 100是个坑,因为未声明的变量未使用会变成全局变量,那么这个a的值是否会覆盖前面的值呢?之后两次打印a,然后在函数内部声明一个a,这里其实就是一个预编译问题,也就是预处理,代码执行之前干的事,什么变量声明提升,函数整体提升,提升到那,形参,实参范围等等知识点,所以这里的var a;相当于变量提升,也就是到了a = 100;的上一行
//this.a默认为window.a,test执行,this指向window,也就是全局
var str = "abc123def456gh789"
var reg0 = /\d{3}/g;//数组形式输出
var reg1 = /\d+/g;//数组形式输出
var reg2 = /(.*?)/g;
console.log(str.match(reg0));
console.log(str.match(reg1));
console.log(str.match(reg2));
<!-- display: flex;弹性布局,实现垂直居中要的一个东西 -->
<!-- flex:1;===flex-grow:1;flex-shrink:1(压缩);flex-basis:0%; flex-grow:1;是把剩余空间分成1分给我,剩余部分是300-100-100=100-->
<div class="flex" style="width: 300px;display: flex;background: black;">
<div class="left" style="width: 100px;height: 100px;background: red;"></div>
<div class="right" style="width: 100px;height: 100px;flex: 1;background: blue;"></div>
</div>
<script>
// es6当中的结构赋值,对应位置相等(原理),b = 1为默认值,当他为undifined/null时,才会默认相等
// var [a,b = 1] = [2,null];
// console.log(a,b); -->2 null
// css3
// transition和animation的区别
// 1.前者是过渡 后者是动画
// 2.transition只能从一种状态过渡到另一种状态
// 3.animation可以定制复杂动画,可以定义动画的区间等
// 4.Transition必须通过一些行为才能触发(js或者伪类),animation可以直接触发
var [a = b,b = 1] = [];//这是es6中的结构赋值(原理是对应位置赋值),[a = b,b = 1]相当于声明两个变量,一个是a,一个是b,只不过在执行a = b,b是undifined,之后b = 1,所以a是undifined b为1
console.log(a,b);//undifined 1
let [x = y,y = 1];//对于let而言,必须先声明后使用,当执行x = y时y还未定义(声明),所以会报出Uncaught SyntaxError: Missing initializer in destructuring declaration这样的错
// 如何定义一个变量?
// 首先,我们需要起一个变量名,然后用等号(=),等号叫做赋值符号,等号右侧是要往这个变量里面存的值,它的含义就是将值赋给变量。
// 注意,它跟我们正常的阅读顺序是不一样的。正常阅读是变量名等于值,实际上程序在执行的时候,是把值存到一个叫这个变量名的空间中,这是赋值等号的含义,是把等号右端的值存到这个空间中。这个空间在内存中就叫这个“变量名”。
console.log(x,y);//报错
// 脱离文档流:float/position:absolute;
// 触发BFC元素:position:absolute float position:flexed;
// A.reletive B.float C.flex D.overfloat:hidden;
</script>
<SCRIPT>
function foo(y = 2,x){
x = x || 1;
console.log(x,y);
}
foo();//1,2
foo(null,null);//1,null
//解析:y = 2;默认值(默认参数)
//foo();没有传参数,所以对于y而言,
//y是undifined,走他的默认值(记住),如果不是undifined,那么以他传过来的参数来走(默认值不是unidifined),因为null对应的boolean值是false
if(a in window){
var a = 10;
}
console.log(a);
//考察的是in运算符,就是说这个值/属性是不是这个对象里面,也就是有没有window.a,之后就是考察预编译,var a = 10;变量提升,相当于有一个var a;在if语句上面,那么a在window上了,因为a已经被定义了,尽管a是undifined,但是a这个属性已经被定义了,所以返回10
<script>
//哪些方法可以判断数据类型
1. Typeof
2. constructor:可被修改
3. instanceof
4. Object.prototype.tostring.call() [object content]
</script>
<style>
*{
color: red;
}
p{
color: green;
}
</style>
</head>
<body>
<p><span>你好</span></p>
<p><a href="">好什么</a></p>
<script>
var a = 10;
function test(){
// var a;虚拟位置,但是确实是在
a = 100;
console.log(a);
console.log(this.a);
var a;
console.log(a)
}
test();
//解析现在函数外声明一个全局变量a并且赋值100,a = 100是个坑,因为未声明的变量未使用会变成全局变量,那么这个a的值是否会覆盖前面的值呢?之后两次打印a,然后在函数内部声明一个a,这里其实就是一个预编译问题,也就是预处理,代码执行之前干的事,什么变量声明提升,函数整体提升,提升到那,形参,实参范围等等知识点,所以这里的var a;相当于变量提升,也就是到了a = 100;的上一行
//this.a默认为window.a,test执行,this指向window,也就是全局
var str = "abc123def456gh789"
var reg0 = /\d{3}/g;//数组形式输出
var reg1 = /\d+/g;//数组形式输出
var reg2 = /(.*?)/g;
console.log(str.match(reg0));
console.log(str.match(reg1));
console.log(str.match(reg2));
</script>
<script>
//let const var的区别
// 1/块级作用域{内面内容}
1.if(){}
2.for(){}
3.{
key:value;
}
//2/重复声明,var可以重复 let和const不能,会报错
//3/暂存性死区 TDZ ,起到对let和const约束作用(先声明后使用的规则)
//4/变量声明提升,--> var
//5/变量的初始值const声明的是常量,一方面不能更改,一方面还必须有值
//6/全局挂载 用var声明的变量会放到作用window上的属性,全局使用
</script>