Home > Web Front-end > JS Tutorial > Javascript learning js function (summary of experience)

Javascript learning js function (summary of experience)

青灯夜游
Release: 2018-10-29 16:48:20
forward
3135 people have browsed it

This article brings you a summary of the experience of js functions in the process of learning Javascript. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

Javascript functions are event-driven or reusable blocks of code that are executed when they are called. So it is of no use just creating a function without calling it. We must call it to execute it.

1. What is a function

(1) A function is a code segment that completes a certain function

(2) A function is a code segment that can be executed repeatedly

(3) Functions are convenient for maintenance and management

2. What should we pay attention to when creating functions?

(1) Function names are strictly case-sensitive

(2) Repeated function names will cause overwriting

(3) Function names are best semantic

3. Trigger function

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <button onclick="Click()">点击按钮调用函数</button>
    <script>
        function Click(){
            alert('调用成功!');
        }
    </script>
</body>
</html>
Copy after login

4. Function that implements default parameters

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <script>
    function calc(x,y){
        x=x||0;
        y=y||0;
        return x+y;
    }
      alert(calc());
      alert(calc(1,2));
    </script>
</body>
</html>
Copy after login

5. Function in the form of variable parameters

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <script>
        function test(){
            var sum = 0 ;
            var allNum = arguments.length ; //定义allNum为传入参数的个数
            for(var i=0;i<allNum;i++){
                sum+=arguments[i];//sum = sum + arguments[i]
                document.write(arguments[i]);
            }
            return sum;
        }
        alert(test(1,2,4));
    </script>
</body>
</html>
Copy after login

6. Variable scope

(1) Local variables: variables declared in the function body, can only be used within the function body

(2) Global variables: global variables, can be used from the time the variable is declared to the end of the script

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <script>
        var x=1;
        function test(){
            document.write('1.函数体内的x的值为:'+x+'<br />');
            x=19;
            document.write('2.此时函数体内重新对x值赋值,此时x的值为:'+x+'<br />');
        }
        document.write('3.函数体外的x值:'+x+'<br />');//因为读写顺序先执行这段代码然后在执行函数 test()
        test();
        document.write('4.函数体外的x值:'+x+'<br />');
    </script>
</body>
</html>
Copy after login

This is just my personal learning experience. If there are any deficiencies, please point them out. Thank you for the great advice! !

The above is the detailed content of Javascript learning js function (summary of experience). For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:cnblogs.com
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template