前端---JavaScript
函数
定义函数
方式1
绝对函数
function abs(x){
if(x>=0)return x;
else return -x;
}
一旦执行到return 代表函数结束,返回结果
如果没有执行return ,函数执行完也会返回结果,结果就是undefined
一般没有错误就不会报错
方式2
var abs=function(x){
if(x>=0)return x;
else return -x;
}
参数问题
js函数参数可以放入多个,或者不放入,都不会报错
abs(10)
10
abs(11000,212,2312)
11000
无参数报错方法
var abs = function(x){
if(typeof x!=='number'){
throw 'not a Number';
}
if(x>=0)return x;
else return -x;
}
参数多个---arguments
利用aruguments可以利用所有的参数
var abs = function(x){
if(typeof x!=='number'){
throw 'not a Number';
}
for(var i= 0 ;i<arguments.length;i++){
console.log(arguments[i]);
}
if(x>=0)return x;
else return -x;
}
ES6新特性,获取除了已经定义的参数之外的所有参数
function aaa(a,b,...rest){
console.log("a=>",a);
console.log("b=>",b);
console.log(rest);
}
变量作用域
var定义变量实际上是有作用域的,在函数体内声明,则在函数体外不可使用(闭包可以)
内部函数可以访问外部函数的成员
全局对象
全局对象自动绑定在window下
var x = 'dfsafdsafsaf';
alert(x);//等价
alert(window.x);
修改系统函数
var t = window.alert;
t("fadfsaaf");
window.alert = function() {
console.log("灭有弹窗");
};
window.alert();
规范
如果全局变量都绑定在window下,不同js文件会发生冲突-->解决办法
//唯一全局变量
var lxp={};
//定义全局变量
lxp.name = 'liudas';
lxp.add=function(a,b){
return a+b;
}
局部作用域 let
function test2() {
for (var i = 0; i < 100; i++) console.log(i);
console.log(i);
}
function test1() {
for (let i = 0; i < 100; i++) console.log(i);
console.log(i);
}
常量 const
在ES6之前,规定大写命名为常量
方法
定义在类里的函数==方法
function getAge() {
var now = new Date().getFullYear();
return now - this.bitrh;
}
var kuangs = {
name: 'qing',
bitrh: 2020,
age: function() {
var now = new Date().getFullYear();
return now - this.bitrh;
},
age1: getAge
}
kuangs.age1() ok
getAge() NaN window
this是无法指向的,是默认指向调用它的哪个对象
apply
在js种可以控制this的指向
getAge.apply(kuangs,[]);//this.指向了kuangs
# 内部对象
## 标准对象
```javascript
typeof 123
'number'
typeof '123'
'string'
typeof true
'boolean'
typeof NaN
'number'
typeof []
'object'
typeof {}
'object'
typeof Math.abs
'function'
typeof undefined
'undefined'
Date
时间戳
var now =new Date();
now.getSeconds();
now.getTime();// 事件戳 ,转为时间
转为时间
now =new Date(1578106175991);
now.toLocaleString()
json
在javaScript一切皆为对象、任何js支持的类型都可以用JSON来表示:number,string....
格式
- 对象都用{}
- 数组都用[]
- 所有键值对都是用 key:value
var user = {
name: "qinjiang",
age: 3,
sex: '男'
}
//对象转化为json字符串
var jsonUser = JSON.stringify(user);
//json 字符串转化为对象 参数为json字符串
var obj = JSON.parse(jsonUser);
var obj1 = JSON.parse('{"name":"qinjiang","age":3,"sex":"男"}');
面向对象编程
原型 proto
var user={
name:"chen",
age:20,
sex:"男",
run:function(){
console.log(this.name+"run...");
}
}
var xiaoming={
name:"xiaoming"
}
//小明的原型指向了user
xiaoming.__proto__=user;
此时 xiaoming.run(); //得到xiaomingrun...
var bird={
fly:function(){
console.log(this.name+"fly...");
}
}
//小明的原型指向了user
xiaoming.__proto__=bird;
此时 xiaoming.fly(); //得到xiaomingfly...
此时再 xiaoming.run(); //得到Uncaught TypeError: xiaoming.run is not a function at <anonymous>:1:10
class 继承
ES6 引入的
- 定义一个类,属性,方法
//定义一个学生的类,实际上就是类似上面的模板
class Student{
constructor(name){
this.name=name;
}
hello(){
alert("hello")
}
}
var xiaoming=new Student("xiaoming"); //定义一个变量,这里定义完就可以去调用了
var xiaohong=new Student("xiaohong"); //定义一个变量,这里定义完就可以去调用了
xiaoming.hello(); //得到一个弹窗 hello
xiaohong.hello(); //得到一个弹窗 hello
- 继承
class pupil extends Student{
constructor(name,grade){
super(name);
this.grade=grade;
}
myGrade(){
alert("我是一个小学生")
}
}
var xiao=new pupil("xiao",3);
console.log(xiao); //得到 pupil {name: "xiao", grade: 3}
xiao.myGrade(); //得到一个弹窗 我是一个小学生
原型链